MODIFICAR FONDO TITULO GADGET

A raiz del post EXPANDIR GADGET preguntaba misaani como podía cambiar el fondo del título de un gadget. Modificar el aspecto de todos los títulos y fondos es algo común pero en este caso en concreto vamos a ver como podemos modificar uno por uno, así teniendo más flexibilidad a la hora de personalizar y poder mostrar diferentes estilos en las distintas partes de la sidebar.

Los títulos en los elementos de mi sidebar se muestran de la siguiente forma:

En primer lugar tendremos que crear una imágen del mismo ancho y largo de nuestros títulos, por ejemplo:

Una vez tengamos la imágen que pasará a ser la nueva apariencia del título de nuestro gadget tendremos que seguir los siguientes pasos:

Primer paso:(Ubicar código)

Iremos a la parte de código de nuestra plantilla y realizaremos una búsqueda por el nombre del gadget que figura en nuestro panel de administrador, en este caso ARCHIVO.

Encontraremos una línea como la siguiente:

<b:widget id='BlogArchive2' locked='false' title='ARCHIVO' type='BlogArchive'/>


Nos fijaremos en la parte que se encuentra señalada en negrita, después de id, que será el identificador de nuestro gadget.

Segundo paso:(Añadir estilo)

En la parte de código de nuestra plantilla buscaremos ]]></b:skin>, será justamente encima donde tendremos que pegar una línea de código con la siguiente estructura.

#BlogArchive2 h2 {
background: url(URL IMAGEN FONDO) left top;
}



Tendréis que tener en cuenta que lo señalado en negrita será vuestro identificador, que tendrá que ser igual que en el primero paso y lo señalado en color azul será la imágen que creásteis anteriormente, podéis hacer uso de un servidor para alojar vuestra imagen como pueda ser este. Podéis hacer una vista previa antes de guardar los cambios para observar el resultado. En el caso de que el fondo sea de un solo color o tenga algún motivo no tendréis problema, en el caso de que el fondo refleje el título que es ese nuestro caso tendréis que jugar un poco con el título del gadget de forma que quede visualmente agradable sin eliminar completamente el título del gadget. Yo por ejemplo le añadí un punto :). El resultado sería algo como lo siguiente.

Tener un poco de paciencia y ir jugando un poco hasta que quede bonito, lo más seguro es que no os salga a la primera pero bueno ir probando que seguro que conseguiréis cosas muy chulas!. El procedimiento es simple pero si tenéis alguna duda no dudéis en preguntar.