2/20/2011

Как добавить в блог гаджет "Похожие статьи"

Продолжаю свою серию обучающих постов по облагораживанию блога :)
Еще один предмет зависти в клевых блогах лично для меня - гаджет "Походие статьи". Это когда читаешь пост в чьем-то блоге, а в конце поста - три маленьких фотографии из других постов, похожих по теме. И - о счастье! - теперь такая штука есть и у меня. Спасибо товарищу Лагунову С.
Если пойдете по ссылке - увидите оригинальный пост по установке этого гаджета. В принципе, там все понятно написано, но для тех, кому понятней читать в моем пересказе - пересказываю :)
1. Итак, сначала нам нужно попасть на сайт Linkwithin. Там не нужна никакая регистрация, просто заполняем строчки в окошке справа - я его выделила кривой красной линией))) Пишем там свой email, адрес блога и - ВНИМАНИЕ - указываем в строчке Platform - 'Blogger', если у вас в блоггере стоит старый шаблон. А если вы уже успели его поменять по моему МК :) - то выбираем OTHER.

2. Когда все заполнили, жмем голубую кнопку GET WIDGET
3. В результате откроется вот такая страничка с кодом:
Весь код копировать не нужно Нам понадобится только число во второй строке (я его тоже выделила красным). Скопируйте его в блокнот (только число, никаких больше знаков не нужно)
4.  Теперь идем в нашу родную панель инструментов Blogger, раздел Дизайн и выбираем Изменить HTML
5. Над окном с кодом ставим галочку рядом с командой "Расширить шаблоны виджета"
6. После этого нам нужно будет работать с кодом. Сделайте глубокий вдох и приготовьтесь :) А еще лучше - скопируйте от греха подальше все содержимое окна с кодом в отдельный блокнот - чтобы, если что-то пойдет не так, у вас была возможность все восстановить хотя бы как было :)
7. В коде вашего блога нужно найти строчку следующего вида:
<div class='post-footer'>
 
Проще всего это сделать, воспользовавшись окном поиска 
(оно появится, если нажать Ctrl+F) 
8. Нашли? Теперь ПЕРЕД этим тегом нужно вставить вот что:
 
<b:if cond='data:blog.pageType == "item"'>
<script>
var linkwithin_site_id = Id вашего сайта;
(function () {
var elem = document.createElement('script');
elem.type = 'text/javascript';
elem.src = 'http://www.linkwithin.com/widget.js?rand=' + Math.random();
document.getElementsByTagName('head')[0].appendChild(elem);
})();
</script>
<a href="http://www.linkwithin.com/"><img
src="http://www.linkwithin.com/pixel.png" alt="Blog Widget by LinkWithin"
style="border: 0" /></a>
</b:if>
 
Id вашего сайта - это тот самый номер, который вы сохраняли
 в блокнот с сайта Linkwithin. Вставьте его вместо фразы. 
9. Все, сохраняем шаблон и созерцаем результаты наших трудов :)
 
 

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

  1. Спасибо, Леночка, какая же ты молодец!!!

    ОтветитьУдалить
  2. Скажите,а виджет сразу должен заработать,а то у меня он появился,но ведёт на несуществующую страницу,голову уже сломал,что там может быть не так?Разработчикам написал,пока ничего,может у кого-то была такая ситуация?

    ОтветитьУдалить
  3. Может, дело в самой странице, на которую он ведет? Или что-то накосячено с кодом... у меня заработал моментально...

    ОтветитьУдалить
  4. Спасибо, только я вставляла код из окна перед тэгом < /body > убрать пробелы. По вышеуказанному способу не получилось.

    ОтветитьУдалить
  5. странно... но главное, что все работает! :)

    ОтветитьУдалить
  6. Этот комментарий был удален автором.

    ОтветитьУдалить
  7. чет все вроде правильно сделала сам шаблон не поменялся все осталось как прежде а функция так и не добавилась-((((

    ОтветитьУдалить
  8. ой получилось, только почему-то в общем просмотре не видно 3 окошка, а только тогда, когда открываешь какое0нибудь сообщение, Лен так и должно быть?

    ОтветитьУдалить
  9. Вероятно,да - у меня в блоге по одному посту на страницу отображается, поэтому и гаджет сразу работает.

    ОтветитьУдалить
  10. Спасибо!!!! У меня получилось!!!!!!!!!!

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

    ОтветитьУдалить
  12. Ага, это точно Святослав...
    Одни англоязычные статьи в которых можно чето делать только по картинкам , если в английском не шаришь:)
    Ну или с переводчиком)
    В общем спасибо огромное)))

    ОтветитьУдалить
  13. И я себе поставила такую штучку. Спасибо большое за совет.)))

    ОтветитьУдалить
  14. Кстати, кажется там не похожие статьи и нет привязки к ярлыкам... а просто случайные. Нет?

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

Спасибо за комментарий!
Не забудьте вернуться на эту страничку за ответом :)