Como Personalizar seu Blogger - Blogspot: Imagem Personalizada no Header
Muita gente chega aqui procurando como personalizar seu blog no Blogger ou Blogspot. Uma excelente forma de personalização é colocar uma imagem no Header (Cabeçalho).
Isso pode ser feito através de dois métodos: um de nível super simples, e outro um pouco mais avançado.
Para isso, primeiro que nada, você precisa escolher a imagem. Procure alguma que seja de seu agrado, e combine com o estilo e o assunto do seu blog.
Dê uma olhada no seu HTML, e procure descobrir quais são as medidas do seu Header. Provavelmente os valores estão indicados no CSS com a etiqueta “header-wrapper”. Quanto mais ajustada sua imagem estiver à esses valores, melhor será o resultado.
Adicionar Imagem ao Header - Método Fácil - Imagem Não Clicável
- Vá até a tab “Elementos da Página”. No Cabeçalho, clique em “Editar”
- Clique em “Examinar”, para usar uma imagem que está guardada no seu computador; ou cole o endereço web da imagem no campo apropriado, se ela estiver na Internet. Dê uma olhada no preview que vai aparecer, e se estiver tudo certo, salve.
- Lembre-se de usar uma imagem retangular.
- Tenha em conta como vai aparecer a cor de seu título, sobre essa imagem de fundo. Você pode modificar a cor do título na tab “Fontes e Cores” -> Cor do cabeçalho da página.
- Se quiser que o título não apareça: após salvar, clique novamente em “Editar”. Agora você verá duas opções novas, bem abaixo:
Behind title and description” (Atrás do Título e descrição) e
“Instead of title and description” (Em vez do Título e descrição). Escolha a segunda opção, e o título desaparecerá.
A desvantagem desse método é que o Blogger pode cortar sua imagem para justá-la ao espaço disponível, e alterar a definição da imagem. Além disso, o título não será clicável. Se você deseja uma imagem clicável no Cabeçalho, deve…
Adicionar Imagem ao Header - Método Avançado - Imagem Clicável
O melhor neste caso é criar um banner - adicionar texto à imagem escolhida, usando algum programa de edição de imagens. Você pode colocar só o título do blog, ou colocar também um subtítulo ou tagline.
Depois de finalizar as edições, guarde a imagem em algum serviço de hospedagem de imagens - Flickr, ImageShack, GooglePages, a escolha é sua.
Imagem pronta? É hora de…
Permitir a Adição de Elementos ao Header - Cabeçalho
Conforme está explicado neste post: Como Personalizar seu Blogger - Blogspot: Título Clicável no Header.
Siga as instruções para permitir a adição de elementos ao Header, até onde diz “Agora você já pode…”. Quando chegar à esse ponto, volte aqui.
Adicionando seu Header Personalizado
- Vá até a tab “Elementos da Página”. Você verá que agora há a opção “Adicionar um Elemento de Página” no Header/Cabeçalho.
- Clique no link, e a janela dos elementos disponíveis se abrirá.
- Escolha a opção “HTML/JavaScript”
- Deixe o Título do elemento em branco.
- Na seção de conteúdo, cole o seguinte código, substituindo as partes em vermelho pelos valores apropriados:
<a href=”URL DO SEU BLOG” title=”TÍTULO DO SEU BLOG - Home”> <img alt=”TÍTULO DO SEU BLOG - Home” width=”LARGURA DA IMAGEM” src=”URL DA IMAGEM” height=”ALTURA DA IMAGEM“/></a>
- Salve as alterações.
- Clique no link “Editar” que aparece no elemento “Cabeçalho”, e depois clique em “Remover Elemento da Página”. Isso vai eliminar o Cabeçalho original. Não se preocupe; se você mudar de idéia, pode adicioná-lo novamente.
- Visualize o blog e certifique-se de que está tudo certinho.
Pronto, você já tem um Blogspot bem mais personalizado! 
Quer mais dicas de como personalizar seu Blogspot? Quer saber como ganhar dinheiro com seu blog?
Assine o Feed do Blogando por Dinheiro! E volte sempre.
________________________________
Compare Preços de: Artigos Personalizados, Coisas Personalizadas, Ferramentas, DVD, Filmes, Celulares, Notebooks, Câmeras, Jogos, Wii, PS3 no JáCotei
________________________________
Devo estar criando um blog para uma empresa cliente em breve e essa dica ajudará muito! Grato!!
Uma pergunta, vc sabe se depois há condições de transferir o conteúdo do blogspot facilmente (para outro domínio, blog do tipo wordpress)?
Danilo, pelo que eu sei, o WP tem uma ferramenta de importação que importa os posts e os comentários do Blogger, tanto velho como novo.
Quanto ao domínio, aconselho que você implemente ele desde já no Blogger, assim não perderá visitantes depois.
Olá!
Não sei o que estou fazendo de errado, porque, quando insiro o novo cabeçclho, conforme ensinado, fico com dois cabeçalhos no post. Não há nenhum elemento chamado “cabeçalho” para que possa deletá-lo como foi ensinado. O que devo fazer?
http://www.meupapagaio.blogspot.com
Respondi por email, porque acho que o que falta é um pedaço de código, e não dá pra postar códigos aqui.
Espero que ajude.
Inexistent Man: é, o hack exibe uma quantidade inexata e variável de post, por alguma razão que desconheço; quando e se eu descobrir porque, atualizo o post. Mas é legal mesmo assim, né não?
Manda sim, eu vivo coletando dicas para passar para os leitores. E as dicas sempre vão com crédito.
Claudio: Achei sua implementação uma boa idéia, meus parabéns!
Num sei oque eu estou fazendo de errado !!! fiz a imagem pra cobrir a largura da pagina inteira mas ela não centraliza , tentei center , e ela nem fica grudada com resto da página , ta no ar !!! e outra , oque aquele negocio verde ta fazendo lá atrás se eu exclui o cabeçalho antigo ??? me ajuda por favor. meu email hsombini@gmail.com , obrigado
Tentei entrar no seu blog, para ver como lhe ajudar, e o blog está fora do ar. Me avise quando ele estiver funcionando novamente, ok?
Oi,
Pode me ensinar como faço para que a imagem do header seja mais pequena na largura?
Pode ver meu blog em:
http://klubdojorge.blogsopt.com
Obrigado,
Download all, estava me acontecendo o mesmo a mim, a imagem fica encostada a esquerda e aparecia uma outra cor no lado direito.
Essa cor que aparece do lado direito é a cor que voce escolheu para a descrição do titulo. Tem que escolher a cor que usou no fundo da imagem para a descrição do titulo para ficar tudo da mesma cor.
Ajudei? Espero que sim …
Abraços,
Nospheratt, não sei o que acontece, não consigo incluir uma imagem no blog mesmo tendo feito tudo que está aqui nesse post, será que tem alguma coisa a ver com eu ter tirado a Navbar do blog?Se tiver algum código ou hack que possa me ajudar, me indica plz? abs
Olá, usei sua dica para mudar a header do blogger da maneira mais simples, sem mexer no código.
Consegui colocar a imagem, porém uma listra do cabeçalho anterior(do tamplate original do blog) continua visível por cima da foto.
Pq isso aconteceu? Como posso mudar?
Obrigada.
Jorge Monteiro: Desculpe, mas não entendo o que você quis dizer com “menor na largura”. O que posso te dizer é que para alterar as medidas do cabeçalho, você tem que editar as medidas do header-wrapper (O CSS que define as medidas da div do header). Espero ter ajudado.
Obrigada pela dica para o outro leitor, muito gentil de sua parte!
W2Pod: Procure no template o #header e o #header-wrapper. Você vai ver que ali estão as URLs para as duas imagens do cabeçalho. É só substituir elas com o que você queira.
ED: descubra o nome da imagem anterior e procure esse nome no seu template. Apague a URl da imagem. Isso deve resolver.
Olá.. Eu queria dividir o blog.
Tipo eu não consigo postar nada do lado direiro e nem do esquerdo.. Apenas no meio..
Gostaria também de fazer uma moldura legal.. igual o seu..
como posso fazer?
pode entrar em contato comigo?
daniel200392@hotmail.com
ou
http://www.danielll2.blogspot.com
abraços!
Já te enviei um email.
Olá!!
Estou tentando adicionar imagens… O caminho para estar certo, mas quando tento incluir qualquer imagem, aparece uma imagem com ponto de exclamação… Enfim, parece que não aceita a imagem…
O que pode estar acontecendo?
Me ajuda?!?
Valeu!!
Antes de mais nada parabéns por este site repleto de úteis informações.
Aproveitei para personalizar o cabeçalho com imagem a gosto. Pois bem, a princípio deu tudo certo, mas sobrou um resquício de rebarba no topo e no final da imagem. Onde devo configurar esta situação?
ANDERSON (www.semear10.blogspot.com)
muito boa essa dica… tava precisando dela a um tempo… pois não dava certo deu add a imagem pelo “cabeçalho”, ate add mas naum aparecia… jah por esse metodo html eh mais facil… fiz rapidow aki…
vlw mesmo…
http://zeteledownloads.web.pt/
Ana: É comum o Blogger “dar pau” com as imagens. Tente o outro método.
Anderson: Não entendi o que você quis dizer.
Zé: De nada.
Olá
Como eu posso aumentar o numero de visitas do meu blog, tem alguma dica ai se tiver me avisa, obrigado.
Nathan: Dê uma fuçada nos arquivos do blog, há muitos textos com dicas sobe como aumentar suas visitas.
Cara Nospheratt,
não consigo de jeito nenhum manter minha imagem no cabeçalho. Faço o upload (é um jpeg), ela carrega, aparece algumas vezes e depois some, ficando apenas om “x”. Já fiz várias tentativas, mudando o nome do arquico e nada. Já segui vários tutoriais, inclusive o seu e nada. O que posso fazer?
Obrigado e um abração
André: Esse é um problema comúm no Blogger, infelizmente.
Não sei porque acontece nem como solucionar, e nenhuma das pessoas que me disse ter esse problema, voltou depois pra me dizer que tinha conseguido resolver.
Lamento não poder lhe ajudar! Já pensou em tentar outro método?
queria saber como adcionar uma hiperligação de imagem! por favor ajude-me!!! obrigada
Dê uma olhada neste link, ou então procure aqui.
Espero que ajude.
[...] Buscas Que As Pessoas Fazem Para Chegar ao Blogando por Dinheiro Eu já ia esquecendo desta fonte de inspiração, e é importantíssima. O Sitemeter, que é o principal contador de vistas que uso, e algumas outras ferramentas como o Hittail - sobre as quais estou devendo post faz tempo :S - me oferecem idéias valiosíssimas sobre o quê as pessoas procuram quando chegam ao Blogando por Dinheiro.É extremamente positivo satisfazer essa procura, na medida do possível.Mas é preciso ter cuidado. Por muito que venham até aqui procurando certas coisas, eu não vou escrever sobre a Íris Stefanelli pelada na Playboy, a Marina Mantega na MTV, falando sobre sair pelada na Playboy, ou sobre a Paris Hilton na cadeia (vulgo xilindró) se perguntando se é uma boa idéia tirar umas fotos com os guardas, para sair pelada na Playboy. Pois o Blogando por Dinheiro não é lugar para escrever sobre a Siri, a Marina Mantega e a Paris Hilton nuas, peladas e sem roupa na Playboy! :PFalando sério, as buscas são uma ótima fonte de inspiração. Elas mostram como as pessoas vêem o blog, o quê elas gostariam de encontrar nele, qual é seu posicionamento nas buscas, e oferecem idéias sobre o quê escrever para melhorar ou fortalecer seu posicionamento.Exemplos: Como Monetizar Sites de Conteúdo Adulto? Como Personalizar seu Blogger - Blogspot: Imagem Personalizada no Header [...]
Amigo, eu tendei colocar a imagem no cabeçalho das duas formas e nao consegui. Na primeira a mais facil, ela nao aparece de forma alguma. tentei mudar meu template pq axei q seria este o problema, mais mesmo assim ela nao aparece. ja nao sei mais oq fazer!! rsss
Guif: Infelizmente o Blogger costuma dar problema com a imagem do cabeçalho em alguns blogs, e eu nem sei porquê.
No seu caso, o problema pode ser a imagem, já que adiocionando no template ela também não aparece. Já experimentou com outra imagem?
Há eu não sei nada… tudo o que queria era colocar meus áudios e meus vídeos pra mostrar pros meus amigos, mas to decepicionado comigo!!
ME ajuda por favorzinho!
Brenner
Como personalizo meu blogspot ? tipo no sentido de como colocar painel de visitas , musica , comentarios … etc .
Aguardo a sua resposta , obrigado pela atenção .
BRN .
Brenner e Bruno: Vocês precisam aprender a mexer com o blog. Tem muitas coisas aqui mesmo, na categoria Blogger Hacks.
Também recomendo o Templates para novo blogger e o Templates Blogger. Ambos estão cheios de boas dicas.
E aprender um pouco de CSS e HTML facilita tudo.
Não consegui adicionar de jeito nenhum a figura no cabeçalho.
Será pé frio?
Entra em contanto comigo por mail, por favor.
Obrigado =)
Paula, o código estava corrompido pela migração do Blogspot ao WP. Faça de novo que agora vai funcionar, já corrigi.
Desculpe os transtornos.
não estou conseguindo entrar na parte de alteração, faço o login e de lá só entro na tela de editar ou visualizar o perfil, como faço?
Uriel: Não faço idéia, em algum lugar tem que haver um link para a edição dos blogs - procure por “Painel” ou “Dashboard”.
Acabei de criar um blog e estou voando em muitas coisas como: postegm etc, pretendo publicar para download.
Vivian: Não entendi nada do que você disse, pode se explicar melhor? Publicar o que para download?
Espero que não esteja falando dos meus textos! :S
Olá!
A imagem do header só aparece no Mozilla. Já tentei de tudo, pesquisei no google o motivo do problema e nada. Por que isso? Se alguém puder me ajudar. A imagem do cabeçalho não aparece no Internet Explorer.
=(
Murilo: Não faço idéia de qual é o problema. Até dei uma olhada rápida no código, mas não achei nada. Talvez seja problema de CSS, talvez seja problema do Blogger. Se eu fosse você, deletaria a imagem e subiria ela de novo, para ver se dá o mesmo problema.
Sinto muito não ser de mais ajuda.
=/
Tudo bem! Obrigado mesmo assim.
Por nada, literalmente.
[...] das funcionalidades que foram extintas no Novo Blogger - como o Título/Imagem clicável no Header - são os “Posts Recentes” na [...]
QUERO UM BLOG SUPER PERSONALIZADO E NÃO SEI COM!
QUERIA DIFERENTE DE TODOS OS MODELOS QUE JÁ EXISTEM!
UMA MOLDURA …SEI LÁ!
PODE ME AJUDAR???
Para isso, você tem duas opções: aprender a fazer, ou pagar para alguém que faça.
qiero aprender a criar um mrnu
Criei um blogger,enviei o endereço p. os amigos verem, mas todos dizem que ele não existe.O que deve estar acontecendo, pois aqui no meu computador eu vejo normalmente. No busca do google não aparece nem aqui de casa.
mwss: Seria melhor aprender a escrever, primeiro. E depois a ler.
Jacqueline: Não faço idéia do que possa estar havendo. E como você não deixou link para o blog, não posso nem sequer saber se posso vê-lo.
ola eu tenho uma radio online e queria saber como q faço pra colocar o plugin do media player no blog procurei o link pra colar mas nao axo como q faço???
Olá meu nome é Camila e eu fiz um blog a pouco tempo
e não sei como fazer para ele ficar do meu jeitinho
se alguem poder me dar uma ajudinha eu ficaria muito grata!
ola criei uma radio pelo programa do sam broadcaster e esta no site ”listen2myradio.com” mas nao consigo acha o htpp pra colar no blog como q faço??
Cara…tem 2 dúvidas…1°: como eu coloco uma imagem de fundo no meu blog??
2°: como eu coloco botões…
tipo….
INICIO
FOTOS
VIDEOS
BIOGRAFIA
???
Olá!!
Eu fiz um banner para colocar no cabeçalho do meu blog, mas não dá certo de jeito nenhum.
Talvez eu não esteja colocando a alt e larg da forma correta.
Se vc puder me ajudar eu agradeço muitooooooooo!!
Bjs c carinho
Magdinha
OBS: NO MÉTODO 1 A IMAGEM É CLICÁVEL SIM!
EIS UM EXEMPLO NESTE BLOG: filmesreligiosos.blogspot.com
gostei muito das suaa dicas,e tenho certeza de que você ajudara muita gente como me ajudou.obrigado
Legal
Poxa… eu faço tudo direitinho, mas quando salvo, o código fica “bagunçado” e não o banner não aparece…
Olha só:
O que eu faço?
[...] http://blosque.com/2007/05/como-personalizar-seu-blogger-blogspot_25.htm [...]
Obrigada pelas dicas.
Não sei sei houve alguma alteração, mesmo porque este post é um pouco antigo, mas dei uma remodelada no meu blog e não precisei alterar html para que o header ficasse clicável.
Só tem alguns poréns: na opção “behind title and description”, para quem estiver vendo a página principal, o header continua não sendo clicável (mesmo porque não precisa). Só quando estiver vendo páginas anteriores, ou estiver dentro de algum post específico.
Agora, se estiver usando o header “Instead of title and description”, aí ele fica clicável a qualquer momento.
Um último detalhe é que antes de se adicionar a imagem ao header, seria interessante não esquecer de clicar na opção de ajustar automaticamente o tamanho da imagem. Depois seria só questão de ajustar as bordas diretamente no html…
Enfim, não sei ajudei em alguma coisa, mas que tentei, tentei…
Ah, antes que eu me esqueça, muito obrigado por manter este blog, ele realmente é muito instrutivo e proveitoso para quem, como eu, está começando a blogar.
Olá pelo que vi aqui vc ajuda td galera a personalizar o blog, eu tenho uma pergunta.
Como faço para postar as imagens do Picassa no meu blogspot?
aguardo.
bj
ae gostei muito da sua dica,to querendo muito inclementar meu blog e divugar_lo,tenho visitas mas ate hoje nenhum comentario.
nao to preocupado em ganhar receitas e sim mais visitas com comentarios
Parabens amigo, suas dicas são muito util para quem está começando a Blogar… ganhou mais um seguidor.
Marcos Padiha
Tirei uma dúvida sobre como colocar uma foto grande no blog, vc me ajudou muito…!!! Obrigado…!!!
crie esse blog pra divulgar as cestas de café da manhã que faço mais depois de criado não tenho a menor ideia de como colocar imagens, cabeçalho, fotos vc pode me dar umas dicas. Por Favor.
Beijossssssss Angel
criei um blog sobre os artesanatos que faço mais queria deixar ele mais animado mais minha cara com desenhos animações e etc e não sei como fazer isso, tem jeito já que ele já esta criado????
bjs…
Olá! Acabei de criar um blog e estou ainda muito perdida. Gostaria de fazer 2 perguntas.
1. Por que as imagens que postei desapareceram? Só aparece aquele quadradinho “simpático” com um X vermelho?
2. Existe alguma maneira de aparecer, quando abro o blog, apenas o título e o nome dos arquivos (por ex) sem todas as postagens? Ou seja, a pessoa só acessa o arquivo desejado? Eu queria “guardar” as postagens em seus devidos arquivos em vez de ficarem a mostra de imediato!!
Caso haja solução, aguardo resposta. Desde já, obrigada.