, , ,

Tornando a Navbar do Blogger auto-ocultável

17 comentários
Blogger Hacks 

Blogger Navbar

A Navbar é a barra superior que aparece em todo blog hospedado no Blogger/Blogspot e que muitas vezes atrapalha visualmente o layout do blog. Porém, o uso da Navbar é opcional e ela pode ser removida. No entanto ela apresenta recursos úteis para muitos usuários, então por que não manter suas funções, mas evitar que ela atrapalhe o layout? Pra isso vamos torná-la auto-ocultável (só aparecerá quando o usuário passar o mouse por cima da área onde ela “deveria” estar). Porém, o Hack não funciona em algumas versões do Internet Explorer, mantendo a Navbar invisível mesmo quando o usuário passa o mouse.

Para tornar a Navbar do seu blog auto ocultável, faça o seguinte:

Acesse o seu Painel do Blogger e selecione Layout, então clique em Editar HTML para entrar no modo de edição do código do seu Template.

Não se esqueça de fazer o backup do seu template antes de realizar as alterações no código, clicando em Baixar modelo completo.

Encontre o seguinte código (utilizando o Ctrl+F do seu navegador):

]]></b:skin>

Então cole o seguinte código ANTES: 

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)} #navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

Visualize para ver se está tudo correto e clique em Salvar Modelo.
Agora é só visualizar seu blog e testar o novo recurso. Note que o espaço reservado para a Navbar sempre terá que existir, embora ela não esteja visivel.

Se o Hack não funcionar ou causar erros no seu template, desfaça as alterações clicando em Limpar Edições ou utilize o backup que você criou e clique em Fazer Upload, então refaça todo o processo.

Comentários (17)
Fabiano Roberto 31/03/09 14:23

muito boa idéia, simples e produz um ótimo efeito

Jonathan Hess 31/03/09 17:51

Muuito bom :) Adorei esse efeito.

Elker.C 31/03/09 23:14

acho que ninguém no mundo gosta da navbar. Eu não gosto porque quando eu clico em "próximo blog", aparece um blog sobre Plantas, e Plantas X Tecnologia = nada ver.
Prefiro deixar ela bem invisível.

Naty 07/04/09 13:11

Essa dica vai deixar o meu Layout muito mais bonito!

Parabéns!

kauan98 20/04/09 10:19

nao deu certo

entrem em http://kauandownloads.blogspot.com/

Compulsão Diária 07/05/09 10:46

Não dá certo em todos os templates. Uma pena. Nos que dá fica muito bonito

Anônimo 27/05/09 19:59

Muito bom! Obrigada!

catherine 15/07/09 13:43

eu não consigo encontrar o tal código no meu blog, chas que me podes ajudar ?

Borealis 28/07/09 20:21

valeu, aqui deu certo, muito boa diza , estava a procura e, ei-la aqui.. valeu

Roberto du Vale 09/08/09 15:47

Dica muito boa, fiz e deu certinho, Ice break sempre trazendo dicas boas para usuários do blogspot. Um abraço e fiquem com Deus...

http://blogduvale.blogspot.com

tamiresu-chan 07/09/09 13:39

nossa,muito bom,muito bom
eu estava lendo e relendo o post e repetia o mesmo erro no código ai vi que que vc deixou a palavra ANTES assim e pensei "ahhhh....antes..."
eu sou lenta mesmo ¬¬
mas muito bom me ajudou muito

Este comentário foi removido pelo autor.

Muito legal, otímo, já fazia um tempo que eu vinha pensando em um meio de retirar ou ocultar a bara "navbar" do meu blog.Obrigado pelas dicas.

Mairink 15/05/10 12:46

Fica muito bom,esta dica é dez

..B.F.R.. 24/02/11 02:14

valeu ..deu certinho no meu blog..agora a nav bar so aparece quando passa em cima..ela esta oculta...

A 13/08/11 15:30

Achei em vários sites essa dica, mas foi a única que funcionou como eu gostaria, parabéns!!! Excelente Dica.

Michael Bastos 23/09/11 14:41

Parabens pela sua dica

Postar um comentário