Personalizar la cabecera en las Vistas Din?micas de Blogger

Es cierto que las nuevas plantillas de Vistas Din?micas de Blogger han gustado a la mayor?a por los efectos que tienen para mostrar las entradas y la forma como se navega en ellas. Pero tambi�n es cierto que a muchos ha desilusionado el no poder personalizarlas como quisieran.

Por suerte no todo est? perdido, pues aunque no podemos agregar gadgets en ella, s? podemos modificar ciertas ?reas para que tu blog no sea vea igual al de todos. As? pues veremos c?mo ir transformando las partes que se puedan; y empezaremos con esta entrada con la que conseguiremos personalizar la cabecera del blog en las plantillas de Vistas Din?micas.

La cabecera es basicamente lo que define la imagen de todo blog pues ah? se encuentra nuestro logotipo, as? que pasaremos de esto:

A esto: [Ver blog de pruebas]

Lo ?nico que necesitamos es la imagen de nuestra cabecera y nada m?s. Si a?n no tienes una aqu? hay 50 cabeceras de d?nde escoger.
Si usas la nueva interfaz de Blogger entra en Plantilla | Personalizar | Avanzado.
Si usas la vieja interfaz de Blogger entra en Dise?o | Dise?ador de plantillas | Avanzado.

Ahora ah?, donde dice A?adir CSS agrega esto:

.header-bar {
background-color:#738a94 !important; /* Color de fondo */
background-image:url(URL de la imagen) !important; /* Imagen de fondo */
background-repeat:no-repeat; /* Si quieres que la imagen se repita c?mbialo por repeat */
height:149px !important; /* Altura de la cabecera */
border-bottom:25px solid #3b464b; /* Borde inferior */
}
#header .header-bar .title h1, #header .header-bar .title h3 {display:none;}
#header a:hover {text-decoration:none !important;}
#main {margin-top:115px !important;} /* Distancia entre la cabecera y el contenido */

Cambia la URL de la imagen donde se indica y personaliza lo dem?s que se indica en color verde.

Algunas propiedades tendr?s que descubrirlas por ti mismo pues aqu? no hay valores espec?ficos ya que depende de cada caso. Por ejemplo, la altura debe ser aproximadamente 20px menos que la altura de la imagen, pero si la imagen es un pattern peque?o entonces la altura la puedes establecer a la medida que quieras.

Yo le he puesto un borde inferior, pero puedes quitarlo, hacerlo m?s delgado, o m?s grueso, eso ya es cuesti?n de gustos.

Como hemos establecido una altura para la cabecera y le hemos puesto (o no) un borde, entonces es muy probable que las entradas y el peque?o men? se hayan tapado, as? que para que eso no suceda hemos establecido un margen en #main, ah? el valor tambi�n tendr?s que irlo descubriendo, s?lo es cuesti?n de probar varios valores hasta que quede tal como te gusta.

?Sencillo? S?, mucho, pero lo mejor de todo es que con este peque?o cambio el blog comenzar? a verse con identidad propia. Y despu�s... bueno, ya veremos despu�s qu� se nos ocurre para irle dando forma a nuestro blog.