Cómo poner entradas relacionadas en tu blog de blogger


Una forma de hacer que los lectores de tu blog alarguen su visita en tu blog es añadiendo entradas relacionas en él.



¿Quieres saber cómo añadir entradas relacionadas en tu blog? Pues vamos a ello:

1) Vamos a Diseño.
2) Edición de HTML -> marcamos la casilla "expandir artilugios"
3) Buscamos el siguiente código: ]]></b:skin> (tecleamos Ctrl + F para buscar más rápido).
4) Después de ]]></b:skin> pegamos el siguiente script:


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


5)
Ahora buscamos el siguiente código: <b:if cond='data:post.labels'>
6) Un poco más abajo de <b:if cond='data:post.labels'> nos encontraremos con </b:loop>
7) Antes de </b:loop> pegaremos el siguiente código:


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


8)
Una vez esté todo lo anterior hecho buscaremos ahora <p class='post-footer-line post-footer-line-3'/> o dependiendo de la plantilla deberemos buscar <div class='post-footer-line post-footer-line-3'/>
9) Después del código del paso anterior deberemos pegar


<b:if cond='data:blog.pageType == "item"'>
<p>Entradas relacionadas:
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</p>
</b:if>


Ya está todo listo. ¡A disfrutar!


Código extraído de oscargp.

40 comentarios:

  1. Buenísimo tu blog. Enhorabuena. Yo tengo un blog de blogger(http://fashiontotal.blogspot.com) y ya he puesto un montón de tus trucos.
    Un saludo

    ResponderEliminar
  2. Gracias fashiontotal. Bienvenido a este blog.

    ResponderEliminar
  3. Hola admin, una pregunta: ¿Si no hay articulos relacionados no aparecerá nada verdad? es que en mi blog si aparece entradas relacionadas pero no aparece nada mas (el resto esta bien).

    Espero tu respuesta
    PD. En el paso 8 use la opcion 2 espero y te ayude a responderme.

    ResponderEliminar
  4. Hola Gigaman, te muestra las entradas relacionadas por etiquetas, por lo que si no tienes otras entradas con esa etiqueta no te mostrará nada. El paso 8) no altera el resultado, no te preocupes.

    Un saludo amigo.

    ResponderEliminar
  5. Muchas gracias a ti -Lunatika-. Un saludo y gracias por tu visita y comentario.

    ResponderEliminar
  6. Hola, en mi blog de arte (el nuevo) estas entradas estan muy abajo del "post-footer", hasta parece como si estuvieran en "p" debajo de "post footer line 3", el problema es que las entradas relacionadas están muy cerca del titulo de "coments " entonces necesito que me ayudes para subir estas partes un poco o bajar la parte "coments" para que no haya distorsión (pues aun no hay nada pero si se mal).

    PD: Es lo unico que me falta y ahora si, a bloguear.

    Espero tu respuesta.

    ResponderEliminar
  7. Hola Gigaman. Ves mirando todos los < p class='post-footer-line post-footer-line-1' > que tengas (2,3...). Como tu plantilla parece que está un poco "alborotada" deberías ir probando en cada bloque que puedas con los post-footer.

    Coméntame cómo te ha ido.

    ResponderEliminar
  8. Hola admin, tengo que decirte que ya había probado con eso que me acabas de explicar y no funciono, entonces me rendí y lo único que pude hacer fue poner el paso 9 antes de "post-footer 1" y subir todo lo que estaba en 2 (lo que era editar, etiquetas y cosas así) a 1, ahora las entradas relacionadas están antes de de estas opciones, no se ve tan mal, pero bueno haber como queda cuando ya publique.

    PD: Reanudare el blog el sábado en la noche o en domingo, ya a partir de ese podre bloguear de manera normal.

    Saludos.

    ResponderEliminar
  9. Hola Gigaman, haz una cosa. Prueba antes de < p class='comment-footer' >

    ResponderEliminar
  10. Hola admin lo intente como de acababas de explicar pero no funciono, ya mejor lo coloque tambien antes de "post-footer" junto con el gadget de las redes sociales, pero esta vez les coloque un salto de linea antes de cada codigo, haber y como queda la apariencia (yo pienso que no se ve tan mal).

    Gracias por tu ayuda y saludos.

    ResponderEliminar
  11. Siento no dar con la clave para solucionar tu problema. Me estoy volviendo loco y estoy probando con varios tipos de plantillas para ver si doy con cuál puede ser tu problema. Todo lo que te he recomendado que hicieses no te ha servido. Lo siento de verdad.

    ResponderEliminar
  12. Hola quierocrearunblog,

    Acabo de conocer tu web a partir de alguien que ya había utilizado uno de tus trucos. Me gusta la idea de compilar la información respecto de la mejora de blogs y todo eso. Gran aporte.

    Sólo un problema. He intentado aplicar paso por paso las indicaciones que señalas en este post para hace un lista de enlaces relacionados, pero no me aparece nada nuevo. Es como si no hubiera cambiado nada del blog. Me podrías ayudar a solucionarlo?? Podría deberse a una incompatibilidad de versiones de blogger??

    Hace un tiempo añadí una sidebar nueva a la izquierda. Tendrá algo que ver??

    Mi blog está en mi perfil, no quiero hacer spam en tu blog.

    Saludos y gracias de antemano!

    ResponderEliminar
  13. Hola Pirrimarzon. Bievenido a este blog y gracias por comentar, y muchas gracias aún por tener en consideración las normas de este blog. Te lo agradezco.

    ¿Has tenido en cuenta que para observar las "entradas relacionadas" debes haber entrado primero a la entrada?

    Lo que comentas de la sidebar no tiene nada que ver, no te preocupes. Y sobre lo de las versiones de blogger imagino que tampoco, de todas formas te recomiendo que tengas la opción activada en Configuración->Básico ->abajo del todo: seleccionar "Editor actualizado"

    Coméntame cómo fue.

    Saludos.

    ResponderEliminar
  14. Gracias a ti por responder rápidamente ;)

    No sé lo que quieres decir en "haber entrado primero en la entrada"... Yo pensaba que era un widget que automáticamente te colocaba debajo de la entrada una serie de enlaces, que utilizan las mismas etiquetas que la entrada inicial. Me he perdido entonces. Me lo podrías aclarar??

    Un saludo

    ResponderEliminar
  15. Hola de nuevo.

    A ver que me explique. Cuando haces modificaciones en tu plantilla HTML y clicas en vista previa o guardas los cambios, aparecerás en tu página principal. Si pulsas sobre un título de una entrada cualquiera, accederás sólo a esa entrada en concreto. Y sólo es en este caso en donde te aparecen las entradas relacionadas. Es decir, no aparecen en tu página principal, sino sólo en el interior de cada entrada.

    ¿Mejor así? jeje.

    ResponderEliminar
  16. Jajaja ¡qué torpe soy!

    Es cierto, funciona estupendamente así. Pensaba que los enlaces se tenían que ver desde la página inicial del blog. ¡Pues mira que le he dado vueltas!

    Muchas gracias crack

    Un saludo y gracias por hacerte seguidor

    ResponderEliminar
  17. Jajaja. Ya me parecía raro que no te funcionase.

    Espero volverte a ver por aquí. Un saludo compañero y gracias a ti por participar en este blog.

    ResponderEliminar
  18. Hola, admin, veo en tu comentario acerca de que te rompías la cabeza por mi problema, no te preocupes no es tan grave (ademas como lo habia dicho no se ve tan mal) ademas, no aparece en la pagina principal, solo en la entrada concreta mente, pero si lo deseas te puedo pasar mi plantilla para que intentes.

    Saludos y No te estreses mucho.

    ResponderEliminar
  19. Hola Giga. Es que las entradas relacionadas sólo deben aparecer cuando entras dentro del post.

    Un saludo, me tomaré una tila jaja.

    ResponderEliminar
  20. jaja, yo tampoco sabía que sólo se veían cuando entrabas a una entrada en particular

    sirve mucho leer los comments XD

    ResponderEliminar
  21. Claro MaxXxCock, por eso mi empeño en cumplir con las normas a la hora de comentar. Sólo se debe comentar en la entrada que guarde relación con la duda, así servirá para otro visitante. Es por el beneficio de todos.

    ¡Un saludo compañero!

    ResponderEliminar
  22. hey, vi en algunos blog de blogger que tenían entradas relacionadas pero con imágenes, si sabes como hacerlo, podrías explicarlo?

    Gracias

    ResponderEliminar
  23. ¡Ay ay ay! Te voy a tener que reñir MaxXxCock. ¡Que no eres nuevo por aquí! jajaja. Si hubieses empleado el buscador empleando las palabras "entradas relacionadas imágenes" hubieses encontrado esta entrada sobre ello:

    http://www.quierocrearunblog.com/2009/08/poner-entradas-relacionadas-posts-con.html

    Saludos y gracias por tu comentario.

    ResponderEliminar
  24. oye si me ayudaras por favor, es que estoy comenzando un blog con unos camaradas, pero tengo un problema con esto de entradas relacionadas, el problema es que sale con letras muy pequeñas y temo que si sigue así, pues la gente no los vera y me gustaría que me ayudes a como hacerlo un poco más grande. Gracias

    ResponderEliminar
  25. Hola del paso 5 no encuentro el scrip

    Que puedo hacer?

    Saludos,

    Mi blog es: http://refrescoparaelalma.blogspot.com/

    ResponderEliminar
  26. @Miklo. Hola. Si quieres poner la letra más grande en tu blog ves a Diseño->Fuentes y colores. Allí, a parte de elegir los colores y tipo de letra, puedes elegir agrandar la letra. Si no te funciona y no tienes disponible esta opción, ves a Diseño->Edición de HTML y por el comienzo de tu plantilla deberás encontrar algo así:

    <Variable name="bodyfont" description="Text Font"
    type="font" default="normal normal 100% Georgia,Serif;">

    Cambia el 100% por un valor superior, por ejemplo 110% y prueba hasta que esté a tu gusto. Espero que te sirva, un saludo.



    @David Torres. Hola, ¿has marcado la casilla "expandir artilugios?

    ResponderEliminar
  27. Quierounblog: Si maestro, si marco expandir artilugios, pero no encuentro ese scrip. En otro blog pude poner las entradas relacionadas sin problemas, pero no puedo en este blog. Quizas sea la plantilla del blog.
    Intentante un par de veces mas. En caso no pueda, le cambiare la plantilla.

    Saludos,

    David Torres

    ResponderEliminar
  28. Hola David Torres. No sé darte una explicación, debería funcionarte tal y como comentas que te funcionó con tu otro blog. Quizá se te escape algún paso o lo pongas de forma equivocada. Lo lamento mucho. En ocasiones hay plantillas que dan verdaderos quebraderos de cabeza...

    ResponderEliminar
  29. Me Sale Que Error y No Puedo Guardar la plantilla me puedes ayudar con eso? te lo agradeceria

    ResponderEliminar
  30. Buenas tardes. En primer lugar felicitaciones por tu blog. Estimado amigo, tengo un blog: www.laberintosdeltiempo.blogspot.com , intente hacer cada uno de los pasos que indicas en este post, y al final me aparece "entradas relacionadas" pero nada mas...(todas las entradas tienen etiquetas, lo cual me parece extraño que no aparezcan) por favor..ayudeme. Saludos.

    ResponderEliminar
  31. De verdad muy bueno,yo tengo un blog y tu truco me sirvio pero quisiera saber como puedo agregar el sistema de calificacion a mi blog

    ResponderEliminar
  32. Hola, hice lo que dices en este post en mi blog (http://megustafacebok.blogspot.com/)y me funciona muy bien PERO me gustaría poner las entradas relacionadas después de los comentarios. ¿Es posible? Muchas gracias por tu ayuda

    ResponderEliminar
  33. Buenos dias, saludes desde nicaragua, todo me salio muy bien ,quisiera saber si se puede mosificar solo el titulo de entradas relacionadas, por ej. el color en tipo de fuente y la altura, sin modificar las fuentes del blog,,agardecido,

    http://carlosagaton.blogspot.com/

    ResponderEliminar
  34. Mil gracias, me resolviste una duda que estaba buscando hace un año ... muy bueno tu blog y felicitaciones sigue adelante.

    Puedes darte una vuelta por mi blog:

    http://www.spityourideas.com/

    ResponderEliminar
  35. Hola, en mi blog no aparece la linea ¿donde la busco?

    ResponderEliminar
  36. Excelente tu blog, estoy implementando tus artilugios en mi blog. Gracias.

    ResponderEliminar
  37. Hola. Yo desearía que las entradas relacionadas aparecieran tanto en la página principal como en cada entrada. ¿Qué he de hacer? Gracias anticipadas.

    ResponderEliminar
  38. Hola,
    Estoy intentando actualizar mi blog, pero no he encontrado lo siguiente:

    ¿por qué puede ser?
    Mi blog es http://quequereismerendar.blogspot.com.es/
    Estoy muy interesada en poner esta opción al final de mis entradas.
    Espero tu respuesta
    Carmen

    ResponderEliminar