Последние комментарии с аватаркой без плагина Последние комментарии с аватаркой без плагина

Последние комментарии с аватаркой без плагина

комментарии с аватаркой

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

комментарии с аватаркой

Комментарии с аватаркой без плагина вордпресс

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php $comments = get_comments('status=approve&number=4'); ?><ul class="widgcomm">
<?php foreach ($comments as $comment) { ?>
    <li class="comcont"><?php
        $title = get_the_title($comment->comment_post_ID);
        echo get_avatar($comment,$size='60',$default='http://fin-dolg.ru/wp-content/uploads/2015/03/i.jpg' );        echo '<span class="tecom">' . ($comment->comment_author) . '';
        ?> </span><br />к посту:<a class="auth" href="<?php echo get_permalink($comment->comment_post_ID); ?>"
           rel="external nofollow" title="<?php echo $title; ?>">
           <?php echo $title; ?> </a>
		"<?php
        echo  '<span class="tecom">' . wp_html_excerpt( $comment->comment_content, 0 ) . '</span>'; ?>.."
    </li>
<?php }  ?> </ul>

строки, выделенные желтым цветом, читаем пояснения
строка 1 — число «4» указывает, сколько комментариев будет отображаться.
строка 6 — число «60» — это размер аватарки, также вы можете установить свою индивидуальную аватарку для комментариев которые не подключили свою почту к граватар для этого необходимо создать аватарку размером 60*60 и загрузить ее затем меня url ‘http://fin-dolg.ru/wp-content/uploads/2014/07/ava.jpg’на свой.

Данный код размещаем в выджете — текст

виджет с комментариями

Клик для увеличения

Переходим в админку — Внешний вид — Виджеты, переносим текстовый отмечен — 1 в сайдбар, 2 — вставляем код, 3 — сохраняем.

Внимание!
Если вы используете бесплатный шаблон WP или шаблон который не оптимизировался тогда может возникнуть ошибка, примерно такая
ошибка кода
для того чтобы этого не было необходимо подключить поддержку php для виджетов, сделать это можно двумя способами, первый — установить плагин WP PHP widget, второй использовать ниже приведенный код, разместив его в файле functions.php своего шаблона (темы) до закрытого знака ?> найдете в конце файла.

1
2
3
4
5
6
7
8
9
10
function php_in_widgets($widget_content) {
	if (strpos($widget_content, '<' . '?') !== false) {
		ob_start();
		eval('?' . '>' . $widget_content);
		$widget_content = ob_get_contents();
		ob_end_clean();
	}
	return $widget_content;
}
add_filter('widget_text', 'php_in_widgets', 99);

Открываем файл style.css своего сайта и прописываем стили, которые расставят точки над «И» и придадут нормальный внешний вид

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
ul.widgcomm {
	margin-left: 0;
	list-style: none;
}
li.comcont {
   clear:both;
   min-height: 60px;
   margin-bottom: 5px;
}
.widgcomm .avatar {float: left;margin: 0 10px 0 0;-webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px;}
 
span.tecom {
	font-weight: bold;
	color: #31B225;
}
a.auth {
 color: #05788e !important;
 transition:0.2s all;
}
a.auth:hover {
    color: #fb7c0a !important;
}

На этом все. Работы на 3 минуты.

Удачи.

С уважением, Андрей Юрийчук

Черкани пару строк


875d4234

WordPress: 8.23MB | MySQL:64 | 1,232sec