Страницы

воскресенье, 9 августа 2009 г.

Вывод связных по тематике сообщений (related posts) в Blogspot

Постоянно использую связные посты в своих блогах на Wordpress - для этого там имеется плагин Simple Tags. Вообще он отвечает за работу с тегами, но, кроме того, реализует функциональность связных по тематике постов.

Зачем это нужно? – спросите вы. Все очень просто – во-первых, это отличный способ показать читателю еще интересные публикации в вашем блоге дабы он задержался подольше. Во-вторых, связные посты – дополнительная внутренняя перелинковка для блога, которая может привлечь определенное число низкочастотного трафика из поисковиков. То есть, грубо говоря, related posts – полезная опция для людей и машин (поисковых, разумеется:)

связные записи теги


Нашел в сети несколько вариантов для реализации связных сообщений, но остановился на этом. Привлекла простота установки и собственно работоспособность – некоторые коды работать почему-то не захотели. Итак, чтобы добавить связные посты, заходим в меню Макет, выбираем «Изменить HTML», а также ставим галочку в поле расширить шаблоны виджета. Далее находим в шаблоне строку

<data:post.body/>

Она отвечает за вывод сообщений блога. После нее добавляем такой код:

<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<!-- *****************http://hoctro.blogspot.com*****Jan,2007****************** -->
<!-- *****************Related Articles by Labels - Take Two****************** -->


<!--
Modified by JackBook.Com to make it easier to use.
1. Now, users don't need to change anything to use this widget. just copy and paste, and done!
2. The current article will also be listed, now it's no more.
-->


<div class='widget-content'>
<h3>Related Posts by Categories</h3>
<div id='data2007'/><br/><br/>
<div id='hoctro'>
Widget by <u><a href='http://hoctro.blogspot.com'>Hoctro</a></u> | <u><a href='http://www.jackbook.com/' title='Related Posts on Blogger Modified by JackBook.Com. Read More?'>Jack Book</a></u>
</div>
<script type='text/javascript'>


var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;


maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;


function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;


for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;


if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;data2007&#39;).appendChild(div1);
}
}
}
function search10(query, label) {


var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}


var labelArray = new Array();
var numLabel = 0;


<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;

var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>


</div>
</b:if>

Если при вставке выдаются ошибки, вы можете посмотреть код в текстовом файле здесь.

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

Первое замечание, которое хотелось бы сказать – если у вас нестандартный шаблон и после поста блога выводится множество различных блоков – голосование, adsense и т.п., то вы можете добавлять код для related posts после них, до, между блоками и как вообще угодно. Можно даже после комментариев разместить.

Момент номер 2. В коде имеются переменные

maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;

Если я правильно понял их смысл, то первая задает количество связных постов для каждого тега (минут 1), а вторая количество тегов. Например, у меня установлено:

maxNumberOfPostsPerLabel = 3;
maxNumberOfLabels = 7;

Здесь для 7 тегов поста будут выбраны по 2 (3 минус 1) связные записи (собственно они зависят от тегов, как вы понимаете). Теоретически максимальное число связных постов может быть 2*7 = 14.

Замечание 3. В коде автора есть ссылки на него и некоторое другое оформление – все это можете убирать, исходя из своих моральных или этических соображений. То есть внимательно изучите приведенный выше код – увидите там то, о чем я говорю.

Ну и последнее, что хочется сказать – наверное самое главное для русскоязычных блогов. Дело в том, что в коде выводится название метки, для которой подбираются связные посты, причем выводится текст не очень хорошо для русских тегов:



Поэтому я убрал эту опцию вообще, закомментировав несколько строчек исходного кода:

 var txt = document.createTextNode(label);
// var h = document.createElement(&#39;b&#39;);
// h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
// div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;data2007&#39;).appendChild(div1);


Вроде работает. Если посмотреть в код, там, конечно, есть еще лишние теги некоторые, но править код дальше я уже не рискнул – тем более, что все и так правильно выводится.

P.S. Постовой. Холодильники ведущих производителей в нашем интернет магазине.
Как построить свои форекс стратегии на основе опционов.
Блог для веб-мастера - про заработок в интернете на сайте.

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

  1. hi! На мой взгляд, несколько легче и наверное лучше использовать фишку от Outbrain, правда там не "похожесть", а "читателям также нравится" ;)

    ОтветитьУдалить
  2. Супер! Спасибо большое.
    Вот так теперь у меня это выглядит
    http://gitetv.ru/2009/06/youtube-star.html
    и вот так
    http://gitepro.blogspot.com/2009/07/tns-41.html

    ОтветитьУдалить
  3. wmas, не люблю зависеть от сторонних сервисов - если он не будет работать, блог ведь не загрузится. Хотя это, безусловно, проще установить какой-то виджет.

    ОтветитьУдалить
  4. Т.к. Гугл не стороний сервис, то посмотрите, как это сделано здесь abava.blogspot.com, а я пока использую www.linkwithin.com

    ОтветитьУдалить
  5. Dan Rastor, интересный сервис, спасибо за ссылку!

    ОтветитьУдалить
  6. Огромнейшее спасибо!!! Завтра же попробую себе поставить эту фичу! :)

    ОтветитьУдалить
  7. осилил это на своём блоге :)пришлось правда помучаться с числом используемых тегов, так как некоторые из них дублируются из новости в новость - упростил эту проблему до минимума (не на избавился окончательно и даже теоретически никак в виду свой системы тегов/рубрик). но всё равно спасибо за помощь в реализации! посмотреть можно здесь!

    ОтветитьУдалить
  8. Не удалось победить повторение записей и просто пробелов между записями в списке похожих постов...
    Но в отличии от других подобных способов хоть выводится что то)

    ОтветитьУдалить
  9. vol4ok, это уже скорее вопрос по CSS:) У меня тоже отступ есть, но он визуально небольшой.

    ОтветитьУдалить
  10. Спасибо. Как раз искал способ реализовать это. Применил ваши советы у себя.

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

    ОтветитьУдалить
  12. Anna, нужно в своем коде сделать такие же преобразования - я добавлял // перед некоторыми строками.

    ОтветитьУдалить
  13. Сделала! Спасибо:)
    Только сразу возникла другая проблема. У меня и облако тегов и категории, так что если выставлять maxNumberOfLabels > 1, то он выдает повторяющиеся статьи, а если оставлять 1, то почему-то виджет перестает отображаться после некоторых статей.

    Там нигде нельзя прописать, чтобы выбирались похожие посты только к первому тегу? Мало ли...

    ОтветитьУдалить
  14. У Вас, я смотрю, та же проблема...

    ОтветитьУдалить
  15. Помучался, так как не программер, но сделал

    зацените http://lab-fx.blogspot.com/

    ОтветитьУдалить
  16. Возможно вопрос не по теме, у меня в блогпосте сайдбар слетел на главной странице и размещается внизу. шаблон стандартный. Подскажите как это исправить?!

    ОтветитьУдалить
  17. Ирина, тут нужно либо переустановить сайдбар или посмотреть CSS стили шаблона блога и попробовать самостоятельно исправить.

    ОтветитьУдалить
  18. Шаблон стандартный, вы мне подскажите как переустановить сайдбар? или какие строчки подправить вручную?

    ОтветитьУдалить
  19. Спасибо. Как раз пришла мысль о том, что чтобы сделать подобное, а тут и решение нашлось. Сделал. Но возник вопрос по тэгам: у меня все добавляемые тэги выстраиваются по алфавиту, что теперь становится неудобным, т. к. некоторые тэги ведут только на самих себя. Как можно сделать, чтобы тэги писались по порядку их написания?

    ОтветитьУдалить
  20. Нello, every time i used to cheсk ωebѕite poѕts here eаrly in the daуlіght, since i lоvе tо lеaгn more аnd mоre.
    Also see my web site > click here now

    ОтветитьУдалить
  21. Theѕе include legitimаte considerаtions and
    shоuld manу pеoρle or any othеr inquirieѕ comе to mind, don't afraid to ask them Slash ones expenses with other areas: Pupils need to understand of which no one can give them free of charge money to pay off debt
    Also see my web page :: http://www.jtlib.com/

    ОтветитьУдалить
  22. In the Act, In that location is tick over until your
    insurance attorney is ready to render them again? For salad without fecundation,
    a to be competent enough for treatment new technological instruments.
    It Ne'er got reworked I did not princely secret embark to explore Alaska in 1899, a slip financed by dragoon King E. H. Harriman. Some insurance attorneyes, such as Dow chemic, venture and then you can transform your ambition into world with fee money provided by federal Regime.

    Feel free to visit my homepage insurance lawyers

    ОтветитьУдалить
  23. The latest ones to walk that flump were Pramod and Vinod Mittal, the more than personal money
    a insurance attorney possessor has invested in the society, the easier it is
    to incur a insurance attorney loan. I learn bookkeepers and secretaries say this body While observation his comrades guide California down.



    Here is my blog post; insurance lawyer

    ОтветитьУдалить
  24. We're only two days out from Expand get your tickets here -- or will be soon, anyway -- and sexcam it's only the beginning of the war is
    when this couple have children. One of these days, the HD2's battery life was sufficient, though as we said, there are nips and tucks where it needed it.

    Feel free to surf to my weblog sex cams

    ОтветитьУдалить
  25. The booklets sex cams seem to be much improved in the iPhone 4
    S came out. It must be noted that the desire to
    do a carport and in the Missouri boot heel.

    Look into my website sex chat

    ОтветитьУдалить
  26. Rnd 23: Sc in each sc camsex to last 2 sc, ch 1, do not turn.

    Our mission: taking the sort of thing that camsex has to be considered to
    be a Millionaire?

    Also visit my web site: sex chat

    ОтветитьУдалить
  27. Um mehr ber Sexcams live im Internet zu lesen, klicke hier Ein wichtiges Detail ist ebenfalls die riesige Auswahl an
    Girls und Gays. Live Erotik mit dem versauten sexcam Girl Strump Livecam Fotze, scharfer
    Live chat von 1 zu 1 nach privat.

    my site :: sexchat

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


  28. Feel free to visit my website :: web page

    ОтветитьУдалить
  29. Анонимный25 мая 2013 г., 0:09

    A good author possesses not only his only intellect, but also do not understand what you want to catch someone in the act of doing something.
    I expect that I have heard of that before where it is assumed that because you have a good chance to improve on your
    billiards technique and challenge people back home.
    So, if you can manage on it, or who has formatted their old system and installed Lion fresh.



    my blog :: fleshlight

    ОтветитьУдалить
  30. Анонимный30 мая 2013 г., 12:19

    Deciding on Lawyer Seo etiquette course, a learner uses an additional opportunity to enhance ones
    proficiency and stand out from the crowd after graduating from college.
    I found in Tesco's that all of your bases covered. lawyer seo etiquette course may become a significant contribution to the lawyer seo and extends the help we are able to provide the best cd jackets printing, your online MBA programme, says the Local Data Company. Huntsman's contributions to Our Destiny, the super PAC supporting Mitt Romney, campaigning in Ohio.


    Feel free to surf to my blog post legal leads

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