Designer do modelo – como retirar navbar

Designer do modelo – como retirar navbar

6 10 99
Designer do modelo – como retirar navbar 10 6 99
Se você já está usando um dos novos modelos do Blogger, através da página Blogger in Draft, saiba que retirar a navbar ficou ainda mais fácil.
Eu já expliquei neste post Como criar um template para Blogger / Blogspot, mas me parece que nem todo mundo conseguiu entender. Sendo assim, vou explicar detalhadamente.
Acesse o designer do modelo, clique em avançado (1) e depois em adicionar CSS (2). Cole o código abaixo, dentro da parte em branco (3) e aperte a tecla enter do seu teclado.

#navbar-iframe { height: 0px; visibility: transparent; display: transparent; }
retirar_navbar
Clique sobre a imagem para ampliar
Assim que você colar o código e apertar a tecla enter, a navbar irá ficar invisível.
Que eu saiba, não há nenhuma restrição por parte do Blogger quanto à retirada da navbar:
Confirmado: NavBar do Blogger é opcional – blog Usuário Compulsivo
While we don't recommend or support the removal of the Blogger navbar, there is nothing in our Terms of Service that explicitly mandate its use. Fonte: fórum do Blogger em inglês
ATUALIZAÇÃO – Este método já não está funcionando tão bem, visto que a Equipe do Blogger vem fazendo alterações no Designer do Modelo. O @velosomanel, postou em seu blog Rascunhos Blogger, uma forma de retirar a navbar completamente e que pode ser adaptada aos novos modelos. Entre no html e procure por <body class='loading'>
Cole logo antes o seguinte código:
<!-- Navbar-->
<script type='text/javascript'>
<![CDATA[
<!--
/*<body>*/
-->
]]>
</script>
<!-- Navbar-->
Aceite a exclusão do widget navbar e salve.
Fontes: Blogger Plugins e Blogger Rascunhos
35 Comments
Comments
  1. É... Mas, cautela e canja de galinha não faz mal a ninguém, eu ainda prefiro escondê-la. :)

    ResponderExcluir
  2. Mais agora, com o templates novos, tem que ter cuidado. Em alguns casos, a barra, pode dar um charme, do que ser a vilã...

    ResponderExcluir
  3. muito obrigado pela dica, juliana, eu estava fazendo de outro jeito e não dava certo!
    valeu, abraços

    ResponderExcluir
  4. Muito obrigado pela dica Juliana. Com o método antigo a navbar nesse modo "designer de modelo" sumia, mas o espaço que ela ocupa continuava preenchido (em branco). Agora está funcionando perfeitamente :)

    ResponderExcluir
  5. è acabei esquecendo este detalhe e toda vez que tentava pelo modo normal (layout->editar html) aparecia um erro e não tinha como mexer acredito que agora consiga..
    Abraço!

    ResponderExcluir
  6. Não precisa aturizar publicação, não. Só quero divulgar uma homenagem ao trabalho de vcs:

    www.futeboldeartista.blogspot.com

    ResponderExcluir
  7. po gostei nunca tinha usado esse Blogger in Draft ja tinha ouvido fala dele aqui mais nem sabia o que era com ele fica focinho em,valeu pela dica da navbar.

    ResponderExcluir
  8. Adriana, muito obrigada. Fiz questão de comentar lá. Abraços

    ResponderExcluir
  9. Juliana
    Qual a vantagem em retirar a Navbar?

    ResponderExcluir
  10. Olá Juliana! Gostaria mesmo que você me ajudasse a esclarecer o mistério do Jump Break em meu blog! Não consigo mais ativá-lo. Desde segunda-feira, tenho passado horas em pesquisa para ver se acho algum esclarecimento e não consigo! Help me, please!!

    ResponderExcluir
  11. Ramiro, tirando a estética não vejo mais nenhuma outra vantagem

    Jackie, envie sua dúvida ao fórum do Blogger.

    ResponderExcluir
  12. Interessante.

    Mas prefiro esconder a navbar mesmo, só para evitar complicações...

    Show de bola o site.

    ResponderExcluir
  13. Eu vi, querida, adorei. Vida longa aos blogs!

    ResponderExcluir
  14. Parabéns pela postagem, uma dica que faz a diferença nos blogs. ^^

    Juliana, tenho uma dúvida.

    Eu possuo um blog: www.celulaacao.com e estou reformulando o layout dele, gostaria de saber o que faço para que o #sidebar continue com background até o final da página.

    Abraço.

    ResponderExcluir
  15. Olá!

    Tinha usado esse recurso a pouco tempo, e realmente funciona!

    Mas, hoje quando abri o blog vi que ficou um espaço "vazio" onde antes tinha a Navbar.

    Na 1º vez que add o código, aquele espaço onde a navbar estava sumiu, e o blog "subiu" um pouquinho, ocupando aquele espaço.
    Agora, a navbar está apenas como "invisível", mas aquele espaço continua lá...

    Isso é algum erro?

    Obrigado.

    ResponderExcluir
  16. olá segui as dicas pra retirar o navbar, e realmente funciona,agora como faço pra postar facilmente sendo que o botão de postagem ficava no navbar,é necessario ir pra o google e fazer longin toda vez que eu abrir a pagina?

    ResponderExcluir
  17. Esta com este problema de ocultar a navbar e o espaço lá em cima sobrar. Vou testar! Valeu pela dica! :-)

    ResponderExcluir
  18. Ótima dica!
    A única desvantagem do segundo código é, que o lápis de edição rápida dos posts e aquelas ferramentas pra editar os widgets somem, mesmo estando logado elas não aparecem.

    Reparei também que as lixeiras usadas pra excluir os comentários também sumiram.

    Tirando isso, o código é perfeito!

    ResponderExcluir
  19. ótimo o primeiro código continua funcionanado perfeitamente e muito fácil imagina eu tenho 12 anos e acho fácil se alguem nao achar facil ,sem comentários

    ResponderExcluir
  20. Bom, depois que eu postei o comentário acima, eu andei olhando meu código fonte e comecei a fuçar nos códigos CSS do meu template. Antes usando o código:

    #navbar-iframe {height: 0px; visibility: transparent; display: transparent;}

    O espaço da navbar sumia, mas agora ela apenas fica invisível e o espaço que ela ocupa ainda aparece.

    Então resolvi usar o segundo código, mas estava sentindo muita falta dos ícones de edição rápida, então como eu disse, fucei e coloquei o seguinte código:

    .navbar {display:none;}

    E a navbar sumiu, e o espaço que ela ocupa também sumiu (fazendo com que o site subisse um pouco), bom eu uso um template do Blogger in draft, mas creio que deva funcionar nos templates do Blogger normal também.

    E é isso, resolvi compartilhar, fica ai a dica se a equipe do Dicas Blogger quiser testar! ^^,

    Forte abraço.

    ResponderExcluir
  21. Boa dica! Eu usei o primeiro código, deu certo, uso o Blogger In Draft. Não sei se da certo no normal. Bem como eu queria que ficasse um espaço em cima do titulo do blog. Assim o logo não fica colado no topo.

    Valeu a dica!^^

    ResponderExcluir
  22. Olá ,

    Eu já vi esse código várias vezes e eu tenho ele no meu site mas a algo que realmente me incomoda.

    Quando eu tiro o navvbar o espaço que ele ficaria fica em branco e eu queria muito que a página suba e ocupe o espaço em branco mas eu não sei como fazer isso.

    Se vocês poderem me dizer eu ficaria muito feliz.

    Meu site (www.autostunados.blogspot.com)

    ResponderExcluir
  23. Excelente dica essa que Igor Souza deu!

    ResponderExcluir
  24. dicas muito boas, realmente funciona! ja tinha tentado de outras formas e nao tinha conseguido.
    para conferir e so assesarem http;//WWW.MUSICDOW.COM

    ResponderExcluir
  25. Obrigado pela dica, já me ajudou umas mil vezes! Hehe.

    ResponderExcluir
  26. Os dois códigos funcionam perfeitamente, parabéns pela dica, obrigao!!!

    ResponderExcluir
  27. Muito obrigado pela dica, foi muito útil em meu site...

    ResponderExcluir
  28. Muito obrigada, eu pesquisei em vários sites e não conseguia retirar. O seu muito útil.

    ResponderExcluir
  29. Vocês são incríveis. Muito obrigado.

    ResponderExcluir
  30. vlw! eu vivia procurando no google até eu achar esse site que foi o melhor que eu achei!!

    ResponderExcluir
  31. valeu mesmo cara, muito bom , obrigado, abraços

    ResponderExcluir
  32. Obrigada Juliana você me ajudou d+
    muito boom esse site

    ResponderExcluir
 
Dicas Blogger© 2007-2015 | Todos os direitos reservados | Design By Duy Templates
Top