Гаджет "похожие статьи" с картинками

пятница, 8 октября 2010 г.

Одной из основных целей блоггеров является привлечение как можно большего траффика на свой блог. Второй задачей после привлечения читателей, необходимо сделать так, чтобы они как можно дольше задержались у Вас на сайте, и легко могли найти другие качественные статьи которые их заинтересуют. Для этого и служит гаджет “Похожие статьи”. В прошлых статьях мы уже рассказывали как сделать подобный гаджет, однако сегодня хотелось бы рассказать о таком гаджете который бы поддерживал картинки из статей. Для этого нам может помочь сервис linkwithin.

Стоить заметить, что существует несколько способов воспользоваться сервисом.

1. Если вы используете стандартный шаблон от blogger.

Просто перейдите на сайт, и в панели справа заполните все поля, в строчке Platform выберите Blogger. в строчке ширина выберите сколько статей вы хотите чтобы отображалось (от 3 до 5), галочкой можно отметить “My blog has light text on a dark background” ( У моего блога светлый текст на темном фоне) , чтобы гаджет подобрал подходящие оттенки. Затем Вам откроется окно в котором необходимо нажать на сссылку Install widget вот так:

Затем выберите блог в который вы хотите установить данный гаджет, и он появится в нем.

2. Если вы используете не стандартный шаблон для blogger.

Так же заходим на сайт, заполняем все данные, только вместо платформы Blogger выбираем other и нажимаем Get widget.

Затем Вы попадете на страницу получить гаджет, и увидите следующий скрипт:

Отсюда Вам необходимо запомнить, или скопировать в блокнот выделенный код. Выглядит он примерно так: 314221.
Теперь необходимо зайти в настройки Вашего блога в раздел Изменить HTML поставить галочку Расширить шаблон, и при помощи комбинации клавиш ctrl+f найти следующий тэг в теле шаблона:

<div class='post-footer'>

либо похожий на него.

Когда найдете перед ним необходимо вставить следующий скрипт:

<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 вашего сайта необходимо вставить ранее скопированный код. После чего гаджет должен заработать.