Para todos los usuarios que cuenten con un blog en Blogger este sencillo truco seguramente les gustara mucho, este truco se trata de cómo agregar el gadget de entradas populares de Blogger con un toque de elegancia en su interfaz, por lo general el que viene por defecto en Blogger se ve demasiado sencillo y simple, con el pequeño código que vamos a agregar más adelante se verá llamativo por su forma y sus colores, de esta manera vamos a destacar estas entradas populares del blog de manera llamativa y por ende recibir más visitas en estos artículos.
Para agregar este código NO tendremos que expandir artilugios, solo debemos ir a Plantilla > Edicion HTML, allí buscamos el siguiente código ]]></b:skin> (recuerda que puedes hacerlo fácilmente presionando CTRL + F) luego justo arriba de ese código pegamos el siguiente:
* Gadget Post Populares
----------------------------------------------- */
#PopularPosts1 ul{margin:0;padding:5px 0;list-style-type:none}
#PopularPosts1 ul li{position:relative;margin:5px 0;border:0;padding:10px}
#PopularPosts1 ul li:first-child{background:#ff4c54;width:90%}
#PopularPosts1 ul li:first-child:after{content:"1"}
#PopularPosts1 ul li:first-child + li{background:#e69138;width:85%}
#PopularPosts1 ul li:first-child + li:after{content:"2"}
#PopularPosts1 ul li:first-child + li + li{background:#f1c232;width:80%}
#PopularPosts1 ul li:first-child + li + li:after{content:"3"}
#PopularPosts1 ul li:first-child + li + li + li{background:#93c47d;width:75%}
#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"}
#PopularPosts1 ul li:first-child + li + li + li + li{background:#9fc5e8;width:70%}
#PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"}
#PopularPosts1 ul li:first-child:after,#PopularPosts1 ul li:first-child + li:after,#PopularPosts1 ul li:first-child + li + li:after,#PopularPosts1 ul li:first-child + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li:after{position:absolute;top:20px;right:-15px;border-radius:50%;background:#353535;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff}
#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:40px;height:40px}
#PopularPosts1 ul li a{font-size:12px;color:#444;text-decoration:none}
#PopularPosts1 ul li a:hover{color:#222;text-decoration:none}
}
El último paso es guardar los cambios y listo, recuerda que debes tener agregado el gadget de “entradas populares” en tu blog para poder visualizarlo, allí veras como resaltan las entradas más visitadas o las entradas populares del blog.
Fuente + Info | Dominio Blogger
