Entradas Relacionadas con Imagen en Blogger

Este es un post como invitado de Kevin Torres, blogger de tudiscolive, blog que trata de música, programas, peliculas, tutoriales, juegos, tecnología.

Hola, navegando por la web encontre este espectacular script en Blogger Plugins.Se trata de las llamadas 'Entradas relacionadas', las cuales consisten en darte un toque más novedoso a tu Blog y ganar mas visitas con vista previa de otros posts publicados anteriormente, ya que los usuarios se verán tentados por la curiosidad al ver estas imágenes.

Ahora para instalarlo, en primer lugar te ubicas y te vas a la pestaña Diseño > Edición de HTML > Expandir Los Artilugios, Presiona Ctrl+F, Y busca:

</head>

Y justo encima de esta pegamos el siguiente código:

<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remover --><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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8MoXwx-hZYdFwWYQC5gnDZg2mdB3lyyu493X9Xo19lL2yum5GGOV9nbpMdDGSnP8VnQ_pq8_E1c9lb567lzcV5nlgYt_rVPHRYU_4eMo5jQWsCNL15WCoKbnebp0n0EpDD2KZjRmR1Ng/s400/noimage.png";
var maxresults=6;
var splittercolor="#d4eaf2";
var relatedpoststitle="Entradas Relacionadas";
</script>
<script src='http://blogergadgets.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js' type='text/javascript'/>
<!-- remover --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

Ahora Busca:

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

Si no puedes encontrar esta linda, busca esta otra:

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

Ahora inmediatamente justo después de alguno de estos códigos pega este código:

<!-- Related Posts with Thumbnails Code Start-->
<!-- remover --><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'/>
<!-- remover --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html'><img style="border: 0" alt="Related Posts Widget For Blogger with Thumbnails" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a><a href='http://bloggertemplates.bloggerplugins.org/' ><img style="border: 0" alt="Blogger Templates" src="http://image.bloggerplugins.org/blogger-templates.png" /></a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->

Configuración Avanzada:

- Puedes ajustar el número máximo de entradas relacionadas vistas editando el siguiente código:

var maxresults=6;

- Para cambiar la imagen que viene por defecto:

"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8MoXwx-hZYdFwWYQC5gnDZg2mdB3lyyu493X9Xo19lL2yum5GGOV9nbpMdDGSnP8VnQ_pq8_E1c9lb567lzcV5nlgYt_rVPHRYU_4eMo5jQWsCNL15WCoKbnebp0n0EpDD2KZjRmR1Ng/s400/noimage.png";

- Para cambiar el color de la línea divisoria:

var splittercolor="#d4eaf2";

¿Pero como mostrar las entradas relacionadas al inicio de la página y no dentro del posts?

Muy Fácil, Solo retira estas líneas y listo!

<!-- remover --><b:if cond='data:blog.pageType == &quot;item&quot;'>

Y esta otra:

<!-- remover --></b:if>

Si quieres escribir artículos como invitado para Pazos Blogger, y promocionar tu blog o página web puedes leer las condiciones en: Participa en Pazos Blogger.