Poner una imagen en la cabecera del blog

Cada vez hay más cosas para ir añadiendo a nuestro blog y personalizarlo a nuestro gusto y mejorarlo. Esta vez voy a dejar aqui como personalizar la cabecera poniendo una imagen.

Lo primero que tenemos que hacer es elegir la imagen que queremos poner, y adecuarla al tamaño que queremos que ocupe según el ancho de la cabecera, etc...

Luego vamos a Diseño-cabecera-editar

Se abrirá una ventana desde que la que tendremos que subir la imagen, bien desde nuestro ordenador o bien poniendo la URL de la misma. Es importante marcar el REDUCIR HASTA AJUSTAR para que la imagen quede perfecta.

Ahora dale a GUARDAR.

El siguiente paso es ajustar la imagen. Para ello nos vamos a Diseño de plantilla-avanzado-agregar CSS

Y añade esto: #header-inner img {margin: 0 auto;} en el cuadro blanco que te saldrá a la derecha. Y por último pincha en APLICAR AL BLOG

Y ya está, ahora tu imagen estará perfectamente colocada. Puedes cambiar el tamaño haciéndola más pequeña o más grande para que ocupe lo que tú quieras.poniendo en lugar del código anterior este: #header-inner img {width: 960px; height: 220px;}. 

Los números azules son los pixeles que quieres que mida la imagen: ancho 960 y alto 220. Tú pon los que tú quieras. Luego sólo tienes que dar a APLICAR AL BLOG.

En el caso de que quieras que la imagen no ocupe todo el espacio sustituyendo al título y la descripción, sino que vaya detrás de ellos, tienes que marcar esa opción.  

Marca también REDUCIR HASTA AJUSTAR y guarda los cambios.

Puede que quieras mover un poco el título y la descripción. Sólo tienes que ir  a Plantilla-personalizar-avanzado-agregar CSS y añadir este código en el cuadro: 

.header h1{margin: 10px 0 0 40px; }.header .description {margin:-20px 0 0 0;}

Ahora solo tienes que poner las medidas para que quede como tú quieres. El código se lee así:

.header h1{margin: 10px 0 0 40px; } Es el margen del título donde 10px es ariiba, 0 a la derecha, 0 abajo y 40px a la izquierda. 

.header .description {margin:-20px 0 0 0;}Este es el margen para la descripción y la lectura es como la del título.