27 maio 2012

Tutorial- Menu suspenso

Tumblr_m4or13uxkc1rti80po1_500_large
Oi, abajures de cabeceira sabor melão!
Faz dias que eu posto posts que estavam em rascunho, e nem sabia o que postar pra vocês :s Mas aí fui procurar um tutorial pra minha web, e achei isso super interessante! Sabe aqueles menus suspensos de histórico do site? Então, são como aqueles, aqui vai o resultado dele: 
Todos os créditos á: Blog do Palito
Tutorial *-*
Primeiro vamos personalizar! Para isso vá no seu html e procure por ]]></b:skin>.
Abaixo disso, cole:
/********* MENU SUSPENSO SELECT ***************/
select { 
background-color: #fff; /* cor do fundo */
font:12px verdana, arial, helvetica, sans-serif; /* fonte */
color: #cc0000; /* cor da fonte */
}
Personalize conforme diz ali.

Agora, vamos colocá-lo na barra lateral. Adicione um gadget JavaScript/HTML e cole nele esse código:
<form>
<select onchange="top.location.href=this.form.links.options [this.form.links.selectedIndex].value" name="links">
<option selected/>TÍTULO PRINCIPAL
<option value="linkdapage"/>Nome da page
<option value="linkdapage2"/>Nome da page2

</select>
</form>
TÍTULO PRINCIPAL é o nome. Por exemplo: Se for uma lista de doces, coloque DOCES.
As partes com linkdapage são os links. E os Nome da page são os nomes das páginas.
Exemplo: Você vai colocar a receita de brigadeiro. Coloque o link (ex.:receitadebrigadeiro.com) e coloque o nome Brigadeiro.

A cada link á mais que você colocar, adicione:
<option value="linkdapage"/>Nome da page
Depois, salve :)
Quando eu fiz no blog de teste deu bem certinho ^^
Espero que gostem do tutorial, se usarem, ou postarem em seus blogs, me creditem e creditem ao Blog do Palito!
MIL BEIJOS <3

7 comentários:

Daniele disse...

Minha verdadeira é 11, só faço 12 dia 27 de outubro kkkkkkkkk mas como ela já fez 12, não ia bota uma fonte da juventude pra ela ne aosdisaiod
bjbjjb

Daniele disse...

ah, rita pq o blog do palito ta destaque??? foi um mini concurso q n vi ou foi pq tu gosto mesmo do blog????bjbjb

Daniele disse...

deve se aquele mesmo anonimo do meu blog esse vaco

Hannyma * disse...

Olha aqui garota , eu to aqui só pra te avisar um coisa tlg? Sabe o que é ? É que seu blog é mais que perfeito ! Parabéns hein , e sabe o que mais , eu vo usa isso lá no blog ;D ! Segue meu blog @.@ ? I Love Mustache|Concurso
Bgs ! ;*

Amanda Rosa disse...

Já conhecia esse menu, muito legal *.*

bjs ~> imnanda.blogspot.com

Daniele disse...

Rita, posso pedir um tuto? Como separar as postagens? Tipo, retirar o espaço entre um post e outro... Eu via por tudo que é blog, mas nunca me interessei, agora não acho mais! Beijo =]

mari araújo disse...

Muito bom o tutorial!Seguindo aqui!
http://ladyalen.blogspot.com