terça-feira, 7 de maio de 2013
Olá Galera, hoje vou ensiná-los como deixar o menu lateral do seu jeito!
Ex:
Vá em Modelo, Editar HTML.// Ctrl + F e procure por:
]]></b:skin>
Adicione o Seguinte Código Acima da Tag!
/* Menu Lateral do Seu Jeito GxpDesign
-----------------------------------------------*/
#menulateral li {
margin:0;
padding-top:0;
padding-bottom:.25em;
padding-$startSide:15px;
line-height:1.5em;
list-style:none;
}
#menulateral li {
height:20px;
font-family:Arial;/*TIPO DA FONTE*/
margin:-1px 0 0 3px;
text-indent:-15px;
text-shadow:0 0 .3em #2a2a2a;/*SOMBRA DO TEXTO*/
font-weight:bold;
color:#fff;/*COR DA FONTE*/
text-decoration:none;
padding:1px 0 0 15px;
font-size:15px;
text-decoration:none;
padding:0px 0 0 1px;
font-size:120%;
}
#menulateral li:hover{
height:20px;
font-family:Arial;
text-indent:-15px;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.2s linear;
transition: all 0.5s linear;
}
#menulateral li a{
padding:0px 0 0 18px;
font-family: Century Gothic;/*TIPO DA FONTE*/
font-size:15px;/*TAMANHO DA FONTE*/
width:186px;/*LARGURA*/
height:20px;/*ALTURA*/
font-weight:normal;/*ESTILO DA FONTE*/
color:#fff;/*COR DA FONTE*/
text-decoration:none;
display:block;
border-bottom:0px solid #e0e1e4;
-webkit-transition:All 0.5s ease;
-moz-transition:All 0.5s ease;
-o-transition:All 0.5s ease;
}
#menulateral li a:hover{
color:#b22222;/*COR DA FONTE*/
width:186px;/*LARGURA*/
height:20px;/*ALTURA*/
text-decoration:none;
border-bottom:0px solid #e1e2e3;/*COR DA BORDA INFERIOR*/
-webkit-transition:All 0.2s ease;
-moz-transition:All 0.2s ease;
-o-transition:All 0.2s ease;
padding-left:54px;
}
Salve o Modelo!
Vá em Layout, adicione um Gadget HTML/JavaScript
<div id='menulateral' style='background: CORou url('');'>
<li><a href="Link Da sua Postagem AQUI" title="Home">Home</a>
