Twitter Delicious Facebook Digg Stumbleupon Favorites More

Widget Links com Menu Suspenso

Há algum tempo eu estava procurando um widget de menu suspenso e os que eu encontrava era necessário fazer alterações no código HTML do blog.

Mas, finalmente, encontrei esse no blog Microship. Basta você inserir o nome e a URL do link e terá um menu suspenso bem interesssante. Veja os modelos abaixo:

1 - Links em Menu Suspenso (com carregamento automático ao selecionar)

Então, vejamos:

Para colocar um menu suspenso em seu blog basta copiar e colar este código em um gadget HTML.

<form>
<select NAME="links"
onChange="top.location.href=this.form.links.options
[this.form.links.selectedIndex].value">
<option SELECTED>Selecione
<option VALUE="ENDEREÇO DO LINK">NOME DO LINK
<option VALUE="ENDEREÇO DO LINK">NOME DO LINK
<option VALUE="ENDEREÇO DO LINK">NOME DO LINK
</select>
</form>

Para inserir mais links no seu menu, continue acrescentando a tag abaixo (antes de </select>):

<option VALUE="ENDEREÇO DO LINK">NOME DO LINK

Você poderá, ainda, trocar o nome (Selecione) por um outro de sua escolha, como, por exemplo, Selecionar, Categoria, ......, etc.

2 - Links em Menu Suspenso com Botão

Uma outra variação do código é a que utiliza um botão para acessar o link selecionado.

Para utilizá-lo, formate o código abaixo e copie ecole-o em uma gadget HTML/Java Script no seus elementos de página:

<form name="form1" method="post">
<select style="WIDTH: 169px" name="dd1" size="1">
<option ; value=""/>Links Favoritos
<option VALUE="ENDEREÇO DO LINK">NOME DO LINK
<option VALUE="ENDEREÇO DO LINK">NOME DO LINK
<option VALUE="ENDEREÇO DO LINK">NOME DO LINK
</select>
<input value="Ir" onclick="location = document.form1.dd1.options [document.form1.dd1.selectedIndex].value;" type="button"/>
</form>

Para inserir mais links no menu, faça como descrito acima.

Dúvidas? Pergunte nos comentários.

21 comentários:

Anônimo disse...

i agree your idea ! very nice blog

Anônimo disse...

Although from different places, but this perception is consistent, which is relatively rare point!

Anônimo disse...

Legal a dica. Gostei da opção com botão.

Kamikaze Downloads disse...

Por favor eu imploro a sua ajuda sou novo por aqui estou apenas a uma semana e meia, estou desesperado coloquei um templates por nao ter outro encontrei um que adorei, o desse blog http://furacaodownload.blogspot.com so que com outros botoes, e estou desesperado querendo trocar o meu templates ele postou o templates, eu peguei mais quando vou colocar sempre da erro e eu sei q o templates inicial foi o do vista! mas ja baixei mas de mil e nao consegui por nenhum do vista para poder modificar! ! ! Eu imploro por tudo por favor me ajuda, posta um templates que pegue do vista, me ajuda a colocar se vc quiser eu te envio os templates pra vc da uma verificado mas por favor me ajuda uns amigos meus me falaram q vc é gente boa e ajuda bastante o cara do superdownloads free. Por favor me ajuda, quero demais trocar, estou perdendo o gosto com o templates que estou, vc pode ate deixar la no final da pagina dizendo que foi vc que modificou nao ligo, mas por favor faz pelo menos o templates do Vista Theme BLACK EDITION funcionar pra eu poder trocar e fazer o resto das alterações, por favor, por favor, eu imploro! ! ! e-mail: kamikaze-downloads@hotmail.com

Willian Coutinho disse...

Pedidos de ajuda: entre em contato através do formulário de contato.

JdsanII disse...

Muito boa a dica, parabéns pelo blog! Vou tentar colocar no meu "bloguezinho" é que estou começando a aprender. Não consegui ainda formatar com submenu. Chego lá! Abração.

Anônimo disse...

Eae blz? tem como colocar um menu suspenso um do lado do outro?

ExiliaEths • Sr.Releaseee disse...

Fantástico Vim aqui procurar exatamente isso e achei sem querer mais achei o que estava procurando Obrigado Willian e parabéns pelo site brother, esta de parabéns (Y)

ExiliaEths • Sr.Releaseee disse...

Olá Willian, Estou com uma pequena dúvia amigo, fiz um exemplo rápido aqui pra você dar uma olhada por favor, gostaria de saber como posso alinhar estes menus ? olha o exemplo na imagem

http://img27.imageshack.us/img27/4180/imagemkzd.jpg

Obrigado.

Willian Coutinho disse...

Em (select NAME="links"
onChange="top.location.href=this.form.links.options
[this.form.links.selectedIndex].value") adicione a guia style e coloque valor igual para todos os menus.

(select style='width="160px"' NAME="links"
onChange="top.location.href=this.form.links.options
[this.form.links.selectedIndex].value")

Qualquer coisa, se não funcionar entre em contato novamente.

ExiliaEths • Sr.Releaseee disse...

Olá Willian, pois é brother por mais que eu tente numerações diferentes o tamanho não muda =/ mesmo assim muito Obrigado pela ajuda, estou aprendendo bastante com vocês aqui do blog, Parabéns.

Willian Coutinho disse...

O tamanho das palavras influencia no tamanho da caixinha.
Tente colocar esaços nas palavras menores ou diminuir as maiores.

Ex.: Downloads Grátis -> Down. Grátis

ExiliaEths • Sr.Releaseee disse...

É eu pensei nisto também pois meu modelo ficou um pouco grande mais agora ta certinho Obrigado mais uma vez Wiilian agradeço a ajuda brother.

Anônimo disse...

Como fazer o endereço e como criar o link para inserir no "link em menu suspenso" ?

Willian Coutinho disse...

o endereço é o famoso HTTP://ENDEREÇODOBLOG.BLOGSPOT.COM

E o o link é só formatar como descrito na postagem:

(option VALUE="HTTP://dicasplugins.BLOGSPOT.COM">Dicas Plugins

Anônimo disse...

Como fazer um permalink ? Tentei fazer um modificando a data do post para o futuro mas eu não quero que o post apareça inteiro. Quero tornar o post permanente no blog , mas apenas seu endereço na primeira página.

Ygor disse...

rsrs, antes deu fazer curso de web designer, eu tbm procurava um desses e não achava em lugar nenhum, foi qndo tive a ideia de procurar esse código no html de meu blog, ja q eu usava o menu "Arquivo do Blog", e eu usava o estilo caixa suspensa, apertei CTRL+U na pagina inicial do meu blog procurei pelo titulo Arquivo do Blog e encontri todo o código do widget, pronto copiei modifiquei apenas os titulos e links, e adicionei mais algun links... Lembrando q oq eu usei eh o q carrega altomaticamente

Willian Coutinho disse...

Ygor, nota 10 pra vc!!!

Nina disse...

Parabéns! venho buscando essa info a tempos!!!!
Muito Obrigada!

tenistarj disse...

Boa noite,

Eu consigo colocar mais de um menu suspenso?Tipo colocar para dois assuntos distintos? Pq eu coloco um e rola muito bem, porém , quando coloco dois, ai nenhum dos dois funciona.

obrigado.

. disse...

Muito legal!Amei seu blog!
Parabéns!

Postar um comentário

Envie um comentário!

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Blogger Templates