Похожие статьи с миниатюрами под каждым постом в блоге

похожие сообщения под каждым постом<.noindex>
Приветствую всех, кто читает мои шпаргалки. В последнее время ко мне обратились уже несколько постоянных читателей, у которых возникает проблема с установкой виджета  похожие статьи блога с миниатюрами под каждым постом от сервиса LinkWithin.
Да такое недоразумение существует. И причину этого мне подсказала моя "коллега по цеху" Ольга Протасова в своём блоге http://www.bdblogov.ru.

Дело в том, что если виджет был установлен до декабря 2013 он работает корректно. А вот, кто устанавливал его после этой даты, столкнулись с тем, что картинки не отображаются. Не работает автозагрузка. Есть ещё один подобный сервис   nRelate. Признаюсь, когда я пробовала его у себя в блоге, отображались только последние сообщения. А это не то.

Пересмотрела по поводу его массу информации и пришла к выводу, что он не очень дружит с русскоязычными сайтами. И у многих блогеров отображается не так, как хотелось бы. Но попробовать стоит. Может, у вас всё получится.

Сегодня же я вам предлагаю ещё вариант, как можно вывести похожие статьи с миниатюрами под каждым постом. Сразу оговорюсь. Немного сложновато будет для новичков. Но терпение и спокойствие дадут результаты. И в первую очередь, так-как придётся сделать некоторые изменения в шаблоне, прочитайте статью как найти строку в шаблоне правильно.

1. Заходим в панель администратора. Вкладка шаблон. Обязательно делаем резервную копию.
2. С помощью клавиш Ctrl+F находим, закрывающийся тег </head> и прямо над ним вставляем следующий код.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts{float:left;width:auto;}
#related-posts a{border-right: 1px dotted #eaeaea;}
#related-posts a:hover{background: #EEEEEE;}
#related-posts h2{margin-top: 10px;background:none;font:16px Oswald;padding:3px;color:#999999; text-transform:uppercase;}
#related-posts .related_img {margin:5px;border:2px solid #f2f2f2;width:100px;height:100px;transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;-moz-transition:all 300ms ease-in-out;-o-transition:all 300ms ease-in-out;-ms-transition:all 300ms ease-in-out;-webkit-border-radius: 5px;  -moz-border-radius: 5px; border-radius: 5px; }
#related-title {color:#666;text-align:center;padding: 0px 5px 10px;font-size:12px;width:110px; height: 40px;}
#related-posts .related_img:hover{border:2px solid #E8E8E8;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;-khtml-opacity:.7}</style>
<script type='text/javascript' src='http://helplogger.googlecode.com/svn/trunk/relatedposts.js' />
</b:if>

Здесь по желанию можно изменить цвет фона, заголовка, размер текста. Я выделила синим. Красным-размер изображения.

 3.Теперь необходимо найти  такую строчку. Также используя клавиши Ctrl+F.

 <b:includable id='postQuickEdit' var='post'>

Сейчас внимательно посмотрите на скриншот, чтобы понять куда будем вставлять следующий код.


Жёлтым выделена  искомая строка. Над ней, закрывающийся элемент </b:includable>.

4. Вот сразу над ним и  вставим следующий код.

<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>
<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=4&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=4;
var relatedpoststitle=&quot;<b>похожие сообщения:</b>&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div class='clear'/>
</b:if>
Красным в двух местах - это количество миниатюр, которые будут выводиться. И синим ваш заголовок.

Должно получиться приблизительно следующее:

</div>
тут весь код
</b:includable>
<b:includable id='postQuickEdit' var='post'>

Нажмите на просмотр. Если всё нормально нужно форматировать шаблон и нажать сохранить. Возвращаемся на страницу блога и внизу каждого поста должен быть вот такой результат. 


И ещё одно маленькое отступление. Если у вас в блоге ещё совсем мало сообщений, то пока это устанавливать не стоит. Ну и обязательным условием является то, что каждому посту присвоен определённый ярлык.
источник http://helplogger.blogspot.ru

Хватит на сегодня информации. Если постараться, то всё получится. Главное терпение.

Удачи всем нам. 

Ой, а что это там ниже? Ну надо же! Нажимаем!

оформите подписку на новые шпаргалки

введите пожалуйста свой адрес электронной почты :

12 комментариев:

  1. интересная статья

    ОтветитьУдалить
  2. BEYSAN MAK рада, что Вам понравилась.

    ОтветитьУдалить
  3. Устанавливал LinkWithin до декабря 2013 года и проблем ни каких не замечал, а тем кто не успел установить этот инструмент, я сочувствую.

    ОтветитьУдалить
  4. Иван, привет. Кстати подумалось вот. Как считаешь, этот вариант лучше или всё же LinkWithin или от других сервисов.

    ОтветитьУдалить
  5. Привет Виктория. Я не знаю.. кроме LinkWithin, больше ничего не пробовал.

    ОтветитьУдалить
  6. Привет, Иван. Установила такой вариант в другом блоге у себя. Понаблюдаю.

    ОтветитьУдалить
  7. Правельно говорят -терпение и труд-всё перетрут... у меня с 3-его раза получилось, но ведь получилось же! Ура! :))))

    ОтветитьУдалить
  8. Кристина, Ура!!! Когда лчень хочется-всё получается. Рада за тебя.

    ОтветитьУдалить
  9. Здравствуйте! а эта информация актуальна сегодня? чего-то ничего у меня не получается.

    ОтветитьУдалить
  10. Здравствуйте Елена. Вполне возможно, что не работает. З 2016 год столько изменений было. Код хранился на googlecode и скорее как многие другие сервесы не поддерживает. Попробуйте от LinkWithin. Может будет работать у многих ещё его вижу. http://www.shpargalochki.ru/2013/12/pohozhie-soobshhenija-v-bloge.html#more
    У меня тоже картинки стояли а потом бац и улетело всё. Сейчас вот только текстовые ссылки прижились.

    ОтветитьУдалить
    Ответы
    1. Вика, спасибо за ответ! LinkWithin тоже не работает (по разным инструкциям и в HTML вставляла, и как виджет). В результате использую легко устанавливаемую фишку с вертикальными картинками.

      Удалить
  11. Забежала к вам , красивые у вас зверюшки. Моё мнение, что и достаточно гаджета популярных сообщений. Зачем ещё лишние дубли страниц.

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

Пользовательский поиск
Foto Saya
My Photo