Menu de Abas

Olá anjos!

Me pediram para ensinar aquele menu de abas que uso no meu outro blog, que você pode colocar vários Gadgets em um só. Escrevi o post e deixei ele em rascunho, e quase esqueci do pedido da leitora. Sinto muito por isso, estava tentando tirar férias... mas não deu certo.

O primeiro tutorial que aprendi deu erro, aí eu tive que procurar um novo. Achei no Kawaii World o tutorial que usei, apenas editei as cores do modelo da Kaori. Mesmo que outros blogs tenham postado esse tutorial, eu peguei o código do meu menu no KW e os créditos vão para ele, ok? Estou postando o mesmo código que uso no meu blog, apenas retirei o HTML dos meus Gadgets. 

Esse menu é muito útil para quem tem muitos Gadgets e quer desocupar espaço, mas ele tem seus defeitos, que seria o tempo que ele demora para carregar. Enquanto o blog está carregando, o menu fica todo desalinhado e feio. Para quem é perfeccionista fica horrível. Mas para quem tem internet boa isso não muda nada.

Veja um preview aqui.

Em um Gadget de HTML/JavaScript cole:

<script type="text/javascript">
document.write('<style type="text/css">.tabber{display:none;}< \/style>');
</style></script>
<script type="text/javascript" src="http://static.tumblr.com/dlelfro/DZqmha795/javascriptkw.js"></script>
<link rel="stylesheet" href="http://static.tumblr.com/fmf4w4k/qnsmqro46/estilo.css" type="text/css" media="screen" />
<br />
<div class="tabber">
<div class="tabbertab" title="Aba 1">Coisas da aba 1</div>
<div class="tabbertab" title="Aba 2">Coisas da aba 2</div>
<div class="tabbertab" title="Aba 3">Coisas da aba 3</div>
<div class="tabbertab" title="Aba 4">Coisas da aba 4</div>
<div class="tabbertab" title="Aba 5">Coisas da aba 5</div>
</div><br />

O estilo é o que eu uso no meu blog, borda roxa e fundo cinza. Caso queira mudar, faça o seguinte:

Abra esse link aqui. Copie todo o código que aparecer em um bloco de notas. Mude as cores e os estilos de borda. Na hora de salvar, coloque o nome desejado e no fim, .css Feito isso, hospede em um site de hospedagem (como o Tumblr), e troque pela parte em negrito no código do menu.

Mude os códigos de cada aba para o que você deseja. Espero que ajude! :)

Meus querides! Caso vocês gostem desse blog e queiram continuar me acompanhando, eu ainda escrevo, mas em outro blog. Não posto apenas tutoriais, mas continuo escrevendo e falando de vários assuntos, inclusive a blogosfera. Caso queira visitar (sério ótimo uma visita): clique aqui para ir ao blog Serenar