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:

costume jewelry disse...

i agree your idea ! very nice blog

我爱掼蛋网 disse...

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

Henrique Silva 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.

JK 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 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 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 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 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 Marques Heradao 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.

Josi 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