Como Colocar Postagens relacionadas no Blog?


Infelizmente o Blogger ainda não tem a opção de exibir os posts relacionados ao final do texto, para facilitar a vida do leitor e aumentar o tempo de permanência dele no blog.
Desde o dia 11 de agosto estou usando neste Blog um script Legal que faz isso com precisão baseado nos marcadores que os posts têm em comum.
Este script é um tanto quanto complicado, por isso peço que use um blog de teste para não fazer besteira. Para visualizar o resultado crie neste blog de testes pelo menos cinco posts fictícios usando a mesma tag/marcador/label.
  1. Clique em LayoutEditar HTML. Cole o seguinte código antes da tag </head>Onde está escrito 5 você pode substituir pelo número de posts relacionados que você deseja mostrar.
    <script type="text/javascript">
    //<![CDATA[
    var relatedTitles = new Array();
    var relatedTitlesNum = 0;
    var relatedUrls = new Array();
    function related_results_labels(json) {
    for (var i = 0; i < json.feed.entry.length; i++) {
    var entry = json.feed.entry[i];
    relatedTitles[relatedTitlesNum] = entry.title.$t;
    for (var k = 0; k < entry.link.length; k++) {
    if (entry.link[k].rel == 'alternate') {
    relatedUrls[relatedTitlesNum] = entry.link[k].href;
    relatedTitlesNum++;
    break;
    }
    }
    }
    }
    function removeRelatedDuplicates() {
    var tmp = new Array(0);
    var tmp2 = new Array(0);
    for(var i = 0; i < relatedUrls.length; i++) {
    if(!contains(tmp, relatedUrls[i])) {
    tmp.length += 1;
    tmp[tmp.length - 1] = relatedUrls[i];
    tmp2.length += 1;
    tmp2[tmp2.length - 1] = relatedTitles[i];
    }
    }
    relatedTitles = tmp2;
    relatedUrls = tmp;
    }
    function contains(a, e) {
    for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
    return false;
    }
    function printRelatedLabels() {
    var r = Math.floor((relatedTitles.length - 1) * Math.random());
    var i = 0;
    document.write('<ul>');
    while (i < relatedTitles.length && i < 5) {
    document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
    if (r < relatedTitles.length - 1) {
    r++;
    } else {
    r = 0;
    }
    i++;
    }
    document.write('</ul>');
    }
    //]]>
    </script>
  2. Salve. Clique em Expandir modelos de widgets. Procure o seguinte código:
    <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
    </b:loop>
    </b:if>
  3. Substitua pelo código abaixo: A parte em destaque é o que será realmente acrescentado.
    <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
    <b:if cond='data:blog.pageType == "item"'>
    <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
    </b:if>

    </b:loop>
    </b:if>
  4. Salve. Procure (ainda em modo expandido) o código que pode ser:
    <div class='post-footer-line post-footer-line-3' />

    ou
    <p class='post-footer-line post-footer-line-3' />
  5. Substitua por:
    <div class='post-footer-line post-footer-line-3'>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <b:if cond='data:blog.url != data:blog.homepageUrl'><h4>Leia também:</h4></b:if>
    <script type='text/javascript'>
    removeRelatedDuplicates();
    printRelatedLabels();
    </script>
    </b:if>
    </div>
    Se você não encontrar nenhum p ou div que use class='post-footer-line post-footer-line-3', crie-a logo abaixo da tag que fecha class='post-footer-line post-footer-line-2'. Onde está escrito Leia também você pode escrever o texto de sua preferência. Salve.

    OBS: SOMENTE EM ALGUNS TEMPLATES QUE ACEITA, ESSE FOI TESTADO NO "MINIMA".

    Postagem editada do tutorial do Htmhelen um ótimo site vale apena conferir. 

0 comentários:

Postar um comentário

Postagens Recentes

Powered by Blogger Widgets