-->
Entradas relacionadas en Blogger con Thumbnails

Entradas relacionadas en Blogger con Thumbnails

Hace algún tiempo atrás, escribí una entrada de cómo agregar un related post mediante LinkWithin, un servicio bastante bueno y muy popular basado en un widget.

En esta oportunidad enseñaré una alternativa bastante fiable mediante adición a la plantilla.

Vista previa del script:


¿Cómo añadirlo a Blogger?
Primero, vamos a ''Diseño | Edición HTML'', en donde marcamos ''Expandir plantillas de artilugios''. Buscaremos la siguiente zona: 
</head>

Arriba de esta, pegaremos el siguiente código:
<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, &#8220;Times New Roman&#8221;, Times, serif;
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'>
var defaultnoimage="http://2.bp.blogspot.com/-R285B_Pf0q4/TbXKNLTdA8I/AAAAAAAAAzk/9cKeL67QAzc/s1600/sinimagen.jpg";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Entradas relacionadas:";
</script>
<script src='https://sites.google.com/a/blogsydescargas.co.cc/ayudabloggers/scripts2/posts-relacionados-blogger.js' type='text/javascript'/>
</b:if> 
Ahora busca la siguiente línea:
<div class='post-footer-line post-footer-line-1'> 
Si no la encuentras, busca esta otra:
<p class='post-footer-line post-footer-line-1'>

Debajo de esta, pega el siguiente código:
<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>
<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:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
</b:if>

Si deseas cambiar la cantidad de entradas que se visualizarán reemplaza el número de la siguiente zona:
max-results=6

Si deseas reemplazar la imagen que aparecerá cuando una entrada no contenga ninguna, reemplaza la siguiente URL por la deseada:

http://2.bp.blogspot.com/-R285B_Pf0q4/TbXKNLTdA8I/AAAAAAAAAzk/9cKeL67QAzc/s1600/sinimagen.jpg
Artículo aleatorio
BuySellAds
BuySellAds
BuySellAds
BuySellAds
BuySellAds
Artículos destacados
Plantilla para Blogger: GeekLines # - Plantilla para Blogger: GeekLines
Agregar imagen en el formulario de comentarios # - Agregar imagen en el formulario de comentarios
Instalar Like Box Facebook en Blogger # - Instalar Like Box Facebook en Blogger
Evitar que usuarios malintencionados denuncien tu Blog # - Evitar que usuarios malintencionados denuncien tu Blog
Agregar Meta tags en Blogger # - Agregar Meta tags en Blogger