Одна из самых веселых задач — это построить сайдбар сайта, чтобы это не было хаотичным набором блоков. Давайте посмотрим, что может быть полезным и привлекательным для посетителей.
Отображение свежих комментариев
Есть три способа сделать это, давайте пройдем от самого легкого к сложному:
- Виджет — если сайдбар поддерживает вставку виджетов, то просто перетащите на него встроенный виджет «Свежие комментарии», укажите заголовок и количество отображаемых комментариев. Сохраните, готово 🙂
- Плагин — есть огромное количество плагинов для вывода комментариев, например Get Recent Comments (https://wordpress.org/plugins/get-recent-comments/), для настройки и вывода комментариев. Он создает виджет, который как мы видели выше, прекрасно заменяется встроенным виджетом. Именно поэтому данный плагин заброшен и не развивается и показан только для примера.
- Пользовательская функция — Т.к. комментарии хранятся в базе данных, достать их оттуда труда не составит. Мы создадим свою собственную функцию и добавим ее в functions.php для создания и обработки SQL запроса, который будет собирать самые последние одобренные комментарии. А затем мы создадим цикл для вывода результатов запроса к базе данных и отображения их один за одним.
<?php // display recent comments function dp_recent_comments($no_comments = 10, $comment_len = 35) { global $wpdb; $request = "SELECT * FROM $wpdb->comments"; $request .= " JOIN $wpdb->posts ON ID = comment_post_ID"; $request .= " WHERE comment_approved = '1' AND post_status = 'publish' AND post_password =''"; $request .= " ORDER BY comment_date DESC LIMIT $no_comments"; $comments = $wpdb->get_results($request); if ($comments) { foreach ($comments as $comment) { ob_start(); ?> <li> <a href="<?php echo get_permalink( $comment->comment_post_ID ) . '#comment-' . $comment->comment_ID; ?>">< ?php echo dp_get_author($comment); ?>:</a> < ?php echo strip_tags(substr(apply_filters('get_comment_ text', $comment->comment_content), 0, $comment_len)); ?> </li> < ?php ob_end_flush(); } } else { echo '<li>No Comments</li>'; } } function dp_get_author($comment) { $author = ""; if ( empty($comment->comment_author) ) $author = 'Anonymous'; else $author = $comment->comment_author; return $author; } ?>
Чтобы использовать эту функцию, достаточно вставить в нужное место
<?php dp_recent_comments(6); ?>
что отобразит 6 последних комментариев.
Отображение последних записей
Давайте так же пройдем от самого простого способа к сложному.
- Виджет — Добавляем виджет «Свежие записи», улыбаемся и машем.
- Пользовательская функция — в этот раз нам не придется писать с нуля свою собственную функцию, можно просто использовать wp_get_archives, которая уже нами рассматривалась. И для отображения 5 последних записей используем
<?php wp_get_archives('type=postbypost&limit=5'); ?>
- Пользовательский цикл — в конце концов мы можем делать все, что угодно и напишем свой собственный цикл для вывода последних записей. Также ранее уже приводились примеры подобного использования циклов, сделать можно таким способом
<?php $home_brew = new WP_Query('showposts=10&orderby=date'); while($home_brew->have_posts()) : $home_brew->the_post(); // здесь поиграемся и настроим вывод заголовков, контента, пользовательских полей и т.д. endwhile; wp_reset_postdata(); ?>
Обращаем внимание! Чтобы убедиться, что все последующие функции будут работать корректно, обязательно добавляем тег wp_reset_postdata(); после пользовательского цикла.
Отображение популярных записей
Популярность — понятие еще более широкое, нежели «недавность». Как вы определите популярность записи? На основании числа просмотров? Количества комментариев? Обратных ссылок? Если вы хотите собрать все сразу и в одном флаконе, то попробуйте плагин WordPress Popular Posts (https://wordpress.org/plugins/wordpress-popular-posts/) который как раз и занимается сбором различной информации, чтобы на ее основании определить популярность и вывести список популярных записей в вашем шаблоне:
<?php if (function_exists('get_mostpopular')) get_mostpopular(); ?>
Если же вы хотите оценивать популярность на основании только одного критерия, к примеру, количества комментариев к записи, то этого можно достичь с помощью такого запроса к базе данных:
<ul class="popular-posts"> <?php $popular_posts = $wpdb->get_results("SELECT id,post_title FROM {$wpdb->prefix}posts ORDER BY comment_count DESC LIMIT 0,10"); foreach($popular_posts as $post) { print "<li><a href='". get_permalink($post->id) ."'>". $post->post_title."</a></li>n"; } ?> </ul>
Отображение недавно измененных записей
Можно подумать, что для этого нам опять понадобится какой-то хитрый запрос к базе данных. Мы, конечно, можем, но все гораздо проще и WP_Query с определенным параметром (orderby=modified) может все значительно упростить:
<?php // display recently modified posts $home_brew = new WP_Query('showposts=5&orderby=modified'); while($home_brew->have_posts()) : $home_brew->the_post(); // тут все как обычно- выводим титле и контент endwhile; wp_reset_postdata(); ?>
Отображение случайных записей
И тут все просто. Опять же, WP_Query с параметром orderby=rand обеспечивает случайное отображение серии случайных записей блога:
<?php // display random posts $home_brew = new WP_Query('showposts=3&orderby=rand'); while($home_brew->have_posts()) : $home_brew->the_post(); // тут все как обычно- выводим титле и контент endwhile; wp_reset_postdata(); ?>
Хитрый пример использования этой техники вот какой — можно выводить только одну случайную запись и сохранить функцию в специальный файл шаблона. А затем использовать Ajax для вызова этого шаблона и отображения, например, в сайдбаре. И в результате у вас будет милый блок, в котором будут самостоятельно перегружаться и отображаться разные случайные записи вашего сайта без перезагрузки страницы. (Подробнее тут https://digwp.com/2009/07/display-a-random-post- with-aj ax-refresh/)
Отображение записей из Твиттера
А кто сказал, что мы должны ограничиваться только содержимым нашего сайта? Импортировать свежие твиты из Твиттера может оказаться веселым способом общения с посетителями и всегда оставаться актуальным. У Твиттера есть добротная API система для получения и использования данных. Но, т.к. твиттер периодически падает и бывает недоступен, нельзя становиться в зависимость от него, т.к. это вызовет задержки в загрузке страниц нашего сайта. Поэтому, используя API для получения и отображения различных данных на своих страницах, нужно сделать все так, чтобы это не влияло на загрузку страниц сайта и не выглядело ужасным в результате проблем с API.
Соединение с Twitter API можно целиком сделать с помощью JavaScript, что предпочтительно по нескольким соображениям:
- Соединение с твиттером происходит на клиентской стороне (в браузере посетителя) и не нагружает наш серверхостинг
- Если все сделать правильно — это никак не влияет (отрицательно) на скорость загрузки страниц
- Данные обрабатываются и выводятся на страницу только в случае успеха.
Так давайте это сделаем. Мы будем использовать jQuery, что очень удобно и легко.
Шаг 1. Подключаем jQuery
Добавляем в functions.php этот код. Он загрузит библиотеку jQuery на страницу через вставку кода в секцию <head>
if(!is_admin()) { wp_deregister_script('jquery'); wp_register_script('jquery', ("https://ajax.googleapis.com/ajax/libs/ jquery/1.3.2/jquery.min.js"), false, '1.3.2'); wp_enqueue_script('jquery'); }
Шаг 2. Загружаем скрипт
Нужно использовать специальную библиотеку, которую скачиваем и подключаем в шаблон
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/twitterjs"></script>
Шаг 3. Плагин jQuery
Этот плагин выполняет всю грязную работу по связи с Твиттером и вытягиванием последних твитов. Кроме этого он делает прикольные штучки, типа преобразования сокращенных ссылок в реальные адреса, хеш-тегов в ссылки поиска и @реплаи превращает в ссылки на профиля.
(function($){ $.fn.lastTwitterMessage = function(username){ var $base = this; if(!username || username == "") return this; var url = "https://twitter.com/statuses/user_timeline.json?callback=?"; $.getJSON(url,{count:10,screen_name:username }, function(data){ if(data && data.length >= 1){ try{ var item = null; for(var i = 0; i < data.length; i++){ if(/^@/i.test(data[i].text)) continue; item = data[i]; break; } if(!item) return; var $tweet = $("<p></p> ").text(item.text); $tweet.html( $tweet.html() .replace(/((ftp|http|https)://(w+:{0,1}w*@)?(S+)(:[0-9]+)?(/|/([w#!:.?+=&%@!-/]))?)/gi, '<a href="$1">$1</a>') .replace(/(^|s)#(w+)/g,'$1<a href="https://search.twitter.com/search?q=%23$2">#$2</a>') .replace(/(^|s)@(w+)/g,'$1<a href="https://twitter.com/$2">@$2</a>') ) $tweet.append(" <a href='https://twitter.com/" + username + "'>(∞)</a> ").wrapInner("<span>"); $base.empty().append($tweet).show(); } catch(e) { }; }; }); return this; }; })(jQuery);
WordPress и Twitter
А полученный твит можно как-то так оформить, например, всплывающим облаком в профиле автора в футере сайта.
Шаг 4. Вызов плагина
Вы можете вставить этот код в отдельный JavaScript файл или вписать в существующий (в этом примере мы создаем отдельный файл twitter.js в папке js шаблона). Этим кодом нужно лишь создать элемент для вызова и отображения содержимого плагина
$(function() { $("<div id='tweet'></div>").hide().appendTo("#footer").lastTwitterMessage('chriscoyier'); });
В результате после загрузки страницы, внутрь нового скрытого <div id='tweet'></div> в футере будет записан последний твит аккаунта @chriscoyier и отобразится на странице. Если же не получится — то элемент останется пустым.
А вот тут пример того, как можно встроить на страницу Facebook, Twitter и Google+ https://wp.smashingmagazine.com/2012/01/19/facebook-twitter-google-wordpress/
Импорт и отображение содержимого RSS лент
Ранее в вордпресс был встроен парсер RSS лент MagpieRSS, однако в связи с прекращением его развития, сейчас Вордпресс переключился на SimplePie. И спустя некоторое время разработка SimplePie остановилась. Такое ощущение, что включение библиотеки в WordPress равносильно поцелую смерти для любого парсера фидов.
Но не будем о грустном, наличие встроенного RSS парсера позволяет получать свежий контент с других сайтов и отображать его у себя. Нужно лишь включить файл feed.php, который идет в комплекте Вордпресса, по умолчанию на любую нужную страницу, на которой нужно выполнить парсинг, предварительно выполнив следующие настройки.
<?php // Import & Display Feed if(function_exists('fetch_feed')) { $feed = fetch_feed('https://digwp.com/feed/'); //адрес для парсинга if (!is_wp_error($feed)) : $feed->set_cache_duration(1200); // задаем время кеширования $feed->init(); // выполняем запрос $limit = $feed->get_item_quantity(7); // определяем количество элементов $items = $feed->get_items(0, $limit); // создаем массив endif; } if ($items) { ?> <ul> <?php foreach ($items as $item) { ?> <li> <div> <strong> <a href="<?php echo $item->get_permalink(); ?>"> <?php echo $item->get_title(); ?></a> <strong> <em><?php echo $item->get_author(); ?></em> </div> <div><?php echo $item->get_description(); ?></div> <div><?php echo $item->get_date('j F Y'); ?></div> </li> <?php } ?> </ul> <?php } ?>
Разместив этот код в sidebar.php или в любом другом нужном месте, мы сможем наслаждаться несколькими последними записями с другого сайта, отображаемыми на нашем сайте.
Первая часть скрипта подготавливает и выполняет запрос, вторая часть выполняет разметку и отображение результатов запроса. Каждая запись содержит заголовок с ссылкой на оригинальный пост, имя автора, запись и дату публикации.
Конечно же, все настраивается любым нужным способом, документацию по Simplepie можно посмотреть тут http ://simplepie.org/wiki/ reference/start