O antigo Blogger permitia que seus blogs exibissem uma imagem ou título clicável no Header (cabeçalho), função que foi eliminada no Novo Blogger. O cabeçalho clicável é uma função muito útil; a maioria dos visitantes espera que um click na imagem ou título do header os leve de volta à home page do blog.
Esse sistema facilita a navegação, e substitui com vantagem o link ao “Início”, que aparece no rodapé de cada post. Esse link não costuma ser facilmente visualizado, e vai contra os hábitos do visitante médio.
Você pode implementar essa função de duas formas no novo Blogger: Título Clicável, ou Imagem clicável.
Para isso, primeiro você deve…
Permitir a Adição de Elementos ao Header – Cabeçalho
- Entre na sua conta do Blogger.
- No Painel, escolha o blog que deseja editar e vá até Modelo ->Editar HTML.
- NÃO clique em ” Expandir modelos de widgets”. Se a caixinha estiver marcada, desmarque.
- Procure pelo código do Header; ele deve estar logo após a tag <body>. O código é este:
<div id=”header-wrapper”>
<b:section class=”header” id=”header” maxwidgets=”1” showaddelement=”no“>
<b:widget id=”Header1″ locked=”true” title=”Título do Blog (Cabeçalho)” type=”Header”>
</b:widget>
</b:section></div>
Também pode ser que o código seja ligeiramente diferente no seu template; se você usa o Harbor template, por exemplo, o código é este:
<b:section class=’header’ id=’header’ maxwidgets=’1‘>
<b:widget id=’Header1′ locked=’true‘ title=’Título do Blog (Cabeçalho)’ type=’Header’/>
</b:section>
Em qualquer dos dois casos, você deve modificar os valores que estão em vermelho:
maxwidgets=”1“ – Coloque “3“ no lugar do “1“
showaddelement= “no” - Substitua “no“ por “yes“
locked=’true‘ - Substitua ‘true‘ por ‘false‘
O código deve ficar assim:
<div id=”header-wrapper”>
<b:section class=”header” id=”header” maxwidgets=”3” showaddelement=”yes“>
<b:widget id=”Header1″ locked=”false” title=”Título do Blog (Cabeçalho)” type=”Header”>
</b:widget>
</b:section></div>
Ou assim:
<b:section class=’header’ id=’header’ maxwidgets=’3‘>
<b:widget id=’Header1′ locked=’false‘ title=’Título do Blog (Cabeçalho)’ type=’Header’/>
</b:section>
Salve as mudanças. Agora você já pode…
Adicionar um Título Clicável
- 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:
<a href=”URL DO SEU BLOG“><font size=”7” face=”Georgia, Arial” color=”#000000“>TÍTULO DO BLOG</font> </a>
O que está em vermelho são os valores que você deve modificar, para adequá-los ao seu blog.
- URL DO SEU BLOG: o endereço do seu blog; por exemplo, http://net-dinheiro.blogspot.com
- Font Size: tamanho da fonte do Título
- Face: tipo de fonte
- Color: cor do Título.
- Título do Blog: o nome que você quer que apareça como Título.
Após modificar o código, salve as alterações. Se não gostar do resultado, volte e faça outras modificações, até que o Título esteja do seu agrado.
Removendo o Antigo Título
Agora, se você visualizar o blog, provavelmente verá o título que você acaba de criar, mais o antigo cabeçalho – o título não-clicável do blog. Livrar-se dele é muito fácil.
- Nos Elementos da Página, clique no “Editar” do widget que diz “Título do Blog (Cabeçalho)”.
- Na janela pop-up, clique em “Remover elemento da página” .
- Tenha cuidado para não remover o título que você mesmo criou.
- Pronto. Agora o único título que aparece é o seu Título Clicável Personalizado.
Próximamente: como adicionar uma imagem clicável ao cabeçalho do seu blog – assim como a imagem do header do Blogando por Dinheiro que você vê aí em cima, no topo do blog.
Fonte: Beta Blogger For Dummies
_______________________________
Compare Preços de: Dinheiro, Renda, Respostas, Dúvidas, Dicas, Ferramentas, DVD, Celulares, Filmes, Câmeras, Notebooks, Jogos , Wii, PS3 no JáCotei
________________________________
estou tendo problemas para inserir a imagem do cabeçalho diretamente da web. insiro o link da imagem no campo url, mas nada acontece. fica processando o tempo todo e não para. pode me ajudar?
Já respondi seu email, espero ter ajudado.
Poderia postar a resposta? Pois estou com o mesmo problema. Ou melhor, tento inserir a imagem com link mas aparece só o título.
Ele nao respondeu meu email, então não sei se minha dica funcionou ou não. Para que eu possa te ajudar, seria melhor que você me mande um email, com a URL do seu blog e uma explicação detalhada de qual é o problema, ok?
Olá,adorei o seu Blog,dicas muito boas mesmo !!!parabéns.
Será que voce poderia me dar um passo – a – passo de como colocar um banner como o do seu Blog ,no meu Blog ?
Agradeço desde já
Angel
Obrigada!
O passo a passo está aqui:
Como Personalizar seu Blogger – Blogspot: Imagem Personalizada no Header
eu não entende uma frase se quer do que vc escreve, eu acho que estou antes da categoria iniciantes ou devo ser a categoria burra…
Claro que não! Ninguém tem obrigação de saber tudo, ou de entender tudo, minha amiga! Antes de começar a mexer com estas coisas, eu também não sabia nada. E aposto que se formos discutir moda, a burra sou eu!
É só uma questão de qual é o foco e o interesse da pessoa. Eu fiz dos blogs minha profissão, você é apaixonada por moda – cada um na sua, mas com alguma coisa em comum, né?
Estive olhando seu template, e não entendi muito; você ainda não mudou para o “novo Blogger”? Me parece que não, mas não pude chegar a uma “conclusão conclusiva”.
Se você usa o Blogger Clássico, eis aí a razão do problema: minhas dicas são (quase todas) para o Blogger novo – o que usa os layouts com widgets – o qual tem uma interface completamente diferente. Outra razão pode ser o seu template, que não é nem parecido com os padrões que conheço.
De qualquer forma, eu gostaria que você me mandasse um email através do formulário de contato, explicando o que você quer fazer e qual é o problema, seja lá o que for, assim eu posso te dar uma mão. O que você acha?
seus blog é otimo em…
mais tbm nao to conseguindo colocar a imagem, da pra me ajudar?
abraços
Olá,
muito boa essa dica, show de bola, funcionou perfeitamente, so nao consegui tirar o titulo no topo…
vo tentar excluir os escritos para ver no que vai dar…
ótimo blog…
parabéns…
continue nos ajudando….
Abraço
Dalbert: Lamento mas não tenho mais tempo disponível para dar ajudas personalizadas.
Leandro: Você tem que excluir o widget que contém o título original.
1- Como ja usei algumas dicas do teu blog, se quiser me mande o codigo do teu baner que coloco no meu blog, não é necessario parceria, é apenas um agradecimento.
2- Como posso colocar um botão clicável que envie para outra página com uma lista de todos os post sendo que cada nome deve ser um link para o post correspondente dentro do blog. Algo assim como “listão de Post”
Paulo: Muito obrigada, mas eu nem tenho banner. Se quiser colocar um link, já fico muito agradecida!
Quanto à lista de posts… Se você se vira com inglês, dê uma olhada aqui: BlogToC Widget Released
Caso contrário, o jeito é fazer um post com todos os links, e usar um botão (uma imagem com o mesmo código que você usa para linkar outros blogs com banners) para linkar esse post.
Para que ele não apareça na Home, é só alterar a data antes de postar, para uma data mais antiga.
oi! alguem me pode ajudar?
como posso adicionar um link em uma imagem? quando clicamos na imagem ir logo para o link adicionado!
abraços
Neste tutorial está explicado.
olá… segui passo a passo mas no meu blog o Header está diferente… não sei o que alterar então… se puder me ajudar ae vai como ele está
/* Header
———————————————–
*/
#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
#header-inner {
background-position: center;
margin-left: auto;
margin-right: auto;
}
#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}
#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
}
#header a {
color:$pagetitlecolor;
text-decoration:none;
}
#header a:hover {
color:$pagetitlecolor;
}
#header .description {
margin:0 5px 5px;
padding:0 20px 15px;
max-width:700px;
text-transform:uppercase;
letter-spacing:.2em;
line-height: 1.4em;
font: $descriptionfont;
color: $descriptioncolor;
}
#header img {
margin-$startSide: auto;
margin-$endSide: auto;
}
Obrigada desde já!
Adorei o Blog e as dicas!! Ajudooou muito a deixar tudo como eu queria!
BEIJOS
;*
Daniela: Isso que você postou aí é o seu CSS. O que você tem que editar são os widgets ou o HTML, não o CSS. Siga passo a passo o post e você vai conseguir.
Kiss: De nada, volte sempre!
Show de bola!
O curioso é que, atirando no que vi, acertei o que não vi… Eu não estava conseguindo centralizar a imagem, no meu novo blog. De repente, deu tudo certo!!
Mas, final de dia, cansada, não consegui ficar fazendo os testes para deixar o título do blog como no original. Então, por ora, já feliz por ter centralizado a imagem, continuo depois as experimentações.
Adorei o blog!
Grande abraço!
valeu pela dica… testei e deu certinho
Suzi: Seja bem vinda!
Que bom que funcionou, fico feliz ems er útil. Volte sempre, e boa sorte com as experimentações! 
Renan: De nada!
[...] Conforme está explicado neste post: Como Personalizar seu Blogger – Blogspot: Título Clicável no Header. [...]
eu nao consigo criar um menu no meu blog au quen me ajuda
Cara, você é bárbaro(a)… já tinha suado a camisa e não tinha me tocado que bastava inserir um elemento em html no cabeçalho… putz!
Valeu de montão!
Abraços,
Robson
mwss: Eu não posso.
Robson: De nada!
Dois probleminhas: apesar de eu alterar a côr e tamanho da fonte, ela permanece pequena e com uma outra cor diferente da que eu escolhi. O outro problema é que quando excluo o antigo nome meu header diminui e muito! Pode me ajudar?
Sabe o que é?Acho que n sabe,então la vai:
PLEASE,me ajude a fezer um TEMPLATE,e de preferência daqueles q são “de grátis”,sabe como é né,o dólar aumentou,a crise ta por aí…rs
Então?
O Fotoshop ta aqui instaladinho so esperando uma forcinha,já tentei um monte mais n consegui(acho q são resquícios do meu ex cabelo loiro)
Vai me ajudar?
Boa tarde!
É o seguinte, consegui adicionar o título clicável e remover o outro, mas o novo título (clicável) está alinhado à direita e eu queria deixá-lo centralizado…
Pode ajudar?
Oi eu estou com um problema..
Eu gostaria de saber como posso colocar postagens antigas la em baixo do meu blog?
postagens antigas.inicio.postagens recentes..
me ajudem
blw
meu amigoo. eu sou novoo no blogger e tive muita dificuldades de fazerr os cabeçalohs. eu queriiaa
c vc pode-se me passa passo a passo.. pro meu email.
muitO obrigadO Deus te abençoee.
Amigo, muito bom este artigo. Mas o que quero saber é algo mais simples…
Gostaria de saber como modificar a fonte TTF do Título das Postagens. Ainda estou criando meu blog e não estou sabendo como fazer isto, uma vez que, a fonte que quero usar, não faz parte da escala “Fontes e Cores” do Blogspot.
E então, será que você pode me ajudar?
Um abraço, Henrique
Olá Nospheratt,
continuo leitora assidua dos teus textos…Aos poucos, sem pressa, mas com o carinho necessário, o meu blog está tomando corpo e como você mesma disse quem deseja ser um blogueiro respeitado tem que ter paciência e humildade para aprender com os ensinamentos dos mais experientes, e assim estou crescendo com muitas leituras de blogs diversos.Adorei as dicas e como sempre só posso parabenizar pelo texto e as dicas.
Abraços da amiga Yara Sereia!!
Quero que meus HTML fique clicável dentro da postagem, não estou conseguindo fazer isso, por favor me ajude. Abraços
Parabéns, deu certinho o código, foi uma mão na roda.
Valeu mesmo.
Primeiramente parabens pelo seu blog e pela paciencia de dar estas dicas que para principalmente pessoal leigas como eu estao sendo muito interessantes.
Uma duvida que tenho e nao consegui ainda que me respondam é se eu pesquisar no google pelo nome esportes cuiaba ou dalton ferreira nao aparece meu blog. Tem jeito de fazer aparecer ou nao tem jeito?
Desde ja agradeço a paciencia e novamente meus parabens
dalton
Ola…estou precisando muito de ajuda pois sou leiga no assunto blog, e estou com muitas dificuldades de personalizar meu blog, se possivel me AJUDE
Agradeço pela atenção.
Olá! Gostaria de saber como colocar aqueles botões para clicar logo abaixo do cabeçalho, para deixar o blog mais organizado e bonito; garimpei, mas não achei!!! Podes me dar uma mão?!?!?! No mais, gostei muito de tudo o que li!!! Muito obrigado!
Obs.: Pode ser por e-mail a resposta… thanks!!!
uau, todas as dicas e tutoriais daqui estão me ajudando muito, estava procurando como deixar clicável meu lay D: amém
consegui *-*
muito obrigada!