Header ocupando toda a área do cabeçalho do blog

Para que seu cabeçalho seja todo ocupado por uma imagem ou mesmo uma cor de fundo como nesse modelo AQUI, vá até o HTML de seu blog e procure pelo seguinte trecho:

Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.

<div id='header-wrapper'>
      <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='AQUI DEVERÁ TER O NOME DE SEU BLOG' type='Header'/>
</b:section>
</div>


Copie-o e apague .

Agora procure pelo seguinte código:

</head>

Agora cole-o abaixo dele.


Procure então pelo seguite trecho:


#header-wrapper {AQUI TERÁ UM MONTE DE CÓDIGO NO MEIO}

O que você devará fazer com bastante atenção é apagar tudo que estiver dentro das chaves{} e substituir pelo código abaixo.
*Preste atenção pois a chave terá que abrir e fechar o código.





width:100%;background: #808080;margin:-24px 0 0 0; border-bottom: 15px solid #cccccc;

Portanto o código completo ficará assim:

#header-wrapper {width:100%;background: #808080;margin:-24px 0 0 0; border-bottom: 15px solid #cccccc;}

Código na cor azul representa a cor de fundo.
Código na cor amarela representa a cor do linha de baixo.

Elke, a d o r e i, mas vem cá, gostaria de colocar uma imagem...

Ah sim, então o código que você deverá colocar emtre  os colchetes será o código abaixo.

width:100%;background: url(AQUI O ENDEREÇO DE SUA IMAGEM) repeat;margin:-24px 0 0 0; border-bottom: 15px solid #cccccc;

Portanto o código completo ficará assim:

#header-wrapper {width:100%;background: url(AQUI O ENDEREÇO DE SUA IMAGEM) repeat; margin:-24px 0 0 0; border-bottom: 15px solid #cccccc;}