Пост с картинкой wordpress

Подбирая шаблон для своего сайта, всегда приходится «допиливать» дизайн под себя. Тем более когда речь идет о создании дизайна с нуля. Не так давно мне понадобилась возможность вывода поста определенной категории в определенном месте. Передо мной встала задача следующего содержания:

1.Вывод заголовка поста
2.Вывод анонса определенной длины
3.Вывод картинки поста
4.Вывод в определенном месте
5.Вывод определенной категории

Я сразу же кинулся в гугл и много чего нашел, но как это часто бывает, нашел не совсем то, что нужно. Одни решения выводили только заголовок статьи с картинкой, другие не выводили картинку вовсе, третьи предлагали в каждой статье отмечать ту картинку, которая будет служить миниатюрой, или же создавать изображение в отдельной папке. Как-то всё это очень не удобно, да и хотелось реализовать вывод поста с картинкой без плагина.

В итоге я плюнул, и решил сам написать, позаимствовав некоторые функции из найденных решений.

Итак нам понадобятся две функции – вывод анонса и вывод картинки:

Функция номер раз: поиск первой картинки в посте (функция не моя, подсмотрел где-то на блоге):

[php]
function catch_that_image() {
global $post, $posts;
$first_img = ”;
ob_start();
ob_end_clean();
$output = preg_match_all(‘/<img.+src=[\’"]([^\’"]+)[\’"].*>/i’, $post->post_content, $matches);
$first_img = $matches [1] [0];

if(empty($first_img)){
$first_img = "/images/default.jpg";
}//изображение по умолчанию, если в статье нет изображение
return $first_img;
}
[/php]

Функция номер два – вывод анонса поста, с фиксированным числом символов (тоже не моё):

[php]
function the_content_limit($max_char, $more_link_text = ‘(more…)’, $stripteaser = 0, $more_file = ”) {
$content = get_the_content($more_link_text, $stripteaser, $more_file);
$content = apply_filters(‘the_content’, $content);
$content = str_replace(‘]]>’, ‘]]&gt;’, $content);
$content = strip_tags($content);

if (strlen($_GET[‘p’]) > 0) {
echo "<p>";
echo $content;
echo "&nbsp;<a href=’";
the_permalink();
echo "’>"."Read More &rarr;</a>";
echo "</p>";
}
else if ((strlen($content)>$max_char) && ($espacio = strpos($content, " ", $max_char ))) {
$content = substr($content, 0, $espacio);
$content = $content;
echo "<p>";
echo $content;
echo "…";
echo "<div style=’clear:left; ‘></div><br/><a href=’";
the_permalink();
echo "’ style=’text-align:right;color: #000;’>".$more_link_text."</a>";
echo "</p>";
}
else {
echo "<p>";
echo $content;
echo "&nbsp;<a href=’";
the_permalink();
echo "’>"."Read More &rarr;</a>";
echo "</p>";
}
}
[/php]

Обе эти функции копируем друг за другом в файл functions.php нашей темы.

Теперь дело за малым – вывести на страницы нашего блога. Прежде всего необходимо сделать конструкцию из div-ов, т.е. определиться как внешне будет выглядеть пост. Я для себя выбрал следующую структуру: название поста, ниже слева изображение, справа его обтекает текст статьи. Пример можно увидеть на этом сайте справа в сайдбаре.

Код который нужно разместить в месте где планируете вывод (в моем случае – это sidebar.php):

[php]
<div align="left" >
<?php query_posts(‘cat=77&showposts=10’); ?>
<!–вывод категории 77, количество постов 10–>
<h2>заголовок для постов</h2>

<div >

<?php if (have_posts()) : while (have_posts()) : the_post();?>
<div class="experiense"><a href="<?php the_permalink() ?>" ><?php the_title() ?></a></div>

<div>
<img src="<?php echo catch_that_image() ?>" alt="<?php the_title(); ?>" width="80"/>
<!–width="80" – ширина миниатюры–>
<div>
<?php the_content_limit(200, "[узнать больше…]"); ?>
<!–вывод анонса в 200 символов, [узнать больше…] будет выводиться после анонса–>

</div>
</div>
<?php endwhile; else: ?>
<?php endif; ?>
<?php>wp_reset_query();?>
</div>
</div>
[/php]

Вот, собственно и все. Задача выполнена, я получил то что хотел, если кому-то статья окажется полезной – рад стараться.