Hace tiempo vi en el blog de Hoctro un truco bastante interesante. Se trata de incluir los artículos relacionados, como previamente habíamos visto, pero esta vez por categorías.
Opté por explicar el truco en el balcón y hacer unos retoques en el código para que podamos usarlo en español. ^_^
Te dejo una imagen para que entiendas mejor de lo que hablo:
Como puedes ver, los posts relacionados aparecen según las etiquetas que tengan (Lorem ipsum y Lorem ipsum 2 en este caso).
Para incluirlo en tu blog simplemente debes seguir los pasos que te muestro a continuación...
Busca la etiqueta <data:post.body/> y justo debajo pega lo siguiente:
<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<!-- ***http://hoctro.blogspot.com***Jan,2007**** -->
<!-- ***Related Articles by Labels - Take Two*** -->
<!--
Modificado por El balcon de jaime y Jackbook.com.
1. Now, users don't need to change anything to use this widget. just copy and paste, and done!
2. The current article will also be listed, now it's no more.
-->
<div class='widget-content'>
<h3>Artículos relacionados:</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 4;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>
Puedes editar lo siguiente...
- El número máximo de entradas relacionadas a mostrar por etiqueta:
Busca la línea var maxNumberOfPostsPerLabel = 4; y cambia el 4 por el número máximo de entradas a mostrar con cada etiqueta. Hay dos líneas iguales, cámbialo en ambas.
- El número máximo de etiquetas (son sus respectivas entradas relacionadas) a mostrar:
Busca la línea var maxNumberOfLabels = 10; y cambia el 10 por el número máximo de etiquetas a mostrar. Hay dos líneas iguales, cámbialo en ambas.
Guarda cambios y tendrás los artículos relacionados por categorías en tu blog. ☺
Genial este truco Jaime. ME gusta mas que el anterior, es mas completo, muestra los posts relacionados con cada etiqueta que tengan.
Gracias por enseñarnos esto.
Yonkiee - First, me alegra que te haya gustado, es cierto que es muy completo.
Así es, aparecen las entradas relacionadas con cada etiqueta ☺
Saludos! ^_^
Hola Amigo Jaime:
Es muy util este tipo de trucos, sin embargo en algunas plantillas <data:post.body/> esta dos veces o mas, dberias especificar a los usuarios que lineas hay adelante o despues, por ejemplo en mi platilla <data:post.body/> esta entre <p> </p> , osea asi <p><data:post.body/></p> y para usuarios que se les dificulta esto del HTML esto los confundira mas.
GuillermoZ0009, es cierto. Lo había olvidado :-S
Gracias por recordármelo ^_^
¡Saludos! ☺
El exito muchas gracias ...
El Profe, es estupéndo oir eso ;).
Hola buenas, que tal, tengo funcionando este script en mi blog (macvisions.net) pero tengo una duda, hay alguna posibilidad de hacer que no se repitan las entradas? se me repiten las entradas en las categorias y además siempre coge las primeras categorías de la entrada.
Saludos.
Hola OctaviZ™, al parecer he encontrado una forma muy sencilla de editar los resultados a mostrar.
Voy a editar la entrada de manera que puedas cambiar algunos valores y así evitar que se repitan las entradas y que no se muestren también las antiguas ;).
Jaime, no sé si ésto podría servirme. Te explico: tengo un montón de etiquetas, pero las de cocina quisiera agruparlas (aperitivos, entrantes, carnes, pescado, postres, tartas, pan y bollería).
¿Si lo hiciera de la forma que dices, me podría quedar bien? ¿Y una vez que lo tuviera podría ponerle [+/-]?
Sé que son muchas preguntas, pero me quedan pocas cositas ya que ponerle al blog, y ésta es una imprescindible.
Gracias y un saludo
varech, puedes hacerlo de una forma bastante sencilla:
Utilizando el gadget de "Lista de enlaces" y enlazando cada etiqueta en su correspondiente grupo.
Para ponerle a cada gadget de lista que añadas el [+/-] visita esta entrada.
Hola Jaime: quisiera comentarte una cosa que me pasa en el blog y que no doy con el quiz.
Verás: cuando pincho en la lista de etiquetas, en todas me salen todos los artículos de esa etiqueta, menos en la que tengo "Excursiones", que me salen solo dos, cuando tengo cuatro.
Y esta noche estoy viendo que en la página principal, que tengo habilitadas 20 entradas, sólo tengo tres. ¿Sabes tú el por qué?
Un abrazo
Jaime, he observado que si quito la entrada que acabo de poner, la página principal sale ya bien, pero si le doy a publicar, otra vez me deja solo con tres entradas.
En cualquier caso, en la etiqueta excursiones no me salen todas.
Jaime, ayer leí que Blogger había limitado las entradas con muchas fotos por la lentitud de carga del blog.
Es posible que sea eso, puesto que sólo pasa en la etiqueta "excursiones", que es donde tengo mayor número de fotos, y sin reducir de tamaño, que pesan lo suyo.
¿Crees que si las reduzco podría evitar ese problema?
Perdona que te dé tanto la vara, pero es que me llevé un susto enorme cuando vi el blog tan descolocado.
varech, el problema con las entradas en las páginas de etiquetas o el del número de posts a mostrar en la página principal están relacionados con el tema del nuevo "límite" que está introduciendo blogger.
He recibido varios correos con el mismo problema y al parecer, blogger quiere reducir el tiempo de carga de las bitácoras (ha sido ordenado por Google).
Para ello se reducirá el número de entradas a mostrar en la portada.
Lo más probable es que si reduces el tamaño de las fotos, éstas aparezcan sin problemas.
¡Abrazos y suerte!
Jaime, ¿cómo hariamos para resaltar los artículos relacionados con un marco y fondo? Estoy intentando editar la plantilla pero no soy capaz
gracias
Isaac, prueba a reemplazar esta línea en el código:
<div class='widget-content'>
Por esta otra:
<div class='widget-content' style="border:1px solid #cccccc; background:#f4f4f4;">
El borde aparecerá en un color gris oscuro mientras que el fondo será gris blancuzco. Si deseas editar el aspecto y no sabes como hacerlo consúltame.