20 de ago. de 2013

Menu suspenso decorado

||
sonho de consumo...

Boa tarde pessoal. Nossa, eu to muito cansada hoje, saí da academia e tive que vir pra casa caminhando. Amo muito vocês e esse blog u_u. Enfim, eu ainda to vendo a ideia da playlist, se talvez possa estragar o layout e tal. Uma coisa, eu adoraria postar num blog grande, mas continuar com esse aqui como prioridade e tal, mas gostaria ter a oportunidade de postar num blog com no mínimo 500 seguidores. Se souberem de algum que precisa de postadora... É muito difícil, deduzo que muitos queiram isso, não?

Bom, hoje eu trouxe o tutorial daquele menu suspenso que eu usei no gadget "Dreams". Peço que os donos dos blogs que lá estão não entendam que eu estou quebrando o blog deles (o nome do blog é Breaking Dreams, sacou? uheuahueahuhaueh), porque estariam entendendo errado... Enfim, vamos ver como faz esse menu logo, né?


É aquele suspenso, que quando você clica em "mais blogs" aparece uma pequena listinha. Aqui tem uma preview, é sempre bom ter, para caso eu mudar o layout e tal. Está na sidebar, no gadget "meu suspenso decorado"

1. No HTML do seu blog procure por ]]></b:skin> e cole acima da tag achada:
(Ou vã no CSS do seu blog e cole em baixo de todos os outros códigos)
/****MENU SUSPENSO DECORADO código by Breaking Dreams****/
select {
background-color: #fff; /* cor do fundo */
font:8px skilscreen; /* fonte */
text-align: center;
color: #7AC5CD; /* cor da fonte */
width: 230px;
border-top: 1px dotted #7AC5CD;
border-bottom: 1px dotted #7AC5CD;
border-left: 1px dotted #7AC5CD;
border-right: 1px dotted #7AC5CD;
background : url('http://media.tumblr.com/tumblr_lm6ovviidy1qfoi4t.gif') no-repeat left;
padding-left : 23px;
}

Agora, adicione um gadget HTML/JavaScript assim:
<form><select onchange="top.location.href=this.form.links.options [this.form.links.selectedIndex].value" name="links">
<option selected/>TÍTULO PRINCIPAL
<option value="LINK"/>NOME
<option value="LINK/"/>NOME
</select></form>

Agora é só mudar onde está escrito TÍTULO PRINCIPAL pelo título, por exemplo "Mais Blogs" (como está aqui no blog).
Troque LINK pelo link e NOME pelo nome do link.
Se quiser colocar mais links/nomes, cole isso:
<option value="LINK/"/>NOME
antes de </select></form>

Era isso, vocês ficaram com alguma dúvida ou tá bem explicado mesmo? Enfim, pedidos ou dúvidas aqui ou na ask. Beijos!
E a propósito, feliz aniversário para a Demi, diva, linda, gostosa, guerreira, vida <3

15 comentários:

  1. Que menu legal <3

    - HTML Secret

    ResponderExcluir
  2. Amei, vou por em um teste só para ver como é u3u
    bjs

    chocoonut.blogspot.com.br

    ResponderExcluir
    Respostas
    1. haha, tá, mas como eu disse na postagem, é o que está no gadget "Dreams"

      Excluir
  3. Gostei do tuto :) kissses

    Candy || http://epidemiadosblogs.blogspot.com

    ResponderExcluir
  4. Oii gatinha!
    Passando por aqui pra conhecer seu blog, e como eu adorei, já estou te seguindo! ;)
    Espero que goste lá do meu bróguinho, também!
    Super beijO!

    www.makedamotociclista.blogspot.com.br

    ResponderExcluir
  5. Nossos sonhos de consumo, você quis dizer, u-u Eu nem tenho celular, só um tijolão que eu nem uso, p3p Pena que não tem a Preview, não posso dizer muita coisa... Mas acho que sei do que se trata, aquele menu para os afiliados? Se for, fica lindo <3

    ResponderExcluir
    Respostas
    1. ahuehauheau
      não tenho preview, mas é o menu dali na sidebar, no gadgt DREAMS

      Excluir
  6. Salvei o tuto, vou usar no meu próximo lay :3
    Laura||Unicórnios Em Paris

    ResponderExcluir
  7. Eu adoro esse menuzinho mas dá um trabalho kkkk
    Um beijo
    http://bombasticmusics.blogspot.com

    ResponderExcluir

- Eu sempre retribuo todos os comentários, SEMPRE;
- É permitido falar palavrão nos comentários, o que não pode é ser grosseiro com os outros;
- Aceito críticas construtivas, não ofensas;
- Sempre deixe o link do seu blog em baixo do comentários;
- Os comentários são moderados;
- Comentários do tipo "seguindo, segue de volta" ou algo do tipo não serão aceitos.

algumas carinhas para vocês usarem nos comentários:
(◕‿◕✿) ◕‿◕ (◡‿◡✿) ◑▂◐ ◑︿◐ ◑ω◐ ◑﹏◐