Entradas relacionadas

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&amp;callback=related_results_labels&amp;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:

Coki

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

Staff

a mi no me andubo :S che coki para moverlo de lugar cambialo de la linea 3 a cualquier otra.

Coki

¡Gracias! A mí ya me funciona a la perfección.

Saludos.

Isaias Arredondo

Una pesca mas que me llevo, gracias!!!

Isaias Arredondo

Y otro mas que ya me adjudique jejeje

» Escribe tu comentario aquí:


Si quieres hacer alguna consulta sobre tu blog habilita tu perfil o deja un enlace a tu blog:
<a href="url-de-la-página">Texto enlace</a>

» O utiliza el antiguo formulario


Los comentarios están siendo moderados y publicados lo antes posible.



jesgo23 ©2008/2009 | Plantilla Blogger | Diseño jesgo Creative Commons License