Tutorial {Personaliza el estilo de tu gadget!}

Hola! era hora de que publicase un tutorial... Pero hay buenas noticias!!! YA ESTOY EN VACACIOONEES!! Admito que estaba esperando muchiisimo que llegaran estas vacaciones, jeje. También pase a 1er año (noooooooooo!) pero bueno, así es la vida, y deseen me suerte por favor! Ok, vamos con el tuto:

• En todo este tutorial vas a necesitar poner los códigos que te gustarían poner en tu blog a lo largo del post, todos esos códigos tendrán que ser puestos antes de ]]></b:skin>

1. Vamos a Plantilla, luego a editar HTML
2. Buscamos <b:skin> y  le tienes que dar clic en los puntos suspensivos que se vera después y te saldrá un texto.
3. En el texto busca:

]]></b:skin>

Para cambiar de fondo al gadget, solo pon este código arriba de ]]></b:skin>:

.sidebar .widget {
background: #82ad99 ; /* COLOR DE FONDO */
}

Nota: la linea que dice  .main-inner .widget { nunca se cambia, solo lo que hay abajo de esa linea

Si quieres que sea una imagen de fondo y no un color, cambia el código por este:

.sidebar .widget {
background: url(aqui la url de la imagen);
}

Si solo quieres cambiarle los bordes, cambia el código por este:

.sidebar .widget {
border: 1px dashed #cccccc; /*Estilo, grosor y color del borde*/
}

Pero si quieres también los bordes redondeados, cambia ese código por este:

.sidebar .widget {
border: 1px dashed #cccccc; /*Estilo, grosor y color del borde*/
border-radius: 7px; /*Bordes redondeados*/
}

Y así seria el código con todo:

.sidebar .widget {
background: #82ad99 ; /* COLOR DE FONDO */
border: 1px dashed #cccccc; /*Estilo, grosor y color del borde*/
border-radius: 7px; /*Bordes redondeados*/
}

Espero les haya gustado este tutorial. Nos leemos ^^