Navbar com efeito Hover / Mostra e Oculta

Hayo!!! Bem tem alguns tutoriais que mostra como remover a  Navbar,  mas tem pessoas que gostam dela mais não quer que fique aparecendo.  Então irei mostrar como oculta-la ok? E quando passar o mouse ela aparecer. Basta apenas passar o mouse lá no topo.

Brevia do efeito

Primeiro passo é ir em:
Design >> Editar HTML (Antiga interface)
Modelo >> Editar HTML >> Prosseguir (Nova interface)
Então use o atalho Ctrl+F
 
Então você procure pela tag chamada ]]></b:skin>
Logo após achar cole o seguinte código a cima dela.

Códigos

/* ----- Efeito de esconder e mostrar a navbar ----- */
 #navbar-iframe {
 opacity:0;
 -webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
 -o-transition: all 1s ease;
transition: all 1s ease;
}
#navbar-iframe:hover {
 opacity:1;
}

Agora irei mostrar como retirar o espaço que ficar.
Ainda usando o atalho procure por essa frase /* Variable definitions
e bem a cima dela cole o codigo a baixo

Códigos

#navbar-iframe {
 } body .navbar
 {
height:0px; }
 .content-outer
{
margin-top:0px; }

Mas se quiser remove la definitivamente! E o espaço também e só procurar por   /* Variable definitions  e colar o código a baixo em cima dela.

Códigos

#navbar-iframe {
display: none !important;
}
body .navbar
 { height:0px;
}
.content-outer {
margin-top:0px;
}

Se usar a ultima opção Não use a primeira etapa apenas essa. Espero que tenham gostado até a próxima kiss