Image Map

16.3.13

Menu de abas



Oi! Como vão? Hoje trouxe um tutorial bem útil para quem não quer deixar a sidebar cheia de gadgets. É um menu de abas onde você pode deixar várias coisas separadas por categoria. Por exemplo: Se você quiser colocar o link-me, afiliados e uma caixa de pesquisa em um só gadget, isso é possível. Mas calma, não vai ficar nada desorganizado. Tenha uma prévia aqui.



Para começar, vá até seu HTML e procure por </head>.
Depois de achar o código, cole em cima dele o seguinte:


<link href='http://naah-oliver.zip.net/menu2.css' media='screen' rel='stylesheet' type='text/css'/>
<script src='http://poisonedapple.awardspace.us/tabber.js' type='text/javascript'/>
 Visualize e se tiver tudo certo, salve. 

Para que o menu apareça,  abra um gadget de JavaScript e cole o seguinte:

<div class="tabber">
<div class="tabbertab" title="Aba 1">
<br>
Conteúdo 1</>
</div>
<div class="tabbertab" title="Aba 2">
<br />
Conteúdo 2</div>
<div class="tabbertab" title="Aba 3">
<br />
Conteúdo 3</div>
</div>

Entendendo!

Onde está Aba 1, você deve colocar o nome da aba, ou seja, o nome da primeira categoria.
Onde está Conteúdo, você vai colocar o codigo da categoria. Por exemplo, você vai colocar os afiliados, coloque o código que usamos para que os afiliados apareçam no blog. 

Espero que tenham gostado, comentem o que acharam que ficarei feliz em saber. Beijos!

11 comentários:

  1. Ótima explicação, esse menu é super útil ><

    crazyforhtml.blogspot.com

    ResponderExcluir
  2. Adorei o menu , bem simples u3u'
    Explicou muito bem!

    Abraços ♥

    VISITE : http://pensamento-jhenny.tk/
    Post novo \õ

    ResponderExcluir
  3. Lindo o menu *------*
    pequeena-princesa.blogspot.com.br/

    ResponderExcluir
  4. Como coloca um link no conteudo? Estou tentando mas não consigo!
    http://moda-teensworld.blogspot.com.br/

    ResponderExcluir
  5. Ah acabei de descobrir. kkkkkkkk #lerdeza mode on Amei o tutorial e ja estou usando, ja creditei seu blog porque ele é muito divo!
    http://moda-teensworld.blogspot.com.br/

    ResponderExcluir