O motivo do sumiço + Cabeçalho em toda a largura do blog

27 de jun de 2012

Acho que vocês sabem, to na 8ª série do fundamental e tá sendo tudo muito corrido. Desde o ano passado faço dois cursos de computação (web designer e operador de computador) e semana passada comecei um curso preparatório para as provas de seleção, como to saindo do fundamental tenho que garantir minha vaga em uma escola de ensino médio, e pra isso tenho que fazer umas provas ~tensas~ Esse cursinho é dois dias por semana, ou seja: tenho 2 cursos na terça (preparatório+webdesigner) um na quarta (operador de pc) e um na quinta (preparatório), então só tenho a segunda e a sexta livres (fora o tempo que tenho antes e depois dos cursos) e ainda tenho que conciliar o blog com trabalhos escolares.  Espero que entendam que tá difícil atualizar o blog e que provavelmente ele vai continuar assim meio parado, infelizmente, mas fazer o que né?
Muita gente pediu para eu ensinar como fiz o cabeçalho ocupando toda a largura do blog, e hoje vou revelar o segredo. Na verdade não é um cabeçalho e sim um background (HÁ! por essa você não esperava!) 

Há uns tempos atrás eu visitei o Madtown e vi que o cabeçalho ocupava toda a largura, achei lindo e só depois raciocinei que era um background. Me inspirei na ideia e coloquei aqui no blog também! :3 Tava só esperando a Laís postar o tuto primeiro (já que foi ela que inventou seria injusto eu postar antes né?).


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

Materiais
Obviamente você vai precisar de uma imagem (cabeçalho) pra colocar no background. Recomendo a largura 1365px (é a que eu uso) mas pode ser maior. Aqui no meu note dá direitinho! 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)

1ª 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 -como aqui no GI- vá em Design >> Designer do Modelo >> Avançado >> Planos de fundo e na caixinha "Plano de fundo externo" coloque a cor que desejar.

2ª 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. Lembre-se de mudar a altura (400px) para a altura do seu cabeçalho/back!

É isso, desculpem-me por ter escrito tanto e ter dito quase nada, isso é fato nos meus posts né? haha

168 comentários:

  1. aiiiii querida obrigadaa! Estava louca por esse tutorial bjs flor!

    ResponderExcluir
  2. Cara que demais, amei o tutorial *--*
    http://themudancas.tk/

    ResponderExcluir
  3. Sério, você explica muito melhor que eu, haha *-*
    Eu sou um desastre, não sirvo pra ser professora, mas ainda vou aprender. E a ideia que você teve de colocar o background por html, foi ótima, eu não tinha pensado nisso.

    me-and-myfriends.blogspot.com

    ResponderExcluir
    Respostas
    1. Capaz linda, eu me enrolei toda pra explicar haha
      Pois é, tive que improvisar! Tinha tentado pelo designer do modelo mas quem diz que deu? Meu header ficou maior que 300KB, tentei reduzir mas perdeu a qualidade. Ainda acho a outra forma melhor, mas não deu, fazer o que né? haha

      Excluir
    2. Não tá dando certo, já fiz todo o processo e mesmo assim a imagem não aparece
      fanaticreading.blogspot.com

      Excluir
  4. Gosteei muito, nem imaginava que era um background :)

    detalhesdaamooda.blogspot.com.br/

    Beijos, beijos ;*

    ResponderExcluir
    Respostas
    1. como vc fez o nome detalhes da moda aparecer sem que as postagens atrapalhassem?

      Excluir
  5. voltou o/

    - nossa agora tá tudo explicadinho, acho que vou usar essa ideia no meu próximo lay - com os devidos créditos claro! = D

    http://japenseidemais.blogspot.com.br/

    ResponderExcluir
  6. EU ESTAVA IGUAL UMA MALUCA PROCURANDOOOOOOOOOOOOOOOOO AAAAAAAAAAAAAAH!
    MUITO OBRIGADA!
    www.queridaprincessa.blogspot.com

    ResponderExcluir
  7. Meu Deus, estava louca atrás desse tutorial! Muuito obrigada Anny!!!!
    happy-charllote.tk

    ResponderExcluir
  8. Eu estava procurando isto há um tempo,mais não sabia que era um background.Eu entendi tudinho só não aquela parte de "Você vai precisar de um cabeçalho transparente,um pouco maior que o back"
    você quer dizer uma imagem sem nada? ~péssima pra entender~Poderia me explicar?
    Beijos!Maitê
    pinkcatsflashpug.blogspot.com

    ResponderExcluir
    Respostas
    1. Também achei que essa parte ficou mal explicada, vou tentar editar o post e melhorar aquilo ali haha

      Mas então, é um cabeçalho sem nada mesmo, você vai lá no seu programa de edição e cria uma imagem transparente com a altura uns 50px maior que o background (se fizer o back com 400 faz o cabeçalho transparente com 450px por exemplo) aí você coloca essa imagem no gadget do cabeçalho (design>elementos da página>cabeçalho) Espero que tenha dado pra entender agora haha

      Excluir
    2. Agora entendi melhor sim,rs
      Obrigado,você é um amor *-*
      Beijos!

      Excluir
    3. Num tinha entendido essa parte também, ainda bem que resolvi ler os comentarios antes de comentar...

      Amei o tutorial e vou tentar por no meu primeiro lay que estou fazendo...

      Excluir
  9. Seu blog é tão lindo, tão fofo, to amand.
    blogueirajussara.blogspot.com

    ResponderExcluir
  10. To sem criatividade pra fazer esse cabeçalho,ta meio complicada pra mim,você ensina muito bem :) !Amei o layout!
    Beeijos :*

    #rawr-Dreams Of Imagine

    ResponderExcluir
  11. Adooorei , mas acabei de mudar meu cabeçalho !
    www.paradateen1.blogspot.com
    beijos !

    ResponderExcluir
  12. Adorei o tutorial, o cabeçalho fica bem bonito assim.
    http://i-teenbr.net.tc

    ResponderExcluir
  13. Eu desconfiava que aquilo por trás era um cabeçalho Anny. Você fez parecido no layout lá do WC. Vou ver se uso ele novamente. Estou testando aqui *o*

    http://www.world-cutest.blogspot.com.br/

    ResponderExcluir
  14. Adorei o tutorial!!
    Veja a entrevista exclusiva com a Paula Fernandes: http://fanforfan.blogspot.com.br/2012/06/entrevista-com-paula-fernandes.html Beijos...

    ResponderExcluir
  15. I ♥ o tutorial, ain curso de Web Designer eu quero tanto. É flor, os estudos em primeiro lugar! Boa sorte, viu. *-*

    http://cappuccinoeaconta.blogspot.com.br/

    ResponderExcluir
  16. OLA ! como vai???
    Estou aqui só para dizer que adorei o post e estou lhe seguindo okay?
    Se quizer dar uma passadinha no meu ou qualquer coiisinha é só da uma passada la no : Confissões de uma Adolescente!!
    Linck:
    http://confissoesda-adolescente.blogspot.com.br/
    Vlw pela disposiçao!!

    ResponderExcluir
  17. Oi, amei o tutorial, sempre quis aprender, era uma coisa que sempre me deixava louca não saber. kk'
    Vou usar do meu próximo lay, com certeza. Bjos!
    garotaretro.blogspot.com

    ResponderExcluir
  18. Oi, estava mesmo procurando esse tuto,tudo o que eu procuro eu acho aqui kk,muito obrigada,vou fazer no meu depois eu falo como ficou tá?
    queria colocar também um rodapé da largura do blog como eu faço?
    bjs.

    ResponderExcluir
  19. Anny não acredita ! eu consegui fazer e deu um resultado bem bom confere lá .Smaks Carlétchus do WE MOUSTACHE .
    http://we-moustache.blogspot.com.br/

    ResponderExcluir
  20. Mas se eu quizer colocar link no cabeçalho.. assim como está o teu... como faço? Por favor meu ajude! ahhhh, e amei o blog *-* já ta nos meus favoritos

    ResponderExcluir
  21. Este comentário foi removido pelo autor.

    ResponderExcluir
  22. Seu blog é muito lindo *U* e este tutorial me ajudou bastante Obrigada *-*
    http://kawaistation.blogspot.com.br

    ResponderExcluir
  23. Addddddddddorei!
    Acabei de usar, já tava procurando isso ao maior tempão. Nunca tinha me tocado que na verdade é um background uahuah. O ruim é que varia da resolução de cada computador, né? Aqui, por exemplo, é 1600 e não 1024 :/
    Beijo!
    Just Debee

    ResponderExcluir
  24. LoL
    Ótimo post e tuto..
    deu certinho, nem sabia que era background kkk

    ResponderExcluir
  25. Sério que só o meu não deu certo???

    ResponderExcluir
  26. Oii linda, experimentei mas não deu certo. Você pode me explicar qual é o formato da imagem transparente? Pode ser feita pelo photoshop?
    Kisses...
    http://oblogdablogueira.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Marii, Chegaste a saber como fazer? Tou com o mesmo problema... :(

      Excluir
  27. oi adorei seu blog, é de mais, qualquer coisinha.....that-dream-officer.blogspot.com.br já estou lhe seguindo

    ResponderExcluir
  28. Oi Anny, adorei o post, adorei o novo layout (e Tô seguindo o blog desde o início do ano), todos os dias eu olho o GoImagines, pq é meu blog favorito e o primeiro que visitei e curti *-*, continue assim e você consiguirar conquistar mais e mais leitores :D Visita, eu exclui o bandana colorida D:

    http:/odiariodesamy.blogspot.com

    ResponderExcluir
  29. Fiz como estava, so que ele não funcionou. Gostei muito do seu blog ! Ele muito lindo!
    Seguindo :)
    http://blogger-boysattitudes.blogspot.com.br/

    ResponderExcluir
  30. Owwwn ameiii e muito rs ta elaborando um novo código pro Perfeitinha e to doida pra usar o cabeçalho assim, espero que dê certo rs, e amei gente aqui ta cada vez mais lindo, boa sorte no sorteio flor <3

    www.perfeitinhablog.com

    ResponderExcluir
  31. Anny meu amor, sempre me salvando, eu já tinha tentado de tudo menos isso, kkk. Vou usar no meu lay, com certeza.

    ResponderExcluir
  32. Anny o meu rolando com a página: me ajuda?

    ResponderExcluir
    Respostas
    1. É só desmarcar o "rolando com a página" lá no designer do modelo (:

      Excluir
  33. Oi Anny ♥ Queria Mto Saber Como Voce fez ESsa parte que esta escrito ''go Imagine '' Ficou Mto Lindo !! http://BlogStefaniPink.blogspot.com.br

    ResponderExcluir
    Respostas
    1. O cabeçalho? rs Não entendi flor :(

      Excluir
  34. Adoreiii mais vc usa que modelo básico do Blogger para fazer isso ??

    coffemilia.blogspot.com

    ResponderExcluir
    Respostas
    1. Uso o travel/viagem azul, que tem as bordinhas em cima!

      Excluir
  35. oii, amei o blog!!! Eu queria saber qual programa você usou para fazer se back!!!! Aguardo resposta!!

    ResponderExcluir
  36. Amo seu blog, não tem como não gostar.
    To sempre visitando e adorei esse tutorial :)

    semuser.blogspot.com

    ResponderExcluir
  37. ooi, eu amo seu blog, ele é prefeeito! eu queria que voce me ajudasse a ffazer um cabeçalho, eu estou começando a ter um blog e nao si fazer naadaa!! quero suaa ajudA!Beeijos
    Saah

    ResponderExcluir
  38. Como você colocou um cabeçalho com menu dentro em toda largura do blog?

    ResponderExcluir
    Respostas
    1. O menu é o menu normal do blogger, só personalizei e puxei ele mais pra cima (pra ficar por cima do cabeçalho) em breve ensino como fiz o menu!

      Excluir
  39. Ameiii Seu Blog os Tutoriais são Super Legais e Você ensina Muito Bem Beijos Flor
    Timestylist.blogspot.com

    ResponderExcluir
  40. Anny procurei muito este tutorial que funcionasse e vou dizer não achei um que desse serto somente o seu funcionou vc disse que foi ideia de outra colega sua mas que teve a otima ideia de postar tambem bom não importa muito obrigado pelo tutorial me serviu muito abraço!
    PS: Alexandre

    ResponderExcluir
  41. OOOOOOOOOOOOi, como eu faço na parte da imagem transparente? :X
    help!
    beijos

    ResponderExcluir
    Respostas
    1. Você vai no photofiltre/photoshop e vai no menu arquivo e clica em novo, ai faça uma imagem transparente e salve. Depois coloque essa imagem no cabeçalho.

      Na verdade ela serve só pra fazer com que apareça o cabeçalho que está como background, se n tivesse essa imagem transparente os posts iam subir e tapar o bg/cabeçalho :p -

      Excluir
  42. Fiquei com uma dúvida: consegui aplicar o cabeçalho transparente, mas quando vou colocar o cabeçalho que fiz no photoshop seguindo as medidas que vc indicou, o programa não aceita. Quais os passos para inserir o meu cabeçalho? Agradeço a sua atenção. O seu BLOG é muuuuuito bom. Beijo

    ResponderExcluir
    Respostas
    1. O photoshop não aceitou ou quando foi colocar o background no designer do modelo disse que é muito grande? Se for tente pelo html, como expliquei no tuto! Beeijos querida :*

      Excluir
  43. Oiii!! Deixa eu te perguntar, fiz tudo certinho, só que eu queria colocar um background no lugar da cor, tem como?? Desde já, agradeço, bjoss.

    http://agarotadocachecolrosa.blogspot.com.br/

    ResponderExcluir
  44. Queria saber ... onde você acha essas imagens , é algum site ?
    preciso muito saber ... adorei seu blog , beijos ;*

    ResponderExcluir
  45. O tutorial é maravilhoso!
    Entendo como é,os estudos tomam bastante nosso tempo!
    Te achei parecida com a Kristen na foto/avatar dos comentários!
    O blog é ótimo,sempre visito!


    Beijinhos
    www.flightsanddreams.com

    ResponderExcluir
  46. Olá Alana!

    Conheci o blog a pouco tempo e adorei! Parabéns!
    Segui esse tutorial pra criar um blog para um jornal laboratório de uma matéria da faculdade,e ficou muito bonito! Mas tenho um problema... segui as proporções que vc indicou, e no pc da faculdade ficou bacana, mas como o monitor do meu laptop é maior, o cabeçalho ficou pequeno... Tem algum jeito de mexer nas configurações do Blogger para que o plano de fundo se ajuste ao pc de quem vai acessar?

    Bjos, Natália Fuly.
    (http://jl7ccaa.blogspot.com.br/)

    ResponderExcluir
    Respostas
    1. Você pode fazer aquele cabeçalho de modo que quando se coloque o mesmo lado a lado ele se encaixe (?) ai onde vc colocou o cabeçalho transparente você coloca um outro cabeçalho, com fundo transparente mas com o nome do blog. Assim o fundo vai ficar se repetindo caso a tela do pc do leitor seja maior. Então você coloca em vez de "não dividir em bloco" coloca dividir horizontalmente.

      Desculpa a confusão na explicação, não sei se vai dar pra entender bem *-* Eu estou tendo o mesmo problema que você, mas ainda não encontrei outra forma de fazer o fundo se ajustar a resolução :(

      Excluir
    2. Eu tive o mesmo problema. No meu computador, o cabeçalho ficou mais que perfeito. Daí um leitor do Rio de Janeiro, me enviou no email,a foto de como meu cabeçalho aparecia no computador dele, que tinha uma resolução maior. Na imagem eu vi que os desenhos que componham meu cabeçalho se repetiam. Ficaram horríveis.

      Então eu fiz o seguinte:
      Pra aplicar o tutorial da Any, a gente usa o "plano de fundo" e a ferramenta "cabeçalho". Pois bem, meu banner tem um elefante e o título do blog. O elefante estava se repetindo.
      Então eu criei um banner somente com a cor de fundo (que no meu caso é branca), do tamanho 1066 por 600. Esse banner eu coloquei como "plano de fundo" e segui os procedimentos que a Any ensinou.
      Feito isso eu fui no PhotoStudio e peguei o meu banner original (com desenhos) e apliquei um fundo transparente. Esse banner eu coloquei na ferramenta "cabeçalho" do blogger.

      Assim, o banner todo branco pode repetir, pois como não tem imagem, não aparece a repetição.
      As imagens foram colocadas em outro banner, do mesmo tamanho, mas com fundo transparente.
      Deu certíssimo!

      Excluir
  47. Anny, o meu não deu certo! *o*
    Eu fiz como vc falou, mais quando fui visualizar o back não pegou, e o fundo ficou branco (sendo q eu botei o codigo certinho da cor q eu queria). eu upei o bacl pelo tinypic, e testei todos os codigos la, mas não deu :(
    Queria saber onde vc upou o back, e qual codigo vc pega, me ajuda please!

    ResponderExcluir
    Respostas
    1. Eu upo minhas imagens todas em um blog de testes, sempre deu certo, além de ser prático de upar :) Tenta!

      Excluir
  48. Amei o tutorial mais flor como eu faço para inserir pngs dai já que o fundo vai estar sem nada, e como você colocou essa ''ondinha'' desculpa sou muito burrinha em explicações alheia, aguardando sua resposta flor, beijos

    ResponderExcluir
    Respostas
    1. Os png's vão ficar no background, a imagem transparente é só pra ocupar espaço e impedir que a área da postagem suba "tapando" o bakground. Fiz a linha curva com a ferramente "caneta", fiz no inkscape mas você pdoe fazer em outros programas que trabalhem com vetores (como o corel!)

      Excluir
  49. Anny, amei o tuto. Eu só não entendi oo por que dá imagem transparente como assim ? Explica.
    http://independetgirl.blogspot.com.br/

    ResponderExcluir
  50. Que pena fiz no meu e n]ao deu certo,não ocupa o espaço inteiro.

    Beijos e aguardo resposta.

    ResponderExcluir
    Respostas
    1. Depende da resolução do seu monitor. O meu é 1024, se o seu for maior faça do tamanho da resolução da sua tela. Mas acho que 1024 é o mais usado hoje :)

      Excluir
  51. Anny, como faz no modo HTML para o cabeçario não ficar repitido? Tem que apagar alguma parte do código?

    ResponderExcluir
    Respostas
    1. Adiciona isso no code: background-repeat: none;

      Excluir
    2. Comigo foi a mesma coisa, onde coloco esse código? Porque onde coloquei ficou tudo branco :)

      Excluir
  52. Ah... é só mudar a cor, ops hihi :)
    Anny quando eu substitui o código por esse novo e fui visualizar havia dado um erro apenas na area de postagem, dai eu tentei colocar o código que eu havia apagado acima do novo e deu certo.
    Acho que em vez de substituir é preciso por abaixo do código... Não sei se é só com o meu blog que ocorre isso, será que vc pode conferir?

    Bjs!

    ResponderExcluir
    Respostas
    1. No meu eu fiz do jeito que ensinei e como você pode ver, deu certo hehe :)
      Acho que foi só no seu mesmo :p

      Excluir
    2. No meu deu o mesmo problema e não to conseguindo ajeitar me ajuda?

      Excluir
  53. Ahh deu certo, que lindo *--*
    Só que depois de body { eu tive que acrescentar font: $(body.font);
    color: $(body.text.color); porque senão desconfigurava a fonte e a cor da fonte da postagem, mas ficou muito bom o tutorial :)

    ResponderExcluir
  54. Anny meu background de fundo fica branco, como faço pra trocar?

    ResponderExcluir
  55. Fiz isso no meu tumblr de HTML e estava me perguntando como se faz no blogger também, ajudou muito, obrigada!

    Bejos,
    garota-unbroken.blogspot.com

    ResponderExcluir
  56. Gostei muito, só que da próxima vez não esquece de colocar os créditos da foto da Melina De souza lá em cima ; )
    O blog dela: melinasouza.com

    ResponderExcluir
  57. Como faz uma imagem transparente ??

    ResponderExcluir
    Respostas
    1. No photofiltre, clica em criar novo, ai põe as medidas que vc precisa e marca a opição fundo transparente. Deixa a imagem assim e salva.

      Excluir
  58. Me ajuda, o meu ficou no blog todo. Oq faço??

    ResponderExcluir
    Respostas
    1. abaixo do link da imagem coloca o código: background-repeat: no-repeat;

      Excluir
  59. Anny, peguei a imagem de 1024x400 certinho, e o fundo transparente também. Só que na hora de colocar, o cabeçalho ficou só em uma ponta, ou vários cabeçalhos iguais, ele não ficou posicionado certinho, me ajuda por favor D:

    ResponderExcluir
    Respostas
    1. Tenta fazer com 1365 de largura :)

      Excluir
  60. Eu amei o tutorial e apliquei no meu blog, obrigada, serio, muito bom seu tutorial flr.

    Bjoos!

    ResponderExcluir
  61. Perfeito,eu testei e da certinho,como vc falou.O legal é da pra você criar toda a parte de cima,demais.

    ResponderExcluir
  62. Anny, comigo não deu certo, a imagem fica repitida uma encima da outra! E agora?!

    ResponderExcluir
  63. Não consigo de jeito nenhum :/ tem algum modelo específico pra dar certo?

    ResponderExcluir
  64. Adorei o tutorial! Tô usando no meu blog e já postei nele tbm. Dei os créditos lógico.
    Beijinhos

    ResponderExcluir
  65. Po meu eu fis tudo direitinho e quando eu vi não tava na largura do blog!!!!!!E aconteceu um negocio horrivel e estranho!!!>:(
    aviso:eu vis direitinho!!
    Beijos!!!

    ResponderExcluir
  66. http://joycinhalioness.blogspot.com.br/

    ResponderExcluir
  67. Onde vc achou essa imagem com essa quantidade de largura e altura?

    ResponderExcluir
    Respostas
    1. Verdade. Gostaria tbm de saber isso. Tô apanhando pra achar hm.

      Excluir
  68. E como eu consigo essa imagem transparente? Eu ja tentei aprender a fazer mas eu não sei fazer :c

    ResponderExcluir
  69. Ooi Anny, to vendo q nesse novo lay você deixou o cabeçalho do mesmo jeito, mas em vez de ser uma cor no fundo é esse back... Pode me explicar como vc colocou? e eu n entendi a última parte.
    imaginedragoes.blogspot.com bjs

    ResponderExcluir
  70. É por isso que eu adoro esse blog!

    ResponderExcluir
  71. Só da pra achar body { ? Não consigo achar de jeito nenhum :s tem outro código que eu possa procurar?

    ResponderExcluir
  72. Nossa... Tu salvou minha vida... tu é um anjo.. vlw

    ResponderExcluir
  73. Eu queria saber como que você fez esse sistema de comentários tipo Perguntas e respostas.

    ResponderExcluir
  74. Mto brigadinhuu não tava conseguindo fazer esse tutorial em blog nenhum...Thanks

    ResponderExcluir
  75. Ola,

    Gostaria de uma ajuda sua, se puder é claro.
    Eu tenho um blog com um template padrão gostaria de deixa o menu ocupando todo o espaço da tela.

    Grato

    ResponderExcluir
  76. comigo nenhum dos dois funcionou :(

    ResponderExcluir
  77. Oi Anny,

    Muito obrigada por compartilhar isso conosco. Estava há muito tempo procurando por esse tutorial. Enfim achei aqui no seu blog. Tinha tentado outros, mas nenhum deu certo. Até mesmo este seu eu já tinha tentado, mas acho que estava fazendo alguma coisa errada. Continuei procurando, procurando, e nada. Até que voltei para cá, por ser o tuto mais compreensível e... DEU CERTO! :D Fez uma diferença enooorme no meu blog.

    Thank you very much! Beijos querida :**

    ResponderExcluir
  78. olá bem eu acho que fiz alguma coisa de errado pq no meu HTML o codigo que aparece é esse :

    body {
    min-width: $(content.width);
    }

    .content-outer, .content-fauxcolumn-outer, .region-inner {
    min-width: $(content.width);
    max-width: $(content.width);
    _width: $(content.width);

    tem como me responder pq isso acontece pf OuO

    ResponderExcluir
  79. Adorei o blog, sucesso sempre :)

    ResponderExcluir
  80. Obrigada *--* Fiz meu primeiro layout e simplesmente ficou perfeito ... Amei (:


    Cinderela Sqñ (perfil)

    ResponderExcluir
  81. *00000000000000000000000000*
    Muito obrigada e, céus que blog perfeito :x
    #Morri

    ResponderExcluir
  82. Muuuuuuuuuuuuuuuuuuuuuuuuuito obrigada! procurei tanto isso ´O`

    ResponderExcluir
  83. oi , eu nao consegui fazer , sou nova no assunto , queria ajuda

    ResponderExcluir
  84. Onde vc conseguiu esse plano de fundo?

    ResponderExcluir
  85. Obrigado flor, me ajudou muito. Beijo.

    ResponderExcluir
  86. Olá, eu tento colocar mais da que a imagem é grande de mais '-'

    ResponderExcluir
  87. Oiii Linda , será que vc poderia me passar o nome desta boneca? Adorei seu blog.

    ResponderExcluir
  88. O Post me ajudou muito , era tudo que precisava :)

    ResponderExcluir
  89. O meu HTML tem isso body expr:class='"loading" + data:blog.mobileClass'> poderia me ajudar? por favor

    ResponderExcluir
  90. Amei e coloquei em prática no meu blog, Obrigada pelas dicas elas ajudam muita gente que esta começandoagora... ;)

    http://lucienydias.blogspot.com.br/

    ResponderExcluir
  91. não entendi essa parte de códigos de cor.Pode me ajudar?

    ResponderExcluir
  92. Será que você pode dar um link de uma imagem transparente.Como você falou?!

    ResponderExcluir
  93. Adorei seu post..
    Visitem meu Blog http://closetarrumadooo.blogspot.com.br/

    ResponderExcluir
  94. Obrigada seu tuto me salvou !

    ResponderExcluir
  95. Obg, ajudou d+ :3,
    Visitem se possivel : http://confde2adolescentes.blogspot.com.br/#

    ResponderExcluir
  96. Eu coloquei a imagem nessa resolução que você falou (altura e largura), mas parece que ultrapassa o tamanho, porque fica aquela barrinha de rolagem pro lado e o menu do topo desconfigura ):. alguma dica?

    ResponderExcluir
  97. não deu certo, pode me ajudar? meu blog é o oceansweetescape.com.br, ele ta em fase de construção :)

    ResponderExcluir
  98. Eu procurei Body { no 'Editar HTML' E não achei nada :///

    ResponderExcluir
  99. Estou fazendo o meu blog e não consigo deixar o cabeçalho transparente, já fiz tudo certinho e mesmo assim ele continua cobrindo o background, o que pode estar acontecendo? Pode me ajudar, por favor? Já tentei por html e as imagens ficam se repetindo, não sei o que fazer, preciso de ajuda.

    ResponderExcluir
  100. Obrigada flor, me ajudou bastante :)
    Blog : http://lookdobem.blogspot.com.br/

    ResponderExcluir
  101. AAAAAAAAAAAAAH. Já tentei de tudo e no final, o resultado é meu back repetido na tela inteira D:

    ResponderExcluir
    Respostas
    1. Só é vc colocar na opção 'não repartir em bloco" algo assim ta embaixo de onde coloca a foto

      Excluir
  102. Amei o post... Ficou bem explicado e consegui fazer, obrigada!

    ResponderExcluir
  103. Eu n consegui fazer :/
    Ficou uma coisa por cima da outra :/
    coloquei como consegui :D
    Mas adorei ;)

    ResponderExcluir
  104. Caraca tu é muito inteligente rs' ... esse tutorial foi minha salvação.. ^^
    http://maluquicesquetenho.blogspot.com.br/

    ResponderExcluir
  105. Olá, adorei a dica, porém acho que fui a única que não acertou fazer. Coloquei uma imagem transparente no cabeçalho, mas ela ficou em cima do back. Aaaaai. Me ajuda???

    ResponderExcluir
    Respostas
    1. O meu também ficou assim,já achou a solução? me ajuda? obg

      Excluir
  106. Oi será que tem como mudar o background de cada marcador do blog?

    ResponderExcluir
  107. uhu!! finalmente consegui ,otimo tutorial ;) bjs

    ResponderExcluir
  108. Como eu posso saber quantos KB tem a minha imagem?

    ResponderExcluir
  109. aqui não deu exatamente certo mais ajudou, vlws!

    ResponderExcluir
  110. Brigada mesmo, você me ajudou muito com este tutorial, eu também amei seu blog♥
    http://blogdateda.blogspot.com.br/

    ResponderExcluir
  111. eu tenho uma duvida,e se eu mudar o meu fundo do blog pelo HTML,e se for por esse mesmo código body { , se eu apagar, o background vai sair,como eu faco?

    ResponderExcluir
  112. vc mesmo que personalisou seu blog?

    ResponderExcluir
  113. Como eu faço para fazer upload da imagem??? Sou mio lerda pra essas coisas rsrs

    ResponderExcluir
  114. Muito obrigada pelo tutorial, de coração <3

    ResponderExcluir
  115. Olá Alana, eu fiz tudo certinho, coloquei a imagem transparente só que ficou escuro na frente no lugar do baner... como tiro?
    http://simplessassimcomlarisseoliveira.blogspot.com.br/

    ResponderExcluir
  116. Oi,eu ainda não consegui fazer o seguinte (pelo primeiro ex.) : Eu fiz um cabeçalho com o tamanho que você disse (e já tentei outros tamanhos) e fiz o transparente menor,mas ainda não consegui tirar as postagens e a sidebar de cima do backgroud. Poderia fazer um vídeo explicando como se faz? ou explicar melhor? preciso muito,beijos!

    ResponderExcluir
  117. Como faz uma imagem transparentee

    ResponderExcluir
  118. Olá Alana, seu blog é ótimo com seu tutoriais, mas eu fui tentar fazer essa parte do cabeçalho e não quer ir sera que pode me ajudar?

    ResponderExcluir
  119. me ajuda o meu plano de fundo no personalizar nao tem como mudar me ajuda pfpf

    ResponderExcluir
  120. Eu ameii! Mas eu gostaria de saber como vc colocar o Menu no seu cabeçalho?? OBS: Estou seguindo o seu blog, por que ameii.
    http://chiclete-funny.blogspot.com.br/

    ResponderExcluir
  121. 1 ano e só agora consegui fazer isso no meu blog! Hahaha tá tão lindinho, nem acredito <3
    Pra quem quiser fazer do primeiro jeito e não estiver conseguindo porque a imagem é maior que 300KB, salva a imagem em PNG e reduz o peso dela com esse site https://tinypng.com/
    Não altera a qualidade nem o tamanho, apenas o peso...

    Obrigada!!
    http://www.blogdabrub.com/

    ResponderExcluir
  122. eu não achei o body com aquelas coisas escritas na minha HTML '-'

    ResponderExcluir
  123. Eis a questao! que modelo vc usou? simples?

    ResponderExcluir
  124. Olá! Eu fiz tudo certinho mas o o cabeçalho tá aparecendo atrás da parte de postagens, Como faço para corrigir isso? Beijo!

    ResponderExcluir
  125. Adorei a postagem eu tentei fazer dos dois jeitos, mas não chegou no que eu queria mas acho que é pq a minha imagem do cabeçalho q ta estranha não sei acho que é o tamanho, mas adorei vc explica bem detalhdo ..
    bjs

    http://baguncapersonalizada.blogspot.com.br/

    ResponderExcluir
  126. Oi,onde você achou esse fundo?

    ResponderExcluir
  127. Oie Alana, seus tutoriais são perfeitos porem eu estou com uma dificuldade imensa para fazer o cabeçalho do meu blog, a imagem só aparece um pouquinho, ela não aparece do jeito que é para aparecer, será que poderia me ajudar? Agradeço desde já.

    ResponderExcluir

- Comentários do tipo "seguindo, segue de volta" "lindo o blog, seguindo, retribui?" Serão ignorados se não tiverem uma opinião sobre o post em si.
- Não aceitamos mais selinhos e tags, sorry!
- Leia a página "FAQ" e outras páginas internas antes de perguntar qualquer coisa.
- Sua opinião é sempre bem vinda. Mas seja educado!

© Go Imagine - 2014. Todos os direitos reservados.