Este truco es muy util si queremos alargar la visita de nuestros lectores ya que le mostrara otros post de tu blog que tal vez le interesen,el truco aplicado se vera asi:

Pasos
1. Buscamos en la plantilla el codigo

</head>

2. Ya ubicado este codigo pegamos arriba de este lo siguiente

<!-- Articulos relacionados con miniaturas -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>

#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts  a:hover {
background-color:#d4eaf2;
}

</style>

<script type='text/javascript'>
//<![CDATA[

//Script by Aneesh of www.bloggerplugins.org
//Released on August 19th August 2009
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
var thumburl = new Array();
function related_results_labels_thumbs(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
try
{thumburl[relatedTitlesNum]=entry.media$thumbnail.url;}

catch (error){
s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src="",a);c=s.indexOf(""",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){
thumburl[relatedTitlesNum]=d;} else thumburl[relatedTitlesNum]='http://lh4.ggpht.com/_NNS6r_z4aeg/SuOQIOq8y3I/AAAAAAAAN_o/hD-YGKj_QFg/sinimagen.jpg';

}

if(relatedTitles[relatedTitlesNum].length>35) relatedTitles[relatedTitlesNum]=relatedTitles[relatedTitlesNum].substring(0, 35)+"...";
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;

}
}
}
}
function removeRelatedDuplicates_thumbs() {
var tmp = new Array(0);
var tmp2 = new Array(0);
var tmp3 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains_thumbs(tmp, relatedUrls[i]))
{
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp3.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];
tmp3[tmp3.length - 1] = thumburl[i];
}
}
relatedTitles = tmp2;
relatedUrls = tmp;
thumburl=tmp3;

}

function contains_thumbs(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;
}
function printRelatedLabels_thumbs() {
for(var i = 0; i < relatedUrls.length; i++)
{
if((relatedUrls[i]==currentposturl)||(!(relatedTitles[i])))
{
relatedUrls.splice(i,1);
relatedTitles.splice(i,1);
thumburl.splice(i,1);

}
}

var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;

if(relatedTitles.length>0) document.write('<h2>'+relatedpoststitle+'</h2>');
document.write('<div style="clear: both;"/>');
while (i < relatedTitles.length && i < 20 && i<maxresults) {


document.write('<a style="text-decoration:none;padding:5px;float:left;');
if(i!=0) document.write('border-left:solid 0.5px #d4eaf2;"');
else document.write('"');
document.write(' href="' + relatedUrls[r] + '"><img style="width:72px;height:72px;border:0px;" src="'+thumburl[r]+'"/><br/><div style="width:72px;padding-left:3px;height:65px;border: 0pt none ; margin: 3px 0pt 0pt; padding: 0pt; font-style: normal; font-variant: normal; font-weight: normal; font-size: 12px; line-height: normal; font-size-adjust: none; font-stretch: normal;">'+relatedTitles[r]+'</div></a>');

if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
}
document.write('</div>');

}

//]]>
</script></b:if>
<!-- fin artículos relacionados -->

3.  Luego buscamos este codigo

<div class='post-footer-line post-footer-line-1'>

4. Abajo de el codigo anterior pegamos lo siguiente

<!-- Articulos relacionados con miniaturas -->

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=4;
var relatedpoststitle=&quot;Post relacionados&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>

<!-- Articulos relacionados con miniaturas -->

Por defecto el script solo te mostrara 4 entradas pero si quieres cambiarle el numero de entradas entonces al codigo var maxresults=4; le cambias el 4 por el numero que quieras ponerle.

 

Categorías: Trucos Blogger

26 commentarios

Juvinao · abril 9, 2011 a las 5:29 pm

Esta es una sencilla forma de poner el famoso Post Relacionados :-o:-o

Jorge Luis · abril 10, 2011 a las 3:49 am

Gracias amigo sirve de mucho ya lo coloque en todas mis webs

Juvinao · abril 10, 2011 a las 3:46 pm

@Jorge Luis

Si amigo es un truco muy util,gracias a ti por visitar y comentar 😉

Paula · mayo 31, 2011 a las 10:25 pm

pues yo por más q lo he hecho tal cual…no me aparece cambio alguno!!

Juvinao · junio 1, 2011 a las 12:16 am

@Paula El cambio se ve reflejado solo en las entradas y el truco si funciona,dejame la URL de tu blog para verificar cual es tu problema 😉

GFR · junio 9, 2011 a las 4:53 pm

Este comentario ha sido eliminado por el autor.

Juvinao · junio 10, 2011 a las 12:43 am

@GFR Es raro que no te funcione,pasame tu plantilla para poder mirar cual es el problema.

Anonymous · junio 14, 2011 a las 5:10 pm

hola te comento que segui los pasos que sugieres para poner los post relacionados pero te comento que no se visualiza nada en mi blog, por qué ocurre esto? gracias por tu ayuda

Moni

Juvinao · junio 15, 2011 a las 12:36 am

@Anónimo Pues mira yo tengo este truco aplicado en este blog Blog Warez! y como te daras cuenta funciona muy bien.

Juvinao · junio 15, 2011 a las 12:47 am

Pues muy seguramente el problema que tienen es que no les aparece en su pagina principal porque los cambios se ven reflejados solo en las entradas

Anonymous · julio 25, 2011 a las 1:14 am

Hola podrias decirme como puedo poner que solo muestre por defecto una etiqueta especifica o label. Y que solo se muestre en una pagina estatica y no salga en el index. El personalizado ya le vi claro…gracias.

Juvinao · julio 25, 2011 a las 4:23 pm

@Anónimo Por favor se mas claro no te entiendo 🙁

Fredd Hannay · agosto 23, 2011 a las 1:26 am

Al fin uno que anda, y que es facil de colocar, muchas gracias de nuevo.

Juvinao · agosto 23, 2011 a las 3:19 am

Fredd Hannay gracias por comentar y me alagre que el tutorial te haya gustado

Jose Silvano Zavala Torres · diciembre 15, 2011 a las 10:34 pm

Gracias, me ha servido de mucho este truco.

Ahora puedo mantener a mis lectores un poco mas en mi blog

Juvinao · diciembre 16, 2011 a las 12:26 am

Jose Silvano Zavala Torres que bueno que te haya servido el truco,Saludos

Elaine · febrero 24, 2012 a las 2:29 pm

Hola, a mi me pone entradas relacionadas debajo de los post pero no me sale nada más! ayuda!! >_<

    Juvinao · febrero 24, 2012 a las 9:10 pm

    Elaine pues que raro porque la verdad el truco si sirve.

Chris Kun · agosto 4, 2012 a las 9:51 am

Hola, trate de agregarlo pero no encuentro el codigo:

div class=’post-footer-line post-footer-line-1

    Juvinao · agosto 5, 2012 a las 3:14 am

    Lo buscastes con los artilugios expandidos?

Alexander Guerra Padilla · enero 19, 2013 a las 4:04 am

Hayder Juvinao como hago para que me salgue centrado y con las imagenes un poco mas grande!

Edwar Palacios · mayo 17, 2013 a las 11:21 am

he seguido tus pasos y no funciona
mi blog es advent7d.blogspot.com

Andro Maniako · diciembre 22, 2013 a las 5:13 pm

No Me Funciono

Anonymous · mayo 3, 2014 a las 9:09 pm

No me sirvio

Sara Higueras · septiembre 25, 2014 a las 2:31 pm

No me funciona y lo e echo exactamente como has dicho.No se visualiza en ninguna entrada.
http://www.dukanfacilescalera.blogspot.com

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *