Añadir una imagen al título del Blog

Te puede apetecer añadir una imagen en la cabecera del Blog (donde el Título) y dar un aire más 'personal' a tu Blog.
Para hacer esto no hay más que ir a Diseño-caja de 'Título'-Editar, y ahí, añadir la imagen y, normalmente, marcar lo de que se coloque 'detrás del título y la descripción'.
Pero hay que tener en cuenta una cosa muy importante...
Y es que la imagen se añade a la caja, y 'condiciona' el texto del título. Lo cual quiere decir que si la imagen tiene poco ancho (width), el título se va a amoldar a ese ancho... y te puede quedar hecho un asco.
Primero, configuro la imagen dejando un gran margen en blanco a la derecha (si quiero que el Título del Blog quede a la derecha de la imagen), y hago el fondo transparente. Cuando hablaba de crear tus propios botones comenté cómo se hacía esto.
Y esa es la imagen que añado al blog.

Y segundo, hay una cuestión que resolver: por defecto, el Título, que se alinea a la izquierda, se sobrepone a la imagen... y a lo mejor eso no queda del todo bien.
Tiene fácil solución: solo hay que desplazar el Título, poniéndole un margen adecuado.
Para eso solo hay que ir a la Plantilla del Blog, y entrando en Personalizar-Avanzado-Agregar CSS poner algo como esto:

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

que quiere decir que el header h1 (que es el que define el título) tiene que tener un margen de 10 pixeles arriba, 0 pixeles a la derecha, 0 pixeles abajo, y 100 pixeles a la izquierda (cuando pones los cuatro valores, su orden va como las agujas del reloj).
Al final te puede quedar una cosa así:


NOTA: el margen que tengas que poner a la izquierda (la última cifra) tendrás que definirlo para cada caso, aunque es fácil de fijarlo, en la vista donde insertas el código puedes ir viendo cómo te va quedando según los valores que metas.
Y lo de header-description (el subtítulo), lo pones también a tu gusto (el -10 que ves en el ejemplo se pone para acercar más el subtítulo al título)

Y puedes incluso, manipular la sección donde está la imagen, por ejemplo, poner borde alrededor de ella, con:

#header-inner{
border: 2px solid #000;
}

pero esto ya, no merece mucho la pena.