Привет дорогие друзья! Виджет: похожие сообщения для Blogger/Blogspot. Этот превосходный трюк для отображения ссылок на соответствующие статьи под каждым из ваших сообщений в блоге. Статьи выбираются из иных постов в той же категории - этикетки - метки. При помощи данного хака Вам поможет удержать читателей на ресурсе и поспособствует лучшему ознакомлению с материалами блога. Виджет похожих статей является одним из максимально важных и распространенных дополнений в блоге. Есть несколько способов вывода похожих сообщений блога в одном блоке. Об одном из них пойдет речь далее. Такой гаджет довольно прост в установке и не потребует любых дополнительных правок. Между тем, это довольно гибкий для последующих настроек скрипт, который на самом деле выводит к показу похожие статьи из той же рубрики, что и пост, к которому он приведен, а не просто отображает перечни опубликованных раньше сообщений блога.

             Как установить виджет связанные сообщения вашего блога


1. Перейти в Дизайн> Изменить HTML в вашей панели инструментов Blogger.
2. Создайте резервную копию существующего шаблона перед внесением изменений.
3. Удостоверьтесь,чтобы была поставлена галочка " Расширить шаблоны виджета".
4. Поиск строчки </head>
5. Добавьте следующий код только перед </head> тега.

<style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("http://lh3.ggpht.com/_cNpXRtRph18/S76dASm3WGI/AAAAAAAAEJg/AVmw4HhRdsk/rss.png") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://db.tt/Sm54s9oF' type='text/javascript'/>

6. Теперь поиск <data:post.body/> . В некоторых шаблонах этот код может выглядеть следующим образом class='post-body> <div или <data:post.body/>

7. Добавьте следующий код только после <data:post.body/>  
<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>

8. Теперь сохраните шаблон и все готово!

Настройка: для того чтобы изменить  количество связанных сообщений ,поиск кода (выделенно зелёным) и измените " 5 "на любое Ваше число.
Всего доброго.Желаю Вам удачи.


Ух ты кнопочки! Понравилась статья? Поделитесь с друзьями в соцсетях:


19 коммент. :

  1. Спасибо за подсказку!Долго искал скрипт для Блогспота, попадались одни недоразумения, Ваш подошел!

    ОтветитьУдалить
  2. Рад за Вас.В другом моём блоге можете подобрать получше.http://new-school-blogger.blogspot.com/

    ОтветитьУдалить
  3. Привет вставил код, всё согласно инструкции. Не работает! Фрагмент - встречается два раза, в этом может быть причина?

    ОтветитьУдалить
  4. Попробуйте поставить после первого,если не работает тогда после второго.Должно получиться.Так бывает.

    ОтветитьУдалить
  5. Да я, в общем то, так делал, вот мой блог: http://www.risunoc.com/, может быть шаблон не подходящий?

    ОтветитьУдалить
  6. Попробуйте вот это:
    http://new-school-blogger.blogspot.com/2012/01/stati-miniatjurami-vidzhet-blogger.html

    ОтветитьУдалить
  7. Попробовал, не заработало. Похоже дело, все таки, в шаблоне. Либо в лишних виджетах. Спасибо за помощь.

    ОтветитьУдалить
  8. Очень странно.У всех работает.У меня почти на всех блогах установлено.

    ОтветитьУдалить
  9. Все сделал, как Вы сказали - заработало. Спасибо большое!
    Но есть проблема!
    Видимо изза того что в моем блоге есть свои какие то настройки :(

    Посмотрите пожалуйста - блог www.auto-mirage.com
    Проблема в том что после каждой статьи выводиться список без картинок с иконками RSS. Как сделать чтобы были именно иконки на статьи, как на Вашем блоге?

    ОтветитьУдалить
  10. Скажите два месяца ваш скрипт работал, а сегодня перестал работать. Что делать?

    ОтветитьУдалить
    Ответы
    1. Скрипт временно отключён.Все скрипты надо кидать на свой хостинг.Можно подождать или воспользоваться другим виджетом.Их много.Воспользуйтесь этим сервисом,я им очень доволен-http://shkolablogger.ru/vidzhet-pohozhie-stati-dlya-blogger-ot-servisa-nrelate.html

      Удалить
  11. А как долго он будет отключен? А то он мне понравился...

    ОтветитьУдалить
    Ответы
    1. Не знаю.Надо всегда скрипты на свой хостинг кидать.А теперь слишком много обращений к нему - создают слишком много трафика к скрипту на хостинге dropbox. Наверное много человек установили виджет.

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

    ОтветитьУдалить
    Ответы
    1. Вот как это делается читай в моём блоге здесь-http://shkolablogger.ru/besplatnyiy-servis-dropbox-dlya-hraneniya-faylov.html

      Удалить
  13. Удостоверьтесь,чтобы была поставлена галочка " Расширить шаблоны виджета".
    Где поставить эту галочку?Не могу найти.

    ОтветитьУдалить
    Ответы
    1. Дмитрий, Расширить шаблоны виджета это было раньше, сейчас, чтобы раскрыть код надо нажать на черную стрелочку.

      Удалить
  14. Как уменьшить размер текста и цвет заголовка Related Posts :

    ОтветитьУдалить