21/08/2014

[Tutorial] Menu de sidebar 1

Tanto amor nesta foto desu  
Oiii lasanhas ~ *u*

Tudo bom? Espero que sim, desu ~
... -É. Eu não fui á piscina, porque a minha mãe tinha algo combinado, então não pude ir ~ Só vou amanhã, e só pode ir a Joana ;A;
Eu vim aqui mostrar-vos a minha foto de perfil diwa do Google +, que kibei do Shiny, porque sou diwa c:
Mentira, vim aqui postar o tutorial do menu que estou a usar agora neste layout \o/ Mas sou diwa na mesma Me amem u-u Não, senão o Shiny mata-vos .u.
Cliquem em Ler mais... .3.




1. Modelo > Editar HTML > apertem Ctrl + F e procurem por:
]]></b:skin>
2. Acima desse código colem:
 @font-face { font-family: "silkscreen"; src: url('http://static.tumblr.com/0xqvkot/7jqmgsn0m/pf_arma_five.ttf'); }
a.menupequeno {
background-color: #e6e6e6; /* cor do fundo */
padding-top: 3px;
padding-bottom: 3px;
display: inline-block;
width: 40px;
font-size: 8px;
font-family: silkscreen;
text-transform:  uppercase;
text-align:center;
border: 1px solid #d1d1d1; /* cor da borda */
letter-spacing: 1px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
box-shadow: inset 0 0 5px #e3e6e7, 0 0 1px #b6b6b6; /* cor das sombras da 'caixa' */
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
text-shadow: 0 1px 0 #ebebeb; /* cor da 'sombra' do texto */
}
a.menupequeno:hover {
border: 1px solid #f994aa; /* cor da borda hover - quando se passa o mouse */
background-color: #ffc3d0; /* cor do fundo hover */
text-decoration: none;
box-shadow: inset 0 0 0px #e3e6e7, 0 0 0px #b6b6b6; /* cor das sombras da 'caixa' hover */
text-shadow: 0 1px 0 #fbdae1; /* cor da 'sombra' do texto hover */
opacity: 0.8;
}
 3. Edita com as cores que queres.

4. Esquema > Adicionar uma mini aplicação > HTML/Java Script e colem lá isto:
<center>
<a class="menupequeno" href="LINK">NOME</a>
<a class="menupequeno" href="LINK">NOME</a>
<a class="menupequeno" href="LINK">NOME</a>
<a class="menupequeno" href="LINK">NOME</a>
</center>
Entendendo o código:

NOME -->  O nome que queres que apareça no menu. Por exemplo: home, parceria...
LINK --> O link da página/site para onde queres que o menu seja redireccionado. Por exemplo: www.sou-uma-lasanha-dlç.com ...

Para adicionar uma nova 'caixinha' colem antes de </center>:
 <a class="menupequeno" href="LINK">NOME</a>
Créditos: www
 Espero que tenham gostado \o/ Alguma dúvida, deixem nos comentários ^^

Kissus >3< ~ Sayonara :3

6 comentários:

  1. Bem simples e fica muito bom no lay.
    Ótima postagem.
    Abraço.

    ResponderEliminar
    Respostas
    1. Oii Diego-kun \o/
      Sim sim, eu adoro este menu ^^
      Arigato :3

      Kissus >3<

      Eliminar
  2. Yooo tudo bom!?
    Aiaiai piscina, saudades verão, calor, sol, piscina, sorvete, mar, piscina...T-T
    Estou contando os dias para sair do inverno e entrar na primavera para ver se finalmente esse frio vai embora!
    Enfim, um ótimo tuto, esse menu é simples e fofinho, combina com tudo >///<
    Kiss

    ResponderEliminar
    Respostas
    1. Oii Hinata-chan! Sim e com você? :3
      As minhas férias estão quase a acabar ÇAÇ
      Aqui a próxima estação é Outono /depressão ;A;
      Concordo contigo *u*

      Kissus >3<

      Eliminar
  3. Já conhecia o menu e acho ele super fofo *u*
    Chu ~ @paradise-of-bunnies

    ResponderEliminar

Obrigada por vires comentar!!
P.S: Sou de Portugal, alguma coisa que não percebas avisa u v u

❥Respondo a todos os comentários assim que puder.
❥Podes por o URL do teu blog no fim mas tens de falar do post.
❥Podes pedir tutoriais e utilitários.
❥Podes falar palavrões (como eu falo ás vezes) mas não ofendas ninguém com eles, ok?

♣Não aceito "Seguindo, segue de volta?", só sigo se gostar do blog.
♣Comentários insultosos para com alguém não serão publicados.
♣Não utilizes o teu comentário para publicitar o teu blog.
♣Os pedidos de parceria só são aceites na devida página(com algumas excepções).

♥Podes usar estes bonequinhos:
=((•̪●))= ๑(•ิ.•ั)๑ ٩(●̮̮̃•̃)۶ ε(●̮̮̃•̃)з ٩(×̯×)۶̿ ┌∩┐(◣_◢)┌∩┐ ⊙▂⊙ ⊙0⊙ ⊙︿⊙ ⊙ω⊙ ⊙▽⊙ ⊙﹏⊙ ⊙△⊙ ◑▽◐ ◑ω◐ ◑﹏◐ ●︿● ●ω● ●﹏● ≧▂≦ ≧︿≦ ≧ω≦ ≧﹏≦ ≧▽≦ >︿< >ω< >﹏< >▽< ≡(▔﹏▔)≡ (¯▽¯;) <(“”"O”"”)> (-__-)b (;°○° ) \( ̄︶ ̄)> <( ̄︶ ̄)/ (/≧▽≦/) \(≧3≦)/ \(≧ω≦)/ o(≧ω≦)o o(≧o≦)o ㄟ(≧◇≦)ㄏ ╮(╯▽╰)╭ ╮( ̄▽ ̄)╭ (~o ̄▽ ̄)~o ~ 。。。(~ ̄▽ ̄)~[] (╯-╰)/ (*^3^) 'U_U ♪ ♥ ஐ ▲☼゚ ♣ (๏̯͡๏) †