domingo, 6 de setembro de 2015

Menu acima do cabeçalho (sem a barra de pesquisa)



Oi amores!

Esse tutorial vai ser um pouco diferente com relação aos demais tutoriais já encontrados (ou não) pra você que queira um menu fixo no topo do blog. Pois bem, este aqui, apenas irá colocar o seu menu (páginas) acima do cabeçalho assim como o meu (mostrado na imagem acima). Ele não terá que adicionar gadget com algum código para que você possa criar um menu. E sim, personalizar, ou melhor explicado, alterar a posição de onde se encontra o seu menu atual, colocando o mesmo no topo. Vamos lá?


Modelo > Editar html > Ctrl+F ou F3 e procure por:
/* Tabs
assim que encontrar, apague todo o código que se encontra em /* Tabs

e coloque esse:
/* Menu personalizado by Elaine Gaspareto (http://www.elainegaspareto.com)
----------------------------------------------- */
.PageList {
text-align:center !important;
margin: 0px 0px 0px 0px;
padding: 20px 0px 20px 0px;
letter-spacing:0.4em;
position: fixed;
top: 0px;
left: 0px;
z-index: 999;
width:100%;
background: $(tabs.background.color);
}
.PageList li {
display:inline !important;
float:none !important;
padding: 0px 0px 0px 0px;
margin: 3px 0px 3px 0px;
text-decoration:none;
font: $(tabs.font);
text-transform:none;
color: $(tabs.text.color);
}
.PageList li a, .PageList li a:visited, PageList li a:hover {
text-transform:none;
text-decoration:none;
padding: 0px 0px 0px 0px;
margin: 0px 15px 0px 25px;
color: $(tabs.text.color);
}
.PageList li a:hover {
color: $(tabs.selected.text.color);
}

edite como preferir. O que esta marcado de azul, você poderá colocar cor alterando para:
background: #fff
o que está marcado de roxo você irá colocar a cor que preferir. Confira algumas tabelas de cores.
ou um background em imagem, alterando para:

background: url('url da imagem'); 
o que está marcado de vermelho você irá colocar o endereço da imagem

Na minha opinião em relação ao meu blog, achei um resultado maravilhoso. Uma vez que, já coloquei vários tutoriais mas nenhum deixou como eu queria.




4 comentários:

  1. Exatamente o que eu queria, menu acima do cabeçalho sem caixa de pesquisa. Grata!!
    Beijão.

    ResponderExcluir
  2. amor, como faço para deixar ele com opacidade, como o seu? Seu blog é lindo, beijos!

    ResponderExcluir
    Respostas
    1. Oi flor!! O meu é uma imagem feita com opacidade :D

      Excluir

Hey!
Fique a vontade ao comentar! Sem xingamentos por favor!

Muito obrigada!♥