Добавляем виджет последних комментариев с аватарами авторов в Blogger

День добрый, дорогие читатели!
Сегодня я покажу Вам как сделать просто, но в то же время  функциональный виджет последних комментов для сайтов на блог-платформе Blogger.

1. Как установить виджет?
2. Настройка виджета последних комментариев
3. Мне не нравиться аватар для анонимов!

Как установить виджет?

1. Заходим в Панель управления и выбираем нужны блог.
2. В сайдбаре слева выбираете вкладку  Дизайн,  а затем на обновившейся странице нажимаете на Добавить виджет. 

3. В открывшемся окне из списка виджетов выбирайте HTML/JavaScript (нажатием на значок  + 

4. Вводим заголовок виджета, а во второе поле - вставляем весь код, который указан ниже. 

<style type="text/css">
ul.helploggercomments{list-style: none;margin: 0;padding: 0;}
.helploggercomments li {background: none !important;margin: 0 0 6px  !important;padding: 0 0 6px 0 !important;display: block;clear:  both;overflow: hidden;list-style: none;word-break:break-all;}
.helploggercomments li .avatarImage {padding: 3px;
background: #fefefe;-webkit-box-shadow: 0 1px 1px #ccc;-moz-box-shadow: 0  1px 1px #ccc;box-shadow: 0 1px 1px #ccc;float: left;margin: 0 6px 0  0;position: relative;overflow: hidden;}
.avatarRound {-webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;}
.helploggercomments li img {padding: 0px;position: relative;overflow: hidden;display: block;}
.helploggercomments li span {margin-top: 4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
    // Настройки виджета
    var
 numComments  = 5,
 showAvatar  = true,
 avatarSize  = 60,
 roundAvatar = true,
 characters  = 40,
 defaultAvatar  = "https://4.bp.blogspot.com/-SRSVCXNxbAc/UrbxxXd06YI/AAAAAAAAFl4/332qncR9pD4/s1600/default-avatar.jpg",
 hideCredits = true;
//]]>
</script>
<script type="text/javascript"  src="https://helplogger.googlecode.com/svn/trunk/helplogger/[helplogger.blogspot.com]recent-comments.js"></script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&callback=helploggercomments&max-results=5"></script><div  style="font-size: 10px; float: right; margin-top: -15px">Получить свой виджет<a  href="https://helplogger.blogspot.com/2012/03/add-recent-comments-widget-with-avatar.html"  rel="nofollow" >Виджет Последних комментариев"</a></div>

Скачать скрипт с Google.Drive | Скачать с сервера 1 | Скачать с сервера 2

Настройка виджета последних комментариев

numComments  = 5,  // количество отображаемых комментариев в виджете
showAvatar  = true, // true - отображает аватар автора коммента; false - не отображает
avatarSize  = 60, // размер аватара в пикселах
roundAvatar = true, // true - круглые аватары; false - пользовательские
characters  = 40, // количество символов коммента, которые будут отображены в виджете  
defaultAvatar  = "https://4.bp.blogspot.com/-SRSVCXNxbAc/UrbxxXd06YI/AAAAAAAAFl4/332qncR9pD4/s1600/default-avatar.jpg", // URL-адрес аватара для анонимных пользователей
hideCredits = true; // true - строчка об авторе скрыта; false - строчка об авторе отображается 

Мне не нравиться аватар для анонимов!

В строчке defaultAvatar  замените синий текст (URL дефолтного аватара) на адрес своего изображения. Я предлагаю вам  несколько изображений найденных мною. Пользуйтесь!

https://3.bp.blogspot.com/-2Ph8AvEfiTk/VKfaapmvNSI/AAAAAAAAI6E/CiTUtYsnd2g/s1600/default-avatar-1.gif

https://1.bp.blogspot.com/-9j5sEAsaT8Y/VKfaavb8n4I/AAAAAAAAI6I/F2Q9zOTPdJM/s1600/default-avatar-2.gif

https://3.bp.blogspot.com/-j2tC8n7CiJM/VKfaatymTVI/AAAAAAAAI6c/vTWfvcmVlTE/s1600/default-avatar-3.gif

https://3.bp.blogspot.com/-NGsr9G0SVeU/VKfabG3SXtI/AAAAAAAAI6M/ijY6L-3NC-Q/s1600/default-avatar-4.gif

Больше изображений для аватарок можно найти на Findicons.com или других подобных сервисах.

Кстати, я уже писал как поменять стандартны аватары для анонимных пользователей и пользователей, которые еще не загрузили свой аватар. О том как это сделать читайте  в посте "Заменяем стандартные аватарки комментаторов в Blogger".

На этом всё. Ваши вопросы жду в комментариях. До новых встреч
Спасибо автору скрипта - Helplogger