En esta ocasión hablare de los títulos de los gadgets. En el momento de personalizar mi primera plantilla fue un sufrimiento poder modificar todo lo que quería pero una de las cosas que mas dolores de cabeza me dio fue los títulos de los gadgets. Luego de leer, destruir plantillas y sufrir enfermedades depresivas llegue a un CSS que permite dar el estilo que uno quiere. En este caso el código que les dejare modificara todo el titulo, aunque ustedes elegirán que quieren y que no, las posibilidades son infinitas y les aseguro 100% que pueden adaptar los títulos de los gadgets a su plantilla como deseen. Les dejo el código separado entre columnas de izquierda y derecha por si quieren hacerlas con estilos diferentes y paso a explicarles que es cada cosa para que la puedan adaptar a su gusto.
Deben copiar lo siguiente y pegarlo antes de
]]></b:skin>
Para los gadget de la columna izquierda:
.column-left-inner h2 {
padding: 5px 0 5px 0px; /* distancia arriba, distancia derecha, distancia abajo, distancia izquierda */
color: #FFF; /* Color del título */
background: #2CE623; /* Color del Fondo */
text-align: center; /* Título en el centro */
font-weight: bold; /* Título en negrilla */
font-family: Verdana; /* Tipo de fuente */
font-size: 12px; /* Tamaño de la fuente */
-moz-border-radius: 10px 10px 0px 0px; /*Bordes redondeados para Firefox*/
-webkit-border-radius: 10px 10px 0px 0px; /*Bordes redondeados para Safari y Chrome*/
border-radius: 10px 10px 0px 0px; /*Bordes redondeados para Opera */
}
.column-right-inner h2 {
padding: 5px 0 5px 0px; /* distancia arriba, distancia derecha, distancia abajo, distancia izquierda */
color: #FFF; /* Color del título */
background: #E6AC23; /* Color del Fondo */
text-align: center; /* Título en el centro */
font-weight: bold; /* Título en negrilla */
font-family: Verdana; /* Tipo de fuente */
font-size: 12px; /* Tamaño de la fuente */
-moz-border-radius: 10px 10px 0px 0px; /*Bordes redondeados para Firefox*/
-webkit-border-radius: 10px 10px 0px 0px; /*Bordes redondeados para Safari y Chrome*/
border-radius: 10px 10px 0px 0px; /*Bordes redondeados para Opera */
}
Como siempre este humilde novato espera ayudarles en esta gran vocación de ser un blogger de alma y corazón.
Gracias por pasar!
bien (Y) me gusto...
ResponderEliminar