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

Похожие статьи с миниатюрами в конце каждого сообщения для Blogger

Заходим в Шаблон -- Изменить HTML. Далее с помощью поиска (Ctrl+F)  найдите  эту строку в вашем шаблоне: </head> и прямо над ним вставляем код:

 <!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://dl.dropbox.com/u/48089857/relatedthumbs19.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->


Дальше ищем другую строчку: <div class='post-footer-line post-footer-line-1'> если не найдёте тогда  такую: <p class='post-footer-line post-footer-line-1'> Теперь сразу после любой из этих строчек (в зависимости от того какую Вы нашли) вставляем этот фрагмент кода:

<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<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_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop><a href='http://forbloggerhelp.blogspot.com/2011/11/pohozhie-stati-s-miniatjurami-dlja.html' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://forbloggerhelp.blogspot.com/' style='display:none;'>blogger widgets</a>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle="Похожие сообщения";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->

Теперь Вы можете настроить максимальное количество связанных сообщений для вывода, редактируя эту строку в коде: var maxresults=5; можно отображать даже в два ряда. Также можете заменить слово Похожие сообщения на своё. Всё. Желаю удачи.

P.S. Для изменения цвета и шрифта, Вы должны будете изменить в первом коде CSS


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


56 коммент. :

  1. Спасибо автору за статью. Очень мне понравился этот виджет. Но вот незадача, никак не могу найти где прописать размеры миниатюры похожих страниц и количество текста к ним (они у меня показываются как 72Х72). Поэтому они смотрятся у меня не очень...
    Буду благодарен за помощь.

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

    ОтветитьУдалить
  3. Что то не хера не получилось у меня и это печально :(

    ОтветитьУдалить
  4. Что-то комментарий ваш не появился в блоге.Попробуйте здесь- http://new-school-blogger.blogspot.com/2012/01/vidzhet-svjazannyh-soobschenij-nrelate.html или другое посмотрите.

    10 февраля 2012 г. 13:22 пользователь Disqus <
    > написал:

    ОтветитьУдалить
  5. Здравствуйте. Подскажите, пожалуйста, а как вообще добавить миниатюру к статье в blogspot?

    ОтветитьУдалить
  6. не могу скачать шаблоны на блоге http://rustemplate.blogspot.com/ исправь ссылки

    ОтветитьУдалить
  7. Какой именно шаблон Вам нужен дам новую ссылку.Megaupload закрыли,а на новый хостинг шаблоны некогда переносить.

    ОтветитьУдалить
  8. А эти похожие статьи из того же блога, или из других на него похожих?

    ОтветитьУдалить
  9. Скажите, а эти похожие статьи будут из того же блога или из других?

    ОтветитьУдалить
  10. Можешь посмотреть здесь:
    http://new-school-blogger.blogspot.com/2012/01/stati-miniatjurami-vidzhet-blogger.html

    ОтветитьУдалить
  11. Хм. Странно - сделал все по инструкции но ничего не появилось =(

    Может из за скачанного шаблона?
    www.auto-mirage.com - мой блог.

    ОтветитьУдалить
  12. Екатерина Чурикова5 ноября 2012 г., 14:43

    у меня не отображается(((((((((((((((((((((((((((((((((((((((((((((

    ОтветитьУдалить
  13. Эсли всё правильно сделали,должно заработать.

    ОтветитьУдалить
  14. Я бы добавил в статью, что данный виджет работает если статьи отмечены ярлыками. если они не отмечены, то и отображения не будет. Я когда то этого не знал, поэтому не мог настроить.

    ОтветитьУдалить
  15. Да тут и так всё понятно.У всех есть одинаковые ярлыки.

    ОтветитьУдалить
  16. Я правильно понимаю, если http://forbloggerhelp.blogspot.ru накроется, то эта примочка перестанет работать? А так спасибо! Всё работает.

    ОтветитьУдалить
  17. Почему накроется? Всё равно будет работать.

    ОтветитьУдалить
  18. Здравствуйте! Спасибо большое, замечательный виджет. Только у меня есть вопрос: как изменить размер самой надписи "Похожие сообщения"? Заранее спасибо за ответ.

    ОтветитьУдалить
  19. Зоя Пустовойт11 марта 2013 г., 14:22

    Сергей, здравствуйте!
    Пытаюсь вставить Ваш виджет похожие статьи для блогспот.
    Но у меня отсутствуют строки Или
    <p class='post-footer-line post-footer-line-1'
    Куда вставлять вторую часть кода?
    Ответьте пожалуйста
    С уважением, Зоя Пустовойт
    www.svadebnoeoformlenie.com

    ОтветитьУдалить
  20. Зоя ,я Вам ответил на вашу почту.

    ОтветитьУдалить
  21. Анастасия,а это Вам обязательно?

    ОтветитьУдалить
  22. У меня вопрос показывает по одной картинке и этого же самого поста как исправить вот блог http://graciastatei.blogspot.ru

    ОтветитьУдалить
  23. Потому что у тебя всего то 5 постов написано.Мало.

    ОтветитьУдалить
  24. Привет! Очень полезный виджет, но в новом блоггере нет функции Расширить шаблоны виджетов. Как правильно сделать изменения?

    ОтветитьУдалить
  25. А теперь не надо.Код полностью показан в редакторе.

    ОтветитьУдалить
  26. У меня также нет этих строк

    ОтветитьУдалить
  27. Наталья,тогда пробуйте вставить после этой строки: <data:post.body/>

    ОтветитьУдалить
  28. Иван Озаров25 апреля 2013 г., 22:45

    Спасибо большое, задействовал виджет на своем блоге.

    ОтветитьУдалить
  29. Не работает.

    Во-первых, линий аж две. Под какой из них вставлять код?
    Во-вторых, под которой бы ни вставил, "Похожие статьи" не появляются.
    В-третьих, "Похожие статьи"не появляются даже если вставляешь под обе сразу.

    ОтветитьУдалить
  30. Ставь код ниже <data:post.body/>

    ОтветитьУдалить
  31. Анонимный2 июня 2013 г., 7:30

    Добрый день сергей . Искал в шаблоне строчки
    не нашёл не одной подскажите пожалуйста что мне делать .Спасибо.


    ОтветитьУдалить
    Ответы
    1. Такие строчки обязательно должны быть. Нажми форматировать шаблон,затем сочетание клавиш Ctrl+F появится в редакторе окошко. В это окошко вставляй искомый код,потом Enter.Нужная строчка подсветится желтым цветом.Удачи. 8-)

      Удалить
    2. Анонимный2 июня 2013 г., 9:22

      Всё делал как Вы писали . Результат 0. Жаль . Всё ровно спасибо.

      Удалить
    3. А какую Вы строчку искали? :-?

      Удалить
    4. Как Вы и писали выше одну из двух,
      пересмотрел всё от и до их просто нет.

      Удалить
    5. Влад,найдите такую строку - <data:post.body/> такая точно есть.

      Удалить
  32. здравствуйте. размещаю все правильно, но почему-то у меня получается так:
    ultra-rl.com/ScreenShot_130.jpg

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

    ОтветитьУдалить
  33. А у меня не отображается, хотя и постов и меток много (

    ОтветитьУдалить
  34. А можно ли изменить шрифт, выглядит просто огромным и увеличить размеры картинок?

    ОтветитьУдалить
    Ответы
    1. Привет,Яна!Чтобы вам не мучится воспользуйтесь отличным сервисом -http://shkolablogger.ru/vidzhet-pohozhie-stati-dlya-blogger-ot-servisa-nrelate.html много настроек и стилей.

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

      Удалить
  35. Тогда вам надо скопировать скрипт в первом коде- http://dl.dropbox.com/u/48089857/relatedthumbs19.js отредактировать размер шрифта и картинок.Потом закинуть на свой хостинг и прописать в первом коде.Как это делать читайте в моём блоге здесь-http://shkolablogger.ru/besplatnyiy-servis-dropbox-dlya-hraneniya-faylov.html

    ОтветитьУдалить
  36. Пошла изучать))), еще обнаружилось одно большое НО, при установке этого виджета, исчез карандашик возможность быстро редактировать пост. Поможете?

    ОтветитьУдалить
    Ответы
    1. Привет,Яна!Он вам(карандашик) и не нужен,от лишнего в блоге надо избавляться. 8-)

      Удалить
  37. Не находит коды ни первый ни второй. В шаблоне такого нет.

    ОтветитьУдалить
    Ответы
    1. Эдуард, всё там есть. Вот тут подробная инструкция в моём блоге (этот блог заброшен) - http://shkolablogger.ru/kak-v-blogger-dobavit-pohozhie-stati-s-miniatyurami-pod-kazhdoe-soobshhenie.html

      Удалить
  38. Здравствуйте,Сергей! Все сделала, как описано выше, но после сохранения ничего не появилось. Сразу появляется скрипт или надо ждать? Спасибо.

    ОтветитьУдалить
    Ответы
    1. Привет Ирина! Почитайте комментарии, вам скрипт нужно залить на свой хостинг, тогда будет работать. А лучше перейдите на этот http://shkolablogger.ru/ мой блог и посмотрите, там есть и другие виджеты похожих сообщений.

      Удалить