Cabeçalho ocupando toda a largura do blog

fevereiro 12, 2015


Trago esse tutorial de como fazer para o cabeçalho ocupar toda a largura do blog. Tem duas formas de faze-lo e vou ensinar os dois modos.
1° Modo: Faça uma imagem em .png ( Transparente) do mesmo tamanho que da imagem do cabeçalho que você vai usar cabeçalho.

1. Vá no painel do seu Blog em Layout > Cabeçalho > Editar. E carregue a imagem TRANSPARENTE e salve. 

2. Vá em Modelo > Personalizar > Plano de Fundo e carregue a sua imagem de cabeçalho como se fosse o plano de fundo do blog. Quando ela carregar, coloque para Não dividir em blocos, e selecione a opção Rolar com a página. E  salve! Se o seu blog ficar sem nenhuma cor, ainda no designer do modelo, clique em Avançado > Página e lá vai ter FonteCor do plano de fundo e Cor do texto.

A Cor do plano de fundo, escolha a cor que você quer que seu blog fique, e salve.Se tiver dúvidas de como o seu blog vai ficar, veja o meu blog. Eu usei essa técnica nele.

2° Modo: Vá em do seu Blog depois em Modelo > Editar Html . Procure por font: $(body.font); . Você encontrará o código abaixo:
body {
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
}
Substitua todo o código acima por esse abaixo:
body, html {height: 400px;
margin: 0;padding: 0; }body {
background: url("URL do cabeçalho") no-repeat; }
html {
background: url("URL do background") repeat; }
Na primeira parte, a que está escrito:
body {background: url("URL do cabeçalho") repeat; }Substitua o trecho URL do cabeçalho pela URL da sua imagem de cabeçalho.E na segunda parte em que está escrito:html {background: url("URL do background") repeat; }
Substitua o trecho URL do background pela url da imagem que você quer colocar no título.
Para que a imagem não se repita coloque no - antes de repeat: no-repeat.
Você pode fazer a mesma coisa na imagem do cabeçalho, o que não é recomendavel.

You Might Also Like

1 comentários

  1. Olá, Gostei de sua Dica, porem fiz tudo direitinho mais não funcionou, alguma coisa impede, e não sei o que é?
    Da uma olhadinha no meu blog. www.adalgisoalvesfotos.blogspot.com

    ResponderExcluir

Like us on Facebook

Pinterest