Oi gente, hoje vou ensinar pra vocês como fazer o cabeçalho ocupar toda a largura do blog, não vou dizer que é simples, mas também não é tão dificil... bem, existem duas maneiras de ajustar o cabeçalho com todo o blog, sem um plano de fundo e com um plano de fundo eu usei a primeira porque não tive muita paciência, e ainda sim o meu cabeçalho não ficou beem do jeito que eu queria mas deu pro gasto rs, vamos lá...
Opção 1. sem o plano de fundo:
Primeiramente tem que ter o seu cabeçalho pronto e um cabeçalho transparente, sem brush, sem nada. depois vá em modelo > Layout > cabeçalho (onde tem o nome do seu blog) > editar e carregue a imagem transparente.
Depois vá em modelo > personalizar > plano de fundo > e carregue o seu cabeçalho (normal, com brush etc) Não esqueça de marcar a opção "NÃO DIVIDIR EM BLOCOS" quando a sua imagem carregar.
ATENÇÃO: seu cabeçalho não pode ter mais que 300 kb, se tiver vai aparecer uma mensagem dizendo que o arquivo é muito grande, por isso quando você estiver fazendo o seu cabeçalho preste atenção no tamanho da foto das ilustraçoes se voce for usar é claro, escolha imagens com poucos kb! e sempre redimensione o seu cabeçalho! no meu eu usei 1444 de largura! mas isso depende do seu layout, você vai ter que procurar uma largura que ajuste perfeitamente com o resto do blog, ( foi nessa parte que me faltou a paciência heuheu )
Opção 2. com um plano de fundo:
Vá em modelo > Editar HTML clique dentro da caixa do html primeiro agora aperte Ctrl+f e vai abrir uma caixinha de pesquisa em cima, na caixinha cole o seguinte codigo > font: $(body.font); ou esse > body {
pronto depois de ter pesquisado você vai encontrar o codigo abaixo >
body {
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
}
Apague o codigo acima e substitua por este:
body, html {
height: 400px;
margin: 0;
padding: 0; }
body {
background: url("URL do cabeçalho") no-repeat; }
html {
background: url("URL do background") repeat; }
Onde está escrito "URL do cabeçalho" troque por a url (endereço) do seu cabeçalho, que tem que está hospedado na internet.
Onde está escrito "URL do background" troque por a url do background que você vai usar!
Então é isso galera espero que tenham gostado do tutorial, beijos :3
O meu não deu
ResponderExcluirIzabelly você tem que ir redimensionando a imagem no photoscape de preferencia, e vai salvando no html, até ficar do tamanho certo, e altura você ajusta aonde tem height: 400px; de acordo com a sua imagem de cabeçalho, porque não tem como eu falar uma largura e altura certa pro se cabeçalho, pois todos os layouts tem larguras e alturas diferentes qualquer coisa me chama no fb que eu te explico melhor :3 https://www.facebook.com/dara.naoki
ExcluirEste comentário foi removido pelo autor.
ResponderExcluirHello, jovem!
ResponderExcluirDeixando meu agradecimento... sério mesmo: seu tuto super me ajudou. ^_^
bjux
~ Illana Beatriz ♡
http://goingto25.blogspot.com.br/
vlw Beatriz, fico feliz por ter ajudado, bjs *-*
Excluirtem certeza q isso funciona? Aqui no meu monitor o seu cabecalho vai ate a metade soh...
ResponderExcluirmetade eh exagero, mas seu cabecalho nao ocupa a pagina toda na minha tela.
Excluirfunciona sim! é porque tem que ficar ajustando a largura e altura e vendo como ta ficando até achar uma largura certa que fique na mesma largura do blog, e isso dá muito trabalho, ae eu deixe assim msm kkk, mas daqui uns dias vou mudar meu layout msm *-*
ExcluirMe ajudou muito adorei, e conssegui, so que a imagem do cabeçalho nao ficou no meio, mas amei
ResponderExcluirque bom Isabella, *-* continuem acompanhando o blog, que vai ter varios tutos legais para vcs *-*
ExcluirSó tem um problema, como faz imagem transparente? Eu não sei.
ResponderExcluirbasta procurar no google: fundo transparente
Excluir