Junte-se a 22.515 pessoas que
decidiram aprender tudo sobre Blogs,
SEO e Monetização.

Postagens

Posts Relacionados no blog

Acabei de colocar no Códigos Blog “Posts Relacionados” antes dos comentários de cada postagem.

Simples! Nessa postagem vou ensinar como fazer…
Cuidado! Qualquer pequeno erro pode fazer que isso fique chato!

Mas antes gostaria de destacar uma questão relacionada a seu blog. Se você esta criando um novo, sugiro saber mais sobre as Melhores Hospedagens de Sites que existem.

1º – Faça login no blogger , clique em “Layout” -> “Modelo” -> “Editar HTML“.
Antes de tudo clique em “Baixar modelo completo“, para caso tenha algum erro você tem o layout salvo.

2º – Procure (Ctrl + f) a tag </head>. Cole o seguinte código ANTES do código encontrado:

<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 < 20) { 
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>


3º – Salve

4º – Clique em “Expandir modelos de widgets”

5º – 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> 

6º – Cole este código antes do </b:loop>:

<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=5"'
type='text/javascript'/>
</b:if> 

7º – Salve o template!

Pronto? Infelizmente não! =D
8º – Procure esse código:

<p class='post-footer-line post-footer-line-3'/>

9º – Adicione este código logo depois:

<b:if cond='data:blog.pageType == &quot;item&quot;'> Posts Relacionados</b:if>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>

10º – Salve o template. Agora quando clicar no link do post você pode ver a lista de postagens relacionadas antes dos comentários!

Tutorial de: Blosque com algumas modificações.



De um play no vídeo abaixo e aprenda a Criar blogs Profissionais




Gostou deste artigo? Ajude nosso projeto.
Compartilhe em suas redes sociais nos botões abaixo:

Para enviar seu comentário, preencha os campos abaixo:

Deixe uma resposta

*

103 Comentários

  1. Glemerson disse:

    Vlwsssss mano tava procurando nesse modelo simples é bem leve e ocupa pouco espaço aqui funciomo direitinho eu ainda consegui mudar a cor da letra post relacionado fico perfeito aqui do jeito que eu queria muito obrigado parabens pelo blog!

Por gentileza, se deseja alterar o arquivo do rodapé,
entre em contato com o suporte.