Posts Relacionados en Blogger

Posts Relacionados en Blogger

Incluir una lista con los enlaces más relevantes en nuestras entradas significa un aumento de páginas vistas, por lo que es una buena idea para que los usuarios visiten tus posts eficazmente.

Por defecto las plantillas clásicas de blogger no poseen esta función, tampoco las plantillas comunes, pero a pesar de no estar integrado, podemos añadirlo fácilmente

El resultado es el siguiente:


¿Cómo crear una sección de posts relacionados al final de cada entrada?

Primero debes ir a ''Diseño/Edición de HTML'', en donde deberás expandir los artilugios.

Después buscarás el código </head> y antes de éste, pegarás el siguiente:


<style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("http://lh3.ggpht.com/_cNpXRtRph18/S76dASm3WGI/AAAAAAAAEJg/AVmw4HhRdsk/rss.png") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='https://sites.google.com/a/blogsydescargas.co.cc/ayudabloggers/scripts/postsrelacionadosblogger2.js' type='text/javascript'/>

El texto en color corresponde a la imagen que se mostrará como enumerador.

Ahora buscamos el siguiente código:
<div class='post-body> o <data:post.body/> 

y debajo de este, deberás pegar el siguiente código:


<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Posts Relacionados: </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><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&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>

Nota:
  • Para cambiar el número de posts relacionados, cambias max-results=5 por la cantidad que desees.

Artículo aleatorio
BuySellAds
BuySellAds
BuySellAds
BuySellAds
BuySellAds
Artículos destacados
Marca de agua en las imágenes con CSS # - Marca de agua en las imágenes con CSS
Efecto de desenfoque con CSS # - Efecto de desenfoque con CSS
Botones para subir y bajar en Blogger # - Botones para subir y bajar en Blogger
Insertar una página externa en una entrada en Blogger # - Insertar una página externa en una entrada en Blogger
Ocultar entradas con determinada etiqueta en el inicio de Blogger # - Ocultar entradas con determinada etiqueta en el inicio de Blogger