Tutorial: Menu Shade para blog

|

Ooi amores <3 Como sempre sou uma lesma, mas enfim ashuhushau hoje eu trouxe um tuto para quem é blogueira, é um menu super simples e que da pra usar em qualquer lugar/coisa.

E vi o tuto la no no Adolescente Nerd e como estava sem ideias para post eu meio que copiei, então creditos ao blog divo <3 Aliás, para quem gosta de mexer em blogs lá tem muitos tutos e materiais legais viu?
Primeiramente para colocar o menu é preciso entrar no seu código fonte, então você vai ter que ir no seu modelo de layout, que fica na parte esquerda do painel de administração, fotinha aqui:


Então você clica em editar HTML e da um CTRL +F e digita assim: ]]></b:skin assim que você achar você vai colar em cima disso esse código:

.menu {margin-top:52px;margin-left:-78px;color:#aaa;width:140px;}.menu a {color:#aaa;font-family:'candara';font-size: 10px;letter-spacing:1px;padding:3px;border: 1px solid #eee;font-style:italic;display: inline-block;float: left;width:110px;margin-bottom: 2px;text-align:center;}.menu a:hover {color:#000;}
E caso você queira fazer uma mudança no menu ou algo do tipo eu vou deixar as orientações o.k? Aqui:

margin-top: Código para subir ou descer o menu. Se quiser subir acrescente um "-" na frente do número;
margin-left: Código para colocar seu menu para o lado esquerdo ou direito; - left: esquerda | right: direita
color: Mude para a cor em código HTML de sua preferência;
border: 1px solid #eee: Esse código faz a borda em volta do menu;
.menu a:hover {color:#000;}: Quando o menu fica hover, você pode tirar essa opção se quiser;
font-family:'candara';font-size: 10px;letter-spacing:1px: essa parte é a configuração da fonte do menu . Letter-spacing é a quantidade de espaço que existe entre cada palavra no menu;
font-style:italic: Significa que a fonte está em itálico, se quiser mudar para negrito troque italic por bold ou tire essa opção se quiser a fonte normal;
width: O tamanho do menu, sempre que alterar um 'width' mude o outro também para não ficar desproporcional.

Agora que você já "instalou" o menu vamos colocar ele não? Você vai precisar adicionar um gadget HTML/JAVA e colar o seguinte:

<div class="menu">
<a href="Link 1">Título</a>
<a href="Link 2">Título</a>
<a href="Link 3">Título</a>
<a href="Link 4">Título</a></div>

Caso você queira colocar mais de 4 links é só  tirar o </div> e adicionar um <a href="Link ">Título</a></div>.
Se você quiser colocar esse menu em uma postagem em uma página é só clicar em HTML na area de escrita e adicionar o.k?
Feito isso seu menu estará lá divo onde quer que você tenha colocado <3 Beijos amoras <3

Nenhum comentário:

Postar um comentário