29 ene. 2015

[Tutorial] Cambiar color de fondo de un gadget [100% MÍO]

Hooola! Hoy os enseñare a cambiar el color de fondo de un gadget (además también pondré la manera de cambiar el color del borde y texto de ese mismo gadget). Bueno, os traigo un ejemplo:
Ahora os dire como hacer eso en vuestro blog (con otros colores y tal)!

1. Primero vamos a Plantilla > Editar HTML y buscamos el código del gadget en cuestión: lo encontraras buscando el título que le hayas puesto al gadget! (Ctrl + F) Por ejemplo, si quiero quitar el fondo del gadget "Afilados" pues lo buscare en el HTML, encontrando algo similar a esto:
<b:widget id='HTML1' locked='false' title=‘Afilados’ type='HTML'>
Afilados: Este es el titulo que le he puesto al gadget al que quiero reducir el margen que nos pone Blogger.
HTML1: Nombre que le ha puesto el HTML al gadget.

2. Una vez que tenemos el nombre del gadget del HTML (HTML1) vamos a Plantilla > Editar HTML  > Buscamos ]]></b:skin> y encima pegamos este código:
#HTML1{
background: #fff ;
}
3. Si elegimos un color muy distinto al que tenemos y tenemos problemas con el color de la letra o con el color del borde del gadget, podemos ampliar el código para resolver esos problemas...
#HTML1{
background: #fff ; /*Color de fondo*/
border:2px solid #ccc; /*Tamaño del borde (2px), estilo de la línea (solid), color del borde (#ccc)*/
font:30px Tutan #ccc; /*Tamaño letra (30px), estilo letra (Tutan) y color (#ccc)*/
}

4. Por último, comprobamos que todo esta correcto mirando en el Vista Previa, y guardamos!

Byee! Cualquier duda comenten~

No hay comentarios:

Publicar un comentario