Menu Para Marcadores #4

Boa Noite!!! Hoje temos mais um modelo de menu para marcadores com algumas cores diferentes para que vocês escolham o que melhor se adapta ao seu layout ou ao projeto que você esta criando. Esse menus são sempre uteis e essencial para fazer um layout personalizado bem legal, então espero que vocês aproveite esses menus.

Como os menus anteriores esses também foram retirados do blog Kawaii World, que esta sem ser atualizado faz um bom tempo, mas mesmo assim seus tutoriais ainda são bem uteis e legais. Para conferir o Preview clique aqui.

Tutorial

1° Passo: Vá em Modelo > Editar HTML.

2° Passo: Procure por(Usando Ctrl+F): ]]></b:skin>

3° Passo: Cole acima de "]]></b:skin>" o código do modelo escolhido:
Modelo 1:

#tags3{
background-color: #ffeef3;
width: 54px;
height: 11px;
float: left;
font-family: verdana;
font-size: 11px;
padding: 2px 0 6px 0;
text-align: center;
margin-left: 3px;
border: 1px dashed #eab5c5;
margin-bottom: 3px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: inset 0 0 10px #fbe6ed;
-moz-box-shadow: inset 0 0 10px #fbe6ed;
box-shadow: inset 0 0 10px #fbe6ed;
color: #f7b0bf;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}

Modelo 2:

#tags3{
background-color: #dbe4ee;
width: 54px;
height: 11px;
float: left;
font-family: verdana;
font-size: 11px;
padding: 2px 0 6px 0;
text-align: center;
margin-left: 3px;
border: 1px dashed #afbdcd;
margin-bottom: 3px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: inset 0 0 10px #d2dce7;
-moz-box-shadow: inset 0 0 10px #d2dce7;
box-shadow: inset 0 0 10px #d2dce7;
color: #a5b3c2;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}

Modelo 3:

#tags3{
background-color: #f7f0de;
width: 54px;
height: 11px;
float: left;
font-family: verdana;
font-size: 11px;
padding: 2px 0 6px 0;
text-align: center;
margin-left: 3px;
border: 1px dashed #dbcea9;
margin-bottom: 3px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: inset 0 0 10px #f5eed9;
-moz-box-shadow: inset 0 0 10px #f5eed9;
box-shadow: inset 0 0 10px #f5eed9;
color: #d8c899;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}

Modelo 4:

#tags3{
background-color: #fae7d1;
width: 54px;
height: 11px;
float: left;
font-family: verdana;
font-size: 11px;
padding: 2px 0 6px 0;
text-align: center;
margin-left: 3px;
border: 1px dashed #f2c692;
margin-bottom: 3px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: inset 0 0 10px #f9e4cc;
-moz-box-shadow: inset 0 0 10px #f9e4cc;
box-shadow: inset 0 0 10px #f9e4cc;
color: #e2b179;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}

Modelo 5:

#tags3{
background-color: #eceede;
width: 54px;
height: 11px;
float: left;
font-family: verdana;
font-size: 11px;
padding: 2px 0 6px 0;
text-align: center;
margin-left: 3px;
border: 1px dashed #d3d7af;
margin-bottom: 3px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: inset 0 0 10px #ebeddb;
-moz-box-shadow: inset 0 0 10px #ebeddb;
box-shadow: inset 0 0 10px #ebeddb;
color: #c5ca94;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}

Modelo 6:

#tags3{
background-color: #e7e1eb;
width: 54px;
height: 11px;
float: left;
font-family: verdana;
font-size: 11px;
padding: 2px 0 6px 0;
text-align: center;
margin-left: 3px;
border: 1px dashed #c8b8d0;
margin-bottom: 3px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: inset 0 0 10px #e4dde8;
-moz-box-shadow: inset 0 0 10px #e4dde8;
box-shadow: inset 0 0 10px #e4dde8;
color: #b6a1c1;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}

4° Passo: Salve as Alterações.

5° Passo: Coloque nos Gadgets em que deseja colocar o menu:

<a href="seu link" id="tags3">Texto</a>
<a href="seu link" id="tags3">Texto</a>
<a href="seu link" id="tags3">Texto</a>

6° Passo: Altere os locais indicados e salve.

Espero que tenham gostado desse modelo de menu para marcadores *-*

Lembrando que todos eles são do Kawaii World.