En esta oportunidad te traere un super truco como darle diseño unico y exclusivo a las entradas populares del blog de blogger. Podras ver a continuacion un preview animado de este widget de esquinas redondas en las entradas populares.Este tiene un estilo limpio y estilizado y cambiara la forma en que luce tu blog, usando codigo de Css3 para que descargue la pagina mas rapidamente. Este tambien incluye el efecto Hover. Añadamos ahora este unico widget de entradas populares a tu blog de blogger.
Pasos Para Añadir el Widget de entradas populares con esquinas redondas en tu Blog.
1. Entra en tu cuenta de blogger.2. Entra en tu Plantilla >> Edit HTML
3. Ahora presiona CTRL + F dentro del editor y busca esta etiqueta ]]></b:skin>
4. Copia y pega el codigo de abajo arriba de la etiqueta ]]></b:skin>
/* El Codigo de CSS para el menu comienza aqui ciudadblogger.info */
.popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #FFF url() no-repeat scroll 5px 10px;
list-style-type: none;padding:5px 5px 5px 20px !important;
border: 1px solid #ddd;border-radius:30px;
-moz-border-radius:30px;
-webkit-border-radius:30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
height: 40px;
-moz-box-shadow: 3px 2px 5px #242424;
-webkit-box-shadow: 3px 2px 5px #242424;
box-shadow: 3px 2px 5px #242424;margin-bottom: 5px;height: 40px;
}
.popular-posts ul li a {
font-style: italic;
}
.popular-posts ul li:hover {
border:1px solid #d10202;
-moz-box-shadow: 3px 2px 5px #d10202;
-webkit-box-shadow: 3px 2px 5px #d10202;
box-shadow: 3px 2px 5px #d10202;
}
.popular-posts ul
li a:hover {
text-decoration:none;
}
.popular-posts .item-thumbnail img {
height:40px;width:40px;
webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}
.popular-posts .item-thumbnail img:hover{
-moz-box-shadow: 0px 0px 5px #d10202;
-webkit-box-shadow: 0px 0px 5px #d10202;
box-shadow: 0px 0px 5px #d10202;}
5. Entre en blogger y de click Diseño>> Añadir un Gadget y selecciona "Entradas Populares"
7. Luego necesitas Configurar las Entradas Populares.
(Si has añadido las entradas populares ya en tu blog solo reconfiguralas como muestra imagen aqui abajo)
Este es un Widget diseñado para entrada populare sin descripcion Entonces no marques la casilla de Fragmento como muestro arriba en la imagen.Cambia las otras opciones a tu gusto.
8. Luego Guarda "Entradas Populares"
do esta listo...
8. Luego Guarda "Entradas Populares"
do esta listo...
0 comentarios:
Publicar un comentario