La facilidad de realizar diferentes trucos para Blogger es una forma de darle un diseño único a nuestro blog y presentar a los usuarios que visitan nuestro blog un nuevo diseño web profesional.
La presentación de nuestro blog perfectamente al público es la llave para el éxito. Un nuevo código CSS realizara todo el cambio necesario para darle un nuevo estilo a nuestras Entradas Populares, lo que vamos hacer es insertar un estilo CSS en el Editor HTML de nuestra plantilla y nos dará como resultado un estilo de números en las Entradas Populares
Un clic en “Diseño”
Habilita el gadget de “Entradas populares” si no sabes cómo sigue las siguientes instrucciones
Abre un gadget “Añadir un gadget”
Busca el gadget que tiene como “Entradas populares”
Ábrelo y habilita lo tal como lo muestro en la imagen. Tendrá que configurar sus parámetros, como se muestra en la siguiente imagen: desmarque la opción "imagen en miniatura" y también "fragmento" Es mejor que se muestra en la mayoría de los puestos de 7 a 8. Menos es bueno y limpio.
Luego damos un clic en “Guardar” y lo ubicamos en el sidebar
Segundo Paso
Vamos a dirigirnos al Editor HTML de nuestra plantilla para insertar el código CSS que realizara todo el cambio
Un clic en “Plantilla”
Un clic en “Editar HTML”
Ahora se te abrirá el editor HTML de tu plantilla, se mostrara igual como la imagen que esta a continuación
En este punto deberás presionar la tecla “Control” de tu teclado seguido de la tecla “F” para que aparezca el buscador integrado en la parte superior derecha de tu editor, debes esperar unos segundos hasta que se muestre, aquí es donde tendrás que insertar el código para buscarlo e insertar los códigos correspondientes en el editor, a continuación mire la imagen la cual te mostrara tal y cual deberá aparecerte el buscador en tu editor HTML de tu plantilla y así puedas colocar el código en el buscador al momento que yo diga busca este código.
Busca este código
</b:skin>
Una vez que hayas encontrado el código, tendrás que insertar el siguiente código justo arriba del código que encontraste
/*--- Start --- */
.popular-posts ul {
padding-left: 0px;
counter-reset: popcount;
}
.popular-posts ul li:before {
list-style-type: none;
margin-right: 15px;
padding: 0.3em 0.6em;
counter-increment: popcount;
content: counter(popcount);
font-size: 16px;
background: #292D30;
color: #ffffff;
position: relative;
font-weight: bold;
font-family: georgia;
float: left;
border: 2px solid #dddddd;
box-shadow: 1px 2px 9px #666666; }
.popular-posts ul li {
border-bottom: 1px dashed #dddddd;
}
.popular-posts ul li:hover {
border-bottom: 1px dashed #696969;
}
.popular-posts ul li a {
text-decoration:none; color:#5A5F63;
}
.popular-posts ul li a:hover {
text-decoration:none;
}
.popular-posts ul {
padding-left: 0px;
counter-reset: popcount;
}
.popular-posts ul li:before {
list-style-type: none;
margin-right: 15px;
padding: 0.3em 0.6em;
counter-increment: popcount;
content: counter(popcount);
font-size: 16px;
background: #292D30;
color: #ffffff;
position: relative;
font-weight: bold;
font-family: georgia;
float: left;
border: 2px solid #dddddd;
box-shadow: 1px 2px 9px #666666; }
.popular-posts ul li {
border-bottom: 1px dashed #dddddd;
}
.popular-posts ul li:hover {
border-bottom: 1px dashed #696969;
}
.popular-posts ul li a {
text-decoration:none; color:#5A5F63;
}
.popular-posts ul li a:hover {
text-decoration:none;
}
Luego de insertar el código procedemos a dar un clic en “Guardar plantilla”
Data de la Publicación; 04-09-2019
Fuente; ayudadeblogger
Publicado por;
0 comentarios: