Gadget para mostrar tus últimos posts con imágenes en miniatura en blogger

Navegando por internet encontré un widget que me ha sido de mucha utilidad y es el que estoy utilizando actualmente en mi blog. Este widget lo ví en Mad Tomato, así que lo voy compartir por este medio también para aquellos que deseen agregar este útil gadget en sus blogs.

Tienes 2 opciones a escoger: la primera es que puedes mostrar tus últimos posts con imágenes, títulos y el texto en miniatura, la segunda opción vendría a ser mostrar tus últimos posts con imágenes y sus títulos solamente.




Para añadir este gadget, sigue estos pasos:


1) Nos vamos a Blogger > Diseño > Elementos de la página > Añadir un Gadget

Abrir imagen

Bajamos y buscamos la opción que dice HTML/Javascript.




2) Ahora en el cuadro añadimos el siguiente código:

<div class="eggTray"> <script src="https://sites.google.com/site/projectdigitaltomato/blogger/js/listbadge.js">{"pipe_id":"1a6640e2a78b2c6e736f2220529daae5","_btype":"list", "pipe_params":{"URL":"http://El-nombre-de-tu-blog.blogspot.com/feeds/posts/default"}, "hideHeader":"false","height":"500","count": 8 }</script> <noscript>Your browser does not support JavaScript!</noscript></div> <style type=text/css> .eggTray {margin:10px 0px;padding:0px;} .ybr li {border-bottom:0px #cccccc dotted; padding:0px 0px 10px 0px!important;} .ycdr {background:transparent 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 4px 0px 0px 0px;line-height:14px;} .ycdr, .ycdr a {color:#999999;} .widget .popular-posts ul {padding-left:0;} </style>

3) Debemos ahora hacer algunos cambios:


> Lo que está de color azul, debes reemplazarlo por el nombre de tu blog de blogger.


> Lo que está de color rojo:


"height":"500" es la altura del gadget, pero por defecto tiene scroll, esa barra que sube y baja. Si no deseas esa barra en el gadget, simplemente elimina 500 y déjalo vacío entre comillas.


"count": 8 es el número de los posts en miniatura que se mostrarán en tu blog. Puedes aumentar ó disminuir el número según tu elección.




4) Guarda los cambios y eso sería todo.




Si deseas el gadget sólo con las imágenes y el el título, mas no la descripción del post, entonces en vez del código anterior, pega el siguiente en el gadget de tu blog:

<div class="eggTray"> <script src="https://sites.google.com/site/projectdigitaltomato/blogger/js/listbadge.js">{"pipe_id":"1a6640e2a78b2c6e736f2220529daae5","_btype":"list", "pipe_params":{"URL":"http://El-nombre-de-tu-blog.blogspot.com/feeds/posts/default"}, "hideHeader":"false","height":"500","count": 8 }</script> <noscript>Your browser does not support JavaScript!</noscript></div> <style type=text/css> .eggTray {margin:10px 0px;padding:0px;} .ybr li {border-bottom:0px #cccccc dotted; padding:0px 0px 10px 0px!important;} .pipesTitle {padding-top:10px;} .pipesDescription {display:none;} .ycdr {background:transparent 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 4px 0px 0px 0px;line-height:14px;} .ycdr, .ycdr a {color:#999999;} .widget .popular-posts ul {padding-left:0;} </style>

Y sigue los mismos pasos que la anterior.
Imprimir artículo