Postagem atualizada em 12/06/2015
Olá pessoal, hoje eu preparei um código de menu fixo para vocês,porém ele é editável e vou ensinar a vocês a editarem como preferir.
clique no campo de texto e dê Ctrl + F e procure por: </head> ou </head e dê enter e, abaixo dele você cola isso:
<div id="menufiixubpd">
<li><a href="http://link aqui (não se esqueça do http)">Home</a></li>
<li><a href="http://link aqui (não se esqueça do http)">Link 1</a></li>
<li><a href="http://link aqui (não se esqueça do http)">Link 2</a></li>
<li><a href="http://link aqui (não se esqueça do http)">Link 3</a></li>
</div>
Como editar os links?
<li><a href="AQUI VOCÊ POE O LINK EXEMPLO: HTTP://WWW.GOOGLE.COM.BR">AQUI O NOME QUE VAI APARECER</a></li>
(Não se esqueça do Http:// antes do link).
Bom,vamos para a parte mais importante,agora que você já colocou o código base,tem de colocar o código que vai dar uma função ao menu,um estilo e uma cor.
Procure então por: ]]></b:skin>
e acima dele você cola esse código:
#menufiixubpd {
z-index:6666666666666666666666666666666666666666666666666666666666666666666666666666666666;
background: #f80068;
color: #fff;
font-family: arial;
text-align: center;
padding: 5px;
font-size: 13px;
width: 100%;
position: fixed;
margin: 0 -8px;
}
#menufiixubpd li {
list-style:none;
display:initial;
padding-right:7px;
}
#menufiixubpd li a {
color:#fff;
text-decoration:none;
display: initial;
}
Vamos editá-lo da maneira que você quiser.
O background (do css que você acabou de colar),define o tipo de cor hexadecimal ou uma imagem de fundo do seu menu.
Como colocar uma cor no menu:
background: COR HEXADECIMAL AQUI;
tem uma extenssão para google chrome ou firefox que você pode escolher as cores hexadecimais:
Veja ela clicando aqui.
Como colocar uma imagem de fundo do menu
background:url('url da sua imagem hospedada');
Você pode hospedar sua imagem no site imgur.com
Como trocar a cor da font:
em #menufiixubpd li a {
voce altera o color.
12 comentários:
o código de head esta errado.
quando coloco fala o seguinte.
div should not appear inside of head
;/
Olá, isso depende do layout que vc esta utilizando
No caso, seu layout nao permite que coloque qualquer div dentro do head
Como eu disse no tutorial, coloque abaixo do fechamento head
Nao deu certo :(
Nao deu pq talvez vc fez algo errado ... tenta de novo
Nunca Da Certo No Meu Sempre Fica Uns Nomes Em Cima E Nada De Menu
Claro que funciona gente '-' . n tem essa de "não funcionar"
é html e css
se nao da certo é pq vc n soube fazer
Dessa o meu funcionou perfeitamente! Não tive erros nem nada. Realmente se está dando errado é por conta do modelo ou porque não sou fazer ^-^ Obrigada pelo tutorial, estava precisando muito!
estou com o mesmo problema!!
Olá, tu bem? Obrigado pela ajuda.
Como posso colocar no html para redirecionar para a página inicial?
Se eu coloco www.meublog.com no código..
No site fica www.meublog.com/www.meublog.com
Não sei como resolver isso
Oibrgado!
Olá, você não pode se esquecer de colocar o http:// antes de qualquer link!
por isso, escreva deste modo: http://seusite.com/
Postar um comentário
Obrigada por comentar, deixe seu blog no comentário para eu retribuir *-*