Páginas

24/11/2013

Cabeçalho em toda a largura do blog


 Yoo
 eeeeeeeeee sexy Laddie  
Ei gente! Trouce um tutorial super fácil e muito útil para seu blog! Então esse tutorial e de como por o cabeçalho em toda a largura do blog ele ficara assim.

Clique em "Read More" é continue lendo!

É bem simples de fazer e existem duas formas, uma com HTML e outra sem! Go!

Obviamente você vai precisar de uma imagem (cabeçalho) pra colocar no background. Recomendo a largura1365px  mas pode ser maior.  Quanto a altura, 400px tá de bom tamanho.

Você também vai precisar de um cabeçalho transparente, pra que? Porque sem nada no cabeçalho, as postagens e a sidebar vão para cima e vão tapar seu background, então já faça uma imagem transparente de altura um pouquinho maior que o back e coloque no lugar do cabeçalho normal (no gadget do cabeçalho na guia design)

forma: Pelo designer do modelo

Essa é a maneira que eu mais recomendo, pois é bem mais prático e fácil do que da outra forma que vou ensinar, mas tem um porém: Só da pra fazer upload de imagens com até 300KB, no meu caso não deu, pois a minha imagem é bem maior. Então se sua imagem  tem mais que 300KB tente a outra forma porque essa não dá :(

Após ter feito a imagem vá até: Design >> Designer do Modelo >> Plano de fundo e faça o upload da imagem, deixe na opção "não dividir em blocos" ou "dividir horizontalmente", as duas são boas! 


Para deixar o fundo cinza no resto do blog  vá em Design >> Designer do Modelo >> Avançado >> Planos de fundo e na caixinha "Plano de fundo externo" coloque a cor que desejar.

forma: Pelo HTML

1°) Vá em modelo > Editar HTML.
2°) Aperte Ctrl+F e procure por body { Você irá encontrar um código assim:


body {
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
}

3°) Substitua o código acima por esse:

body, html {
height: 400px;
margin: 0;
padding: 0; }

body {
background: url("URL do cabeçalho") repeat; }

html {
background: #cor; }

Substitua onde esta escrito "URL do cabeçalho" pela url da imagem e onde está #cor coloque o código da cor que desejar. escolha a cor que você quer Aqui Lembre-se de mudar a altura (400px) para a altura do seu cabeçalho/back!

Não se esqueça de comentar! 
Beijos!

Um comentário:

Cupcakes leiam as regras antesde comentar!

1-não xingar o blog! ou coisa do tipo!
2-afiliação aqui!
3-Não brigue com ninguém.
4-não aceitamos tags.
5- deixe o link do seu blog para eu poder retribuir !
Obrigado por ler as regras siga-as PF