esejoker468
1
Pi
Marketing
Verificación en dos pasos activada
Verificado por Binance
Suscripción a IA
Que onda Forobetanos!!
Aquí una ves mas, con mis tutoriales para Blogger 😛8:
Nuestro amigo [MENTION=59]SoloNegocios[/MENTION] compartió este Tutorial: http://forobeta.com/tutoriales-de-wordpress/71571-mas-comentado-tipo-engadget.html
pero es para Wordpress, hoy les enseñare, hacer eso mismo, pero para Post mas Visitados en Blogger.
Lo mejor es que es con puro CSS, y muy sencillo de hacer.
Este sera el resultado:
De lujo que no? 🙂
PASO 1: Ve a Blogger, y entra al blog donde quieres darle este estilo a tus post mas visitados.
Paso 2: Ve a Plantilla > Edicion de HTML
Paso 3: Busca el siguiente codigo:
Y por encima de el, coloca el siguiente código:
Después guarda los cambios!
Por ultimo, ve a Diseño > Añadir un Gadget. Y ahora, agreguen el Gadget llamado "Entradas populares". y coloquenlo donde quieran 🙂
eso es todo!, lo que hace ese código, es darle estilo al Gadget de "Entradas populares".
espero y utilicen este tutorial, para dar estilo a su Gadget!
Un "me agrada" no te cuesta nada 🙂 (hasta rimo xD)
Aquí una ves mas, con mis tutoriales para Blogger 😛8:
Nuestro amigo [MENTION=59]SoloNegocios[/MENTION] compartió este Tutorial: http://forobeta.com/tutoriales-de-wordpress/71571-mas-comentado-tipo-engadget.html
pero es para Wordpress, hoy les enseñare, hacer eso mismo, pero para Post mas Visitados en Blogger.
Lo mejor es que es con puro CSS, y muy sencillo de hacer.
Este sera el resultado:
De lujo que no? 🙂
PASO 1: Ve a Blogger, y entra al blog donde quieres darle este estilo a tus post mas visitados.
Paso 2: Ve a Plantilla > Edicion de HTML
Paso 3: Busca el siguiente codigo:
Inserir CODE, HTML ou PHP:
]]></b:skin>Y por encima de el, coloca el siguiente código:
Inserir CODE, HTML ou PHP:
* 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}
}Después guarda los cambios!
Por ultimo, ve a Diseño > Añadir un Gadget. Y ahora, agreguen el Gadget llamado "Entradas populares". y coloquenlo donde quieran 🙂
eso es todo!, lo que hace ese código, es darle estilo al Gadget de "Entradas populares".
espero y utilicen este tutorial, para dar estilo a su Gadget!
Un "me agrada" no te cuesta nada 🙂 (hasta rimo xD)
