Gadget de posts aleatorios (al azar) con imagen en miniatura


Bueno, hoy les enseñaré a colocar un sencillo gadget en nuestra sidebar que nos permitirá mostrar una lista de post al azar, pero con imágenes en miniatura, tal como pueden ver en la imagen.


1.§ Vamos a Plantilla - Edición de HTML; si usamos a antigua interfaz de Blogger, vamos a Diseño - Edición de HTML.

2.§ Con ayuda de Ctrl+F buscamos ]]></b:skin>

3.§ Encima de ]]></b:skin> pegaremos:
#random-posts img{
float:left;
margin-right:10px;
border:1px solid #999;
background:#FFF;
width:36px;
height:36px;
padding:3px}
Las líneas que agregamos, son los estilos de la imagen en miniatura. Podemos modificar la ubicación, el color y grosor del borde, el ancho y alto de la imagen, etc.

4.§ Damos click a Guardar.

5.§ Ahora, vamos a Diseño - Añadir un gadget - HTML/Javascript.

6.§ Dentro del gadget pegaremos el siguiente script:


Como pueden ver, en el script hay tres valores resaltados en negrita que podemos modificar:

» var rdp_numposts=5; es el número de post a mostrar.
» var rdp_snippet_length=150; es el número de caracteres a mostrar.
» var rdp_info='yes'; son los datos que aparecen debajo del nombre del post (la fecha de publicación y el número de comentarios.

7.§ Damos click a Guardar y listo.

Visto en : E-seopro.com

9 opinaron:

G

estaba buscando algo así; como siempre explicas muy bien. lo agregaré

Responder
Yessmi

se ve muy bueno, a añadirlo al blog

Responder
squirrel

excelente post ya lo añadi a mis marcadores !

Responder
Nani-chan

A mi no me funciona, el blog ni me carga-> http://pruebas-plantilla2-layouts-omd.blogspot.com.es/

Responder
Yessmi

Ha quedado muy bien en mi blog. Lo apliqué y ha quedado genial.
excelente este tutorial

Responder
La inquisidora

Gadget agregado se ve muy nice en mi blogcito !!!

Responder
Ventasonline

Como hago para agrandar el tamaño de las imagenes?

Jéssica YK

» Ventasonline:
Hay que modificar los estilos del paso 3.§. width y height son el ancho y el alto respectivamente de las imágenes, que tienen valores de 36 px. Cambia ese valor por el que tu desees

S@lu2

Responder
carlos

Me sirvió, pero mi duda es que cuando engrando el tamaño de imagen a 330px x 200px, la imagen que extrae es de baja calidad, alguna forma para que tome una imagen de mejor calidad? y también estaría bueno que se pudiera dar clic en la imagen para entrar al post y no solo sea en el titulo. Gracias Mi Blog http://noesfake.com

Responder

Por favor, trata de tener habilitado tu perfil (has click en "Comenta con el antiguo editor" para iniciar sesión) o deja un enlace a tu blog escogiendo la opción "Nombre/URL", procura no dejar comentarios Anónimos.
Nota: Si es que se presenta algún problema con el formulario de comentarios, sólo has click en "Comenta con el antiguo editor"

Gracias por participar en el blog.

inicio