Con este script mostramos las entradas relacionadas con la que estamos leyendo, como un nuevo elemento del pie de los post y se mostrará solamente en las páginas individuales, no en la principal.
1. Justo debajo de la etiqueta ]]></b:skin>agregamos el siguiente script. Hemos de colocarlo exactamente ahí ya que para que funcione correctamente, debe estar antes que cualquier otro script que hayamos colocado:
<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 cuantosPosts = 0;
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
var dirURL = document.URL;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
if (relatedUrls[r] != dirURL) {
document.write('<li><a href="' + relatedUrls[r] + '" title="Post relacionado: '
+ relatedTitles[r] + '">' + relatedTitles[r] + '</a></li>');
}
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
cuantosPosts++;
if (cuantosPosts == 3) {
break;
}
}
document.write('</ul>');
}
//]]>
</script>
En relatedTitles.length && i < 20), se ponen los posts que se verán según los caracteres que formen su título.
En if (cuantosPosts == 3) aumentamos la cantidad de posts a mostrar.
2. Buscamos ahora esta parte del código y añadimos lo que he marcado en azul:
<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&callback=related_results_labels&max-results=10"'
type='text/javascript'/>
</b:if>
</b:loop>
</b:if>
En max-results=10 ponemos la cantidad máxima de posts que se mostrarán, es conveniente poner un valor bajo para evitar que la página tarde mucho en cargarse.
3. Una vez hecho esto, buscamos esta línea de código:
<p class='post-footer-line post-footer-line-3'/>
Y colocaremos nuestro nuevo código justo a continuación:
<div class='post-footer-line post-footer-line-4'>
<b:if cond='data:blog.pageType == "item"'>
<script type="text/javascript">
removeRelatedDuplicates();
printRelatedLabels();
</script>
</b:if>
</div>
Visto en El Escaparate de Rosa.
5 comentarios:
Hola! Me pareció muy bueno y ya lo agregué a mi blog.
Me dirías cómo le agrego un título?
Y cómo lo muevo de lugar, dentro del pie de un post?
Gracias!
Coki
a mi no me andubo :S che coki para moverlo de lugar cambialo de la linea 3 a cualquier otra.
¡Gracias! A mí ya me funciona a la perfección.
Saludos.
Una pesca mas que me llevo, gracias!!!
Y otro mas que ya me adjudique jejeje