Entradas Relacionadas

Este truco es para colocar entradas relacionadas.

Lo ví en el

Nos situaremos en la vista HTML de la plantilla, expandiremos los artilugios y buscaremos la etiqueta ]]></b:skin> y justo debajo, agregaremos el script.

Hemos de colocarlo exactamente ahí ya que para que funcione correctamente, debe estar antes que cualquier otro script que hayamos colocado:

Código a usar [+/-]

<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 el código del script, donde dice relatedTitles.length && i < 20), se escogen los posts que se mostrarán según los caracteres que formen su título. En el ejemplo no se mostraran si contienen más de 20 caracteres, pero podemos cambiar ese valor por el que queramos.

Buscamos ahora esta parte del código y añadimos lo que he marcado en negrita:

Código a usar [+/-]

<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>

Donde dice max-results=10 es donde podemos controlar la cantidad máxima de posts que se mostrarán, podemos cambiar "10" por el valor que nos interese, aunque según nos recomienda JMiur "es conveniente poner un valor bajo para evitar que la página tarde mucho en cargarse".

Una vez hecho esto, localizamos esta línea de código:

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

Normalmente esta parte del post-footer no tiene uso, así que colocaremos nuestro nuevo código justo a continuación:

Código a usar [+/-]

<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>

Si hay varias etiquetas, es muy probable que la lista mostrada pueda contener muchos posts.

Si queremos aumentar la cantidad de posts a mostrar, cambiamos el valor en esta línea del script:

if (cuantosPosts == 3) {

Si lo encuentran muy complicado aca esta explicado de otra forma: