Tutorial - Menu Basic


Boa noite, amores >.<

Como vão os leitores mais fofos da blogosfera? Desculpem pela baboseira, é que a Tia Lari tá meio sentimental hoje. Então, eu estou superbem, consegui tirar 8,5 também na prova de português. Tipo, eu tô muito feliz! Ah, hoje eu também fiz uma outra prova de matemática, só que eu não sei se me saí tão bem quanto na anterior, mas vamos ver, vai que... Né?!

Para compartilhar a minha alegria com vocês, hoje eu resolvi trazer um tutorial exclusivo de um menu criado por mim, eba! Só peço que se vocês usarem, coloquem os créditos. Ah, e se não gostaram podem falar, viu. Esse é meu primeiro menu, e eu fiz bem simples mesmo, acho que assim é melhor que não chama muita atenção e nem fica aquela coisa berrante. Para visualizar o menu, clique aqui e siga até o gadget Menu Basic



Vamos ao tutorial. Para começar, vá até Modelo > Editar HTML e procure por: ]]></b:skin>. Quando achar, cole acima o seguinte código:


/* Créditos ao Planeta Kawaii */
menubasic {
width: 15%;
margin: 3px;
padding: 3px;
float: left;
background:#E8E8E8;
color:#ffa1c8;
font-family: Arial;
font-size: 9px;
text-align: center;
text-transform: uppercase;
border-radius: 3px;
-webkit-transition-duration: .90s;
}
classeaqui:hover {
background:#ffa1c8;
color: #E8E8E8;
border-radius: 0px;
}
Entenda...

  background:#E8E8E8; - Mude pela cor do fundo do menu que você preferir.
  color:#ffa1c8; - É a cor da fonte, mude pela cor que desejar.
  background:#ffa1c8; - Cor de fundo do menu em hover, mude também.
  color: #E8E8E8; - Cor da fonte em hover, mude se preferir.

Acho que o resto dá pra entender. Agora vamos ao passo 2. Crie um novo gadget de HTML/JavaScript e cole o seguinte código:

<a href="LINK"><menubasic>NOME</menubasic></a>
<a href="LINK"><menubasic>NOME</menubasic></a>
<a href="LINK"><menubasic>NOME</menubasic></a>
<a href="LINK"><menubasic>NOME</menubasic></a>
<a href="LINK"><menubasic>NOME</menubasic></a>

Entenda...

Onde está escrito LINK, você troca pelo link que vai querer que o menu direcione.
Onde está escrito NOME, você coloca o nome que vai querer que apareça.


Bom, espero que tenham entendido tudo, qualquer dúvida é só perguntar nos comentários.







6 comentários:

  1. Ficou fofo e básico, como diz o nome ^3^ Parabéns pela nota de português, com certeza você se dá bem na de matemática.

    Beijos ~
    kawaii-world
    garotas-cupcakes

    ResponderExcluir
  2. Bem básico, mas bonitinhu *3*

    asiansicons.blogspot.com.br

    ResponderExcluir
  3. Awwn que fofo,está nos meus favoritos,vou usá-lo no próximo layout.
    Um beijo
    http://bombasticmusics.blogspot.com

    ResponderExcluir

Fique à vontade para comentar.
Peço apenas que não xinguem ou ofendam aos outros leitores.
Obrigada.