Si quereis darle un toque diferente a vuestra sidebar (columnas laterales del blog junto al área de entradas) y que tengan una imágen de fondo con la que darle un toque de distinción.....este es vuestro post.
1º Vamos a nuestra querida plantilla html del blog, quicir, las entrañas del mismo (donde hace tiempo no os mandaba ir, por cierto) y buscar una parte del código que pone lo siguiente:
| .sidebar .widget{ margin:0 0 0.7em; padding:4px; } |
2º Eliminamos esa parte y en su lugar, colocamos este código:
| .sidebar .widget{ background: url(URL_DE_LA_IMAGEN); margin:0 0 0.7em; padding:4px; } |
Donde pone "URL DE LA IMAGEN" debemos de escribir la dirección web en la que tenemos guardada esa imagen de fondo que queremos colocar (recordar que podeis subirla a Megaupload, Photobucket....)
3º Guardamos los cambios y ya está.
Como siempre os recordaré.....antes de hacer nada en la Plantilla, guardad una copia de seguridad, no me echeis a mi la bronca luego si os habeis cargado el blog.
En el caso de que no querais que sea la misma imágen para todos los elementos, sino que cada elemento lleve una imagen distinta, debeis hacer lo siguiente:
1º Buscamos en el código de la plantilla algo como lo siguiente:
| <b:widget id='HTML10' locked='false' title='TITULO DEL ELEMENTO DE PÁGINA' type='HTML'/> |
Esta parte es la de los "Widgets" y encontrareis varias lineas como esta con un número HTML diferente y, evidentemente, un título de elemento diferente.
2º Ahora os anotais en un papelito cada id, es decir lo que pone HTML y un número y su correspondiente título del widget.
3º Pues ahora buscamos la parte del código de Plantilla correspondiente al CSS y antes de la línea ]]></b:skin> tenemos que escribir lo siguiente con todos los html que hemos copiado antes en una hoja:
| #HTML10{ background: url(DIRECCION_DE_LA_IMAGEN); } |
4º Guardamos los cambios y listo, Calisto!
No hay comentarios:
Publicar un comentario