Форматирование зоны комментариев в WordPress

Лезть в код или не лезть? Раньше мы уже говорили, что форма комментариев немного сложна, и поэтому создатели все максимально упростили.

Функция вызова комментариев простая и не имеет параметров

<?php wp_list_comments(); ?>

Выглядит просто, но делает очень много. Фактически она создает огромное количество html кода и использует кучу php кода. Т.к. эта функция генерирует весь готовый html код, то нам придется иметь с ним дело без возможности как-то отрегулировать или настроить использованием параметров. Это может быть определенной проблемой, с учетом того, что мы не очень можем этот html код изменить. Не нравятся классы div? Не хотите использовать граватары? Желаете изменить порядок вывода строк?

Со всем этим придется смириться и скрывать ненужные вещи с помощью css. С этой точки зрения вам нужно будет определиться – по какому пути предпочтений вы пойдете:

wp_list_comments

• легко использовать
• встроенный функционал комментирования
• встроенный функционал разбития на страницы
• встроенный функционал древовидного отображения
• css классы по умолчанию для базовых задач

Кроме этого есть старый добрый метод вывода комментариев с помощью цикла foreach, поэтому нам еще есть с чем разобраться.

wp_list_comments() или пользовательский цикл?

До версии 2.7 цикл вывода комментариев был на базе запросов к базе данных и отображался несколько извилистым, но хорошо понятным путем.

<?php foreach ($comments as $comment) : ?>
<?php comment_author_link(); ?>
<?php comment_text() ?>
<?php endforeach; ?>

Затем комментарии были обогащены дополнительным функционалом — постраничной навигацией и древовидной вложенностью. Эти возможности активировались через админку, и цикл foreach был заменен на уже показанную функцию wp_list_comments. Однако этот цикл по прежнему остается работоспособен, правда по понятной причине не поддерживая дополнительный функционал.

Хотя wp_list_comments и не выглядит как цикл, но она делает все тоже самое, повторяет раз за разом запросы и вывод комментариев, пока они не закончатся, размечая их соответствующими тегами.

Обычно готовый хтмл код одного комментария выглядит примерно так:

<ol class="commentlist">
 <li class="comment even thread-even depth-1" id="comment-1">
 <div id="div-comment-1" class="comment-body">
 <div class="comment-author vcard">
 <img alt='' src='https://www.gravatar.com/avatar/' class='avatar avatar-32 photo avatar-default' height='32'
width='32' />
 <cite class="fn">
 <a href='https://wordpress.org/' rel='external nofollow' class='url'>Имя комментатора</a></cite> <span 
class="says">says:</span>
 </div>
 <div class="comment-meta commentmetadata">
 <a href="https://localhost/283/2009/08/hello-world/comment-page-1/#comment-1">August 13, 2009 at 
3:08 pm</a>
 </div>
 <p>Спасибо, у вас супер сайт!</p>
 <div class="reply"></div>
 </div>
 </li>
</ol>

Как видно, цикл вывода комментария содержит картинку-граватар, несколько дивов, много разных css классов, ссылку на автора и собственно текст комментария. Если это вас устраивает — то это хорошо, больше ничего делать и не нужно.

В этом случае вы можете протянуть свои руки только к следующим доступным параметрам wp_list_comments:

• размер аватары по умолчанию 32 пикселя
• стили css — используя их названия можно изменить параметры на нужные
• стиль вывода списка комментариев style. По умолчанию комментарии выводятся тегами неупорядоченного списка <ul>, но если вы вместо этого хотите использовать упорядоченный список <ol>, то используйте такой параметр <?php wp_list_comments(array('style' => 'ol')); ?>
• тип type — строковый параметр, отвечающий за отображаемые комментарии. Доступные параметры — all, comment, trackback, pingback, pings. Pings означает, что будут выводиться вместе и трекбеки, и пингбеки. По умолчанию параметр равен all, т.е. все комментарии отображаются.
• текст ответа reply_text — определяющий, что будет написано на ссылке ответа на комментарий, обычно «Ответить»
• текст авторизации login_text — отображается в случае, если для ответа необходимо авторизироваться на сайте, обычно «Авторизируйтесь для комментирования»
• callback — имя пользовательской функции для отображения комментариев.
• Дополнительные параметры, доступны тут

Это немного, но в большинстве случаев достаточно для минимально необходимых модификаций. Если нужно больше, то придется использовать пользовательский цикл либо вмешиваться в php код, написанный в comments.php, либо добавлять нужный функционал в functions.php.

Шаманим в functions.php

Для начала укажем в comments.php, что мы будем использовать свою пользовательскую функцию

<ul class="commentlist">
<?php wp_list_comments('type=comment&callback=mytheme_comment'); ?>
</ul>

Теперь создадим в functions.php свою пользовательскую функцию

<?php function mytheme_comment($comment, $args, $depth) {$GLOBALS&#91;'comment'&#93; = $comment; ?>
<li <?php comment_class(); ?> id="li-comment-<?php comment_ID(); ?>">
<div id="comment-<?php comment_ID(); ?>">
<div class="comment-author vcard">
<?php echo get_avatar($comment,$size='48',$default='<path_to_url>' );?>
<?php printf(__('<cite class="fn">%s</cite>
<span class="says">says:</span>'), get_comment_author_link()); ?>
</div>
<?php if ($comment->comment_approved == '0') : ?>
<em><?php _e('Your comment is awaiting moderation.'); ?></em>
<?php endif; ?>
<div class="comment-meta commentmetadata">
<a href="<?php echo htmlspecialchars( get_comment_link( $comment->comment_ID ) ) ?>">
<?php  printf(__('%1$s at %2$s'), get_comment_date(), get_comment_time()) ?>
</a><?php edit_comment_link(__('(Edit)'),' ','') ?></div>
<?php comment_text(); ?>
<div class="reply">
<?php comment_reply_link(array_merge($args, array('depth' => $depth,'max_depth' => 
$args['max_depth']))); ?>
</div>
</div>
<?php}&#91;/php&#93;

<p>Обратите внимание, что мы не закрываем тег &lt;li&gt;, т.к. вордпресс автоматически создаст закрывающие теги в зависимости от разметки вложенных комментариев.</p>

<p>Будучи размещенным, данная функция будет вызываться при генерации комментариев и позволяет вносить в себя любые нужные правки. Фишка в том, что мы сделали все, что нам нужно, используя стандартную и достаточно ограниченную в настройках <span class="marker">wp_list_comments()</span></p>

<p>А теперь давайте тряхнем стариной &ndash; вместе с wp_list_comments поставим цикл foreach</p>


<?php if (function_exists('wp_list_comments')) : ?>
<?php wp_list_comments(); ?>
<?php else : ?>
<?php foreach ($comments as $comment) : ?>
<?php comment_author_link(); ?>
<?php comment_text() ?>
<?php endforeach; ?>
<?php endif; ?>

Такое использование позволит шаблону быть обратно совместимым со старыми версиями вордпресса.

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

Реализуем постраничные комментарии

Заранее никто не знает, что контент на сайте может привлечь сотни комментариев. К чему я клоню — мы все суперзвезды и успех может придти неожиданно. Запись с сотней комментариев может быть безумно длинной для просмотра и перемотки. В общем, мы конечно не боимся вертикальной прокрутки (в отличие от горизонтальной), но границы должны быть у всего. Типичный пост с 60 комментариями может быть до 20 тыс. пикселей в высоту!

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

Включив постраничную навигацию, не забудьте добавить в файл comments.php функции для вывода ссылок «Раньше» «Позже»

<?php previous_comments_link(); ?><?php next_comments_link(); ?>

Эти ссылки будут автоматически появляться и разбивать простынку комментариев, при превышении заданного количества комментариев на одну страницу. Если комментариев меньше этого числа — ссылки не будут отображаться.

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

• https://yoursite.com/ghost-dad-rocked/
• https://yoursite.com/ghost-dad-rocked/comments-page-1/
• https://yoursite.com/ghost-dad-rocked/comments-page-2/
• https://yoursite.com/ghost-dad-rocked/comments-page-3/

Понятно, что на этих страницах разными будут только комментарии. Что еще больше ухудшает общую картину — каждый комментарий имеет свою собственную уникальную ссылку с временем публикации, что еще добавляет пачку дублей. Поэтому поисковый бот обнаружит один и тот же контент под огромным количеством разнообразных ссылок.

Чтобы избежать дублирования, есть несколько решений:

1. Не использовать постраничные комментарии
2. Использовать мета-теги для создания канонических урл для каждой записи
3. Использовать плагин SEO for Paged Comments

Если ваш сайт супер-популярный или собирается таким стать, то конечно лучше использовать канонические урлы. Если же бурные обсуждения не планируются, то проще использовать традиционные простынки комментариев без разбития на страницы.

SEO for Paged Comments применяет еще более радикальный способ — убирая содержимое записи с страниц комментариев и заменяя на цитату или урезанную версию записи.

Реализуем вложенные комментарии

Вложенные древовидные комментарии позволяют посетителям писать ответ выбранному существующему комментарию, создавая развернутое обсуждение диалог. После активации этой возможности в настройках, возле каждого комментария появится ссылка «Ответить», позволяющая высказаться по конкретному комментарию.

До появления такой возможности существовал стиль ответа выбранному автору, используя в тексте комментария его имя и знак @, типа «@Вася ты не прав!» С некоторой трансформацией этот способ прижился во многих приложениях в интернете и живет до сих пор, например, в твиттере. А в современных версиях вордпресса такое упоминание не нужно использовать.

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

Если ваш шаблон не поддерживает такой вид комментирования, есть легкий способ добавить такую возможность:

1. Делаем резервные копии файлов, что по идее должно уже войти в привычку
2. Включаем вложенные комментарии в настройках Параметры→Настройки обсуждения→Разрешить древовидные комментарии
3. Добавляем следующий код в header.php сразу же перед wp_head()

   <?php if (is_singular() AND comments_open() AND (get_option('thread_comments') == 1)) wp_enqueue_script('comment-reply'); ?>

4. Добавляем в comments.php непосредственно перед закрывающим тегом </form>

   <?php comment_id_fields(); ?>

5. Проверяем, что <textarea> шаблона содержит атрибут id="comment"
6. Проверяем, что форма комментариев заключена в <div> с атрибутом id="respond"
7. Добавляем ссылку отмены комментария прямо перед формой комментариев

   <div><?php cancel_comment_reply_link(); ?></div>

8. В comments.php заменяем старый цикл на обновленный

   <?php if (have_comments()) : ?>
   <ol class="commentlist">
   <?php wp_list_comments(); ?>
   </ol><?php else : // this is displayed if there are no comments so far ?>
   <?php if ('open' == $post->comment_status) : ?>
   <p class="nocomments">Somebody say something!</p>
   <?php else : // comments are closed ?>
   <p class="nocomments">Comments are closed.</p>
   <?php endif; ?>
   <?php endif; ?>

Ну и собственно все 🙂 Традиционно есть триллион различных способов, чтобы настроить и переделать под свои нужды, но суть, я думаю, вы уловили. Останется только не забыть настроить стили для вложенных комментариев

.commentlist li.depth-1 {}
.commentlist li.depth-2 {}
.commentlist li.depth-3 {} 

Разделяем комментарии, пингбеки и трекбеки

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

Это один из самых старых трюков и есть много способов его воплотить, вот вам пример простого разделения путем применения параметров wp_list_comments():

<h3>Комментарии</h3>
<ol class="comments">
<?php wp_list_comments('type=comment'); ?>
</ol>
<h3>Pingbacks/Trackbacks</h3>
<ol class="pingbacks-trackbacks">
<?php wp_list_comments('type=pings'); ?>
</ol>

Правда у этого кода есть недостаток — заголовки будут выводиться даже если комментариев или пингов нет. Будет лучше использовать несколько улучшенный вариант:

<?php if (!empty($comments_by_type&#91;'comment'&#93;)) : ?>
<h3>Комментарии</h3>
<ol class="comments">
<?php wp_list_comments('type=comment'); ?>
</ol>
<?php endif; ?>
<?php if (!empty($comments_by_type&#91;'pings'&#93;)) : ?>
<h3>Trackbacks/Pingbacks</h3>
<ol class="pingbacks-trackbacks">
<?php wp_list_comments('type=pings'); ?>
</ol>
<?php endif; ?>

Во время отображения пингбеков выводится ссылка с куском текста вокруг нее, взятым с ссылающегося сайта. Этот сниппет может быть различного размера и сложно его контролировать, т.к. заранее не известно, что там будет выведено. К счастью, можно очистить отображение этого текста, выводя лишь только аккуратный список ссылок. Для этого нужно в functions.php добавить

function cleanPings($comment, $args, $depth) {
$GLOBALS['comment'] = $comment;
echo '<li>'.comment_author_link().'</li>';}

А затем добавить требуемый callback параметр в вызов функции комментариев

<?php wp_list_comments('type=pings&callback=cleanPings'); ?>

Уничтожаем пингбеки и трекбеки

Нельзя запретить людям ссылаться на ваш сайт, но можно не отображать трекбеки и пингбеки на них. Изначально, как впрочем и многое другое в интернете, пингбеки придумывались для хороших целей — информирование о том, что кто-то на вас сослался. И сейчас еще кое-кто продолжает их использовать и выводить. Но вот технология трекбеков полностью дискредитировала себя из-за массового спама, поэтому будет лучше их отключить.

Отключаем отображение пингов из админки

Для этого в настройках Обсуждения убираем галочки с опции Разрешить оповещения с других блогов. Это полностью отключает функционал пингбеков и трекбеков, однако для отдельно выбранной записи можно включить эту возможность в настройках.

Исключаем пинги из комментариев

Используем параметр для функции wp_list_comments(), разрешая только вывод комментариев

<?php wp_list_comments('type=comment'); ?>

Удаляем wp-trackback.php

Это очень простой и эффективный способ — физическое удаление файла wp-trackback.php из корневой директории вордпресса. Это абсолютно безопасный способ, но файл восстанавливается после апгрейда вордпресс и его нужно будет удалить заново.

Отключаем с помощью плагинов

Это можно сделать с помощью плагина Disable Trackbacks

Сам по себе плагин очень простой и состоит всего из одного файла, поэтому его содержимое можно просто скопировать и вставить в файл functions.php

class DisableTrackbacks {
function DisableTrackbacks() {add_action('pings_open', array(&$this, 'pings_open'));}
function pings_open($open) {return ('1' == get_query_var('tb')) ? FALSE : $open;}
}
add_action('plugins_loaded', create_function('', 'global $DisableTrackbacks; $DisableTrackbacks = new 
DisableTrackbacks();'));

После размещения, функция DisableTrackbacks уничтожает все трекбеки. А пингбеки остаются.

Контролируем комментарии непосредственно в базе данных

Вордпресс предлагает несколько способов контроля над тем, открыта ли запись для комментирования или нет. В админке можно полностью запретить на всем сайте оставлять комментарии к будущим записям. Также в отдельно взятой записи в редакторе можно выбрать в блоке Обсуждения будет ли к ней открыто комментирование или нет.

Но прямо над этими способами находится плагин Auto Moderate Comments, позволяющий все старые комментарии по истечении заданного срока скрывать, отправляя на модерацию. И без всяких плагинов включатьотключать комментирование можно простыми запросами к базе данных.

Глобально разрешаем пинги для всех пользователей

UPDATE wp_posts SET ping_status = 'open';

Глобально запрещаем пинги для всех пользователей

UPDATE wp_posts SET ping_status = 'closed';

Глобально запрещаем пинги до определенной даты публикации

UPDATE wp_posts SET ping_status = 'closed' WHERE post_date < '2009-09-09' AND post_status = 'publish';

Такие запросы позволяют периодически проводить чистку. А вот пример запросов для глобального разрешения или запретов комментирования

UPDATE wp_posts SET comment_status = 'open', ping_status = 'open' WHERE comment_status = 'closed' AND post_status = 'publish';

И пример запроса для заданной даты

UPDATE wp_posts SET comment_status = 'closed', ping_status = 'closed' WHERE post_date < '2009-09­09' AND post_status = 'publish';