<b:widget id='Label1' locked='false' title='Etiquetas' type='Label'/>
En este ejemplo el id del gadget es Label1 y corresponde a las etiquetas del blog.
Ya teniendo el id del widget, pega antes de ]]></b:skin> lo siguiente:
#Label1 h2 {
background: url(URL de la imagen) left top;
color: #fff000;
}
background: url(URL de la imagen) left top;
color: #fff000;
}
Y así sucesivamente para todos los gadgets a los que quieras ponerle la imagen de fondo, sólo debes cambiar la URL de la imagen y en color cambiar el color del texto del título.
Si lo prefieres también puedes cambiar todo el título por una imagen, sólo que en su lugar pegamos antes de ]]></b:skin> esto:
#Label1 h2 {
background: url(URL de la imagen) no-repeat top;
height: 30px;
}
background: url(URL de la imagen) no-repeat top;
height: 30px;
}
De igual forma hay que cambiar la URL de la imagen, y en heigth poner el alto de la imágen.
Ahora vamos a Diseño y damos click en Editar en el gadget al que le cambiamos el fondo y borramos el título del gadget, en su lugar escribe esto:
De esta forma el título del gadget no se encimará con la imagen de fondo.
Con estos sencillos trucos podrás tener una plantilla cada vez más personalizada, ya sólo es cuestión de que agregues las imágenes que se adapten al diseño de tu plantilla.
No hay comentarios:
Publicar un comentario