Добавляем древовидные комментарии в блог
2 часа до поездки по работе, поэтому набросаю статью.
Комментарии в WordPress — очень важная часть для удобства пользователей. Конечно, никто не мешает прикрутить виджет комментариев от соцсетей. Но соцсетей много, и люди используют их по разному в зависимости от своих вкусов и требований.
Я считаю, что наиболее удобная схема такая — если пользователь захотел оставить комментарий, ему гораздо удобнее войти через наиболее часто используемую соцсеть и оставить комментарий, чем регистрироваться на сайте или писать комментарий в отдельный виджет, будь то Facebook или ВКонтакте. Сейчас я распишу, как такая схема реализована на моем сайте.
Начнем с шаблона comments.php — его вы можете найти в папке с темой. Если его нет — создайте.
Листинг comments.php:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 |
<?php if (comments_open()) { $fields = array( 'author' => '<p class="comment-form-author"><label for="author">' . __('Name') . ($req ? '<span class="required">*</span>' : '') . '</label><input type="text" id="author" name="author" class="author" value="' . esc_attr($commenter['comment_author']) . '" placeholder="" pattern="[A-Za-zА-Яа-я]{3,}" maxlength="30" autocomplete="on" tabindex="1" required' . $aria_req . '></p>', 'email' => '<p class="comment-form-email"><label for="email">' . __('Email') . ($req ? '<span class="required">*</span>' : '') . '</label><input type="email" id="email" name="email" class="email" value="' . esc_attr($commenter['comment_author_email']) . '" placeholder="example@example.com" maxlength="30" autocomplete="on" tabindex="2" required' . $aria_req . '></p>', 'url' => '<p class="comment-form-url"><label for="url">' . __('Website') . '</label><input type="url" id="url" name="url" class="site" value="' . esc_attr($commenter['comment_author_url']) . '" placeholder="www.example.com" maxlength="30" tabindex="3" autocomplete="on"></p>' ); $args = array( 'comment_notes_after' => '', 'comment_field' => '<p class="comment-form-comment"><label for="comment">' . _x('Comment', 'noun') . '</label><textarea id="comment" name="comment" class="comment-form input-xlarge" rows="4" aria-required="true" placeholder="Текст сообщения..."></textarea></p>', 'label_submit' => 'Отправить', 'fields' => apply_filters('comment_form_default_fields', $fields) ); comment_form($args); ?> <h3 class="comments-caption">Комментарии:</h3> <?php if (get_comments_number() == 0) { ?> <ul class="list"> <li>Оставьте первый комментарий - автор старался</li> </ul> <?php } else { ?> <ul class="media-list"> <?php function metadone_comment($comment, $args, $depth) { $GLOBALS['comment'] = $comment; ?> <li <?php comment_class(); ?> class="media" id="li-comment-<?php comment_ID() ?>"> <a class="pull-left" href="#" style="padding: 1%;"> <?php echo get_avatar($comment, $size = '64', $default = '<path_to_url>'); ?> </a> <div class="media-body"> <h4 class="media-heading"> <?php printf(__('<cite class="fn">%s</cite> <span class="says"></span>'), get_comment_author_link()) ?> <span><?php printf(__('%1$s в %2$s:'), get_comment_date(), get_comment_time()) ?></span> </h4> <div class="media"> <div id="comment-<?php comment_ID(); ?>" > <?php if ($comment->comment_approved == '0') : ?> <em><?php _e('Your comment is awaiting moderation.') ?></em> <br> <?php endif; ?> <?php comment_text() ?> <span> <?php comment_reply_link(array_merge($args, array('depth' => $depth, 'max_depth' => $args['max_depth']))) ?> </span> </div> </div> </div> <?php } $args = array( 'reply_text' => 'Ответить', 'callback' => 'metadone_comment' ); wp_list_comments($args); ?> </ul> <?php } ?> <?php } else { ?> <h3>Обсуждения закрыты для данной страницы</h3> <?php } ?> |
Теперь по порядку. Начнем с этих строк:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
$fields = array( 'author' => '<p class="comment-form-author"><label for="author">' . __('Name') . ($req ? '<span class="required">*</span>' : '') . '</label><input type="text" id="author" name="author" class="author" value="' . esc_attr($commenter['comment_author']) . '" placeholder="" pattern="[A-Za-zА-Яа-я]{3,}" maxlength="30" autocomplete="on" tabindex="1" required' . $aria_req . '></p>', 'email' => '<p class="comment-form-email"><label for="email">' . __('Email') . ($req ? '<span class="required">*</span>' : '') . '</label><input type="email" id="email" name="email" class="email" value="' . esc_attr($commenter['comment_author_email']) . '" placeholder="example@example.com" maxlength="30" autocomplete="on" tabindex="2" required' . $aria_req . '></p>', 'url' => '<p class="comment-form-url"><label for="url">' . __('Website') . '</label><input type="url" id="url" name="url" class="site" value="' . esc_attr($commenter['comment_author_url']) . '" placeholder="www.example.com" maxlength="30" tabindex="3" autocomplete="on"></p>' ); $args = array( 'comment_notes_after' => '', 'comment_field' => '<p class="comment-form-comment"><label for="comment">' . _x('Comment', 'noun') . '</label><textarea id="comment" name="comment" class="comment-form input-xlarge" rows="4" aria-required="true" placeholder="Текст сообщения..."></textarea></p>', 'label_submit' => 'Отправить', 'fields' => apply_filters('comment_form_default_fields', $fields) ); comment_form($args); ?> |
Здесь мы немного искаверкаем стандартную форму для комментариев, оставив только поле для ввода текста комментария. Если пользователь не авторизован — выведется предложение авторизоваться. Так же на данном блоге есть вход через соцсети. Подробнее об этом — в ближайших статьях.
Продолжим разбирать шаблон для вывода комментариев.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
function metadone_comment($comment, $args, $depth) { $GLOBALS['comment'] = $comment; ?> <li <?php comment_class(); ?> class="media" id="li-comment-<?php comment_ID() ?>"> <a class="pull-left" href="#" style="padding: 1%;"> <?php echo get_avatar($comment, $size = '64', $default = '<path_to_url>'); ?> </a> <div class="media-body"> <h4 class="media-heading"> <?php printf(__('<cite class="fn">%s</cite> <span class="says"></span>'), get_comment_author_link()) ?> <span><?php printf(__('%1$s в %2$s:'), get_comment_date(), get_comment_time()) ?></span> </h4> <div class="media"> <div id="comment-<?php comment_ID(); ?>" > <?php if ($comment->comment_approved == '0') : ?> <em><?php _e('Your comment is awaiting moderation.') ?></em> <br> <?php endif; ?> <?php comment_text() ?> <span> <?php comment_reply_link(array_merge($args, array('depth' => $depth, 'max_depth' => $args['max_depth']))) ?> </span> </div> </div> </div> <?php } $args = array( 'reply_text' => 'Ответить', 'callback' => 'metadone_comment' ); wp_list_comments($args); ?> |
Особое внимание на функцию wp_list_comments и её аргумент ‘callback’ -все просто, мы используем функцию metadone_comment для вывода комментариев.
Теперь нам остается вставить функцию
|
1 |
<?php comments_template(); ?> |
в шаблон single.php в место, где вы планируете вывести комментарии. Надеюсь данная статья поможет вам с вашими сайтами ^_^
Теги: wordpress комментарии статьи
Шикарно тут у Вас. ) Надо будет еще зайти.