Menu plush em 7 cores.

Olá meus bolinhos de queijo porpurinados (〜^∇^)〜. Tudo beleza com vocês? E como vai o final de semana? Eu estou bem, e o meu final de semana está sendo ótimo. Vocês acreditam que o blog já vai passar a meta de trinta postagens? Eu estou feliz, e já estou pensando na meta de cinquenta postagens! E sim, eu sou um pouco exagerada e muito agitada, mas é que vocês não imaginam o quão realizada eu estou nesse momento! 

Hoje eu queria trazer algum utilitário HTML e resolvi passar um código do tumbrl para o blogger. Tomei também a liberdade de disponibilizar pra vocês mais seis cores diferentes. Ele é bom porque pode ser usado na sidebar e também como menu para o topo, ou como nós usamos aqui (abaixo do cabeçalho). A preview está depois do leia mais. ~Enjoy?


O link home significa como ele fica em hover. E sim, ele é grudadinho e não fica em caixas como geralmente vemos.

Para instalar ele no seu blog/site, siga as seguintes instruções: No HTML, tecle ctrl+f e procure por ]]></b:skin> e cole acima dele o seguinte código:
.menu-plush{
background: url('http://static.tumblr.com/8qw1tik/3V0mgmnt3/menuu.png');
width: 250px;
height: 35px;
line-height: 35px;
text-transform: uppercase;
-moz-box-shadow: 0 0 5px #ccc;
-webkit-box-shadow: 0 0 5px #ccc;
box-shadow: 0 0 5px #ccc;
text-shadow: 0 1px 1px #c23c63;
}
.menu-plush a {
color: #fff;
border: 1px dashed #fff;
padding: 7px;
margin: 3px;
-webkit-transition-duration: 0.3s;
}
.menu.plush a:hover {
-moz-box-shadow: inset 0 0 5px 5px #e47ea2;
-webkit-box-shadow: inset 0 0 5px 5px#e47ea2;
box-shadow: inset 0 0 5px 5px #e47ea2;
}
Na linha onde esta escrito backgroud: url coloque o link do fundo do seu blog. Ajuste a cor do texto de acordo com o back que escolher!


 OBS: A sétima cor, que é a que aparece na preview já esta configurada no código anteriormente dado.

 CÓDIGO DO GADGET HTML
 
Abra um novo gadget javascrip e cole o seguinte código. Mude aonde se pede.

<div class="menu-plush">
<a href="LINK">home</a>
<a href="LINK">GOODIES</a>
<a href="LINK">ask</a>
<a href="LINK">TUTORIAIS</a>
<a href="LINK">CRÉDITOS</a></div>
</div>
Menu original do tumbrl:  
É permito a reblogar, mas somente com os créditos linkados. O mesmo para quem o usar.

Nenhum comentário:

Postar um comentário