Olá denovo, leitores!
Agora eu trouxe um menu, super lindo para vocês ele se chama ''Abracadabra'' Tô trazendo do Sweet Poison, ele é uma tem um fundo aquamarine, ai quando passa o mouse sobre, e vem um sombra para a letra do lado, achei ele lindo, simplesmente me encantei, se quiser ver a live preview dele Clique Aqui... Vamos ao tutorial?
~ Enjooy ~
1. Vá no Blogger, vá em Modelo> Editar HTML.
2. Clique em 'Prosseguir'. Tecle Ctrl+F e procure por:
]]></b:skin>
3. Logo acima dessa tag, cole:
.abracadabra a{
background: #f7f7f7;
margin: 3px;
padding: 3px;
display: block;
font-size: 9px;
border-radius: 3px;
text-transform:uppercase;
font-size: 11px;
font-family : 'Ubuntu Mono';
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
-o-transition: all 0.8s ease-out;
box-shadow: 0px 28px 0px #94d0cf inset;
text-indent:10px;
color:#fff;
text-shadow: 1000px 0 1px #94d0cf;
overflow:hidden;
}
.abracadabra a:hover {
color: #94d0cf;
padding-left: 29px;
padding-right: 11px;
box-shadow: 0px 0px 0px #94d0cf inset;
text-shadow: 0px 0px 1px #14d0cf;
}
4. Tecle Ctrl+F novamente e procure por:
<head>
5. Logo abaixo dessa tag, cole: (por causa da fonte personalizada)
<link href='http://fonts.googleapis.com/css?family=Ubuntu+Mono' rel='stylesheet' type='text/css'/>
6. Salve.
7. Vá para Layout. Adicione um novo gadget de HTML/Javascript e cole:
<div class="abracadabra">
<a href="URL">Link</a>
<a href="URL">Link</a>
<a href="URL">Link</a>
<a href="URL">Link</a>
<a href="URL">Link</a>
<a href="URL">Link</a>
<a href="URL">Link</a>
<a href="URL">Link</a></div>
8. Edite as partes em negrito e salve.
É isso, boa noite e tenham bom sono, e dormem com Deus.. Fuii <3
Oi fofa
ResponderExcluirSabe que muitos blogs usam o gadget de páginas na guia superior,então eu queria saber se você pode fazer um tutorial de como personalizar ele como os desses blogs
http://sobreeuestaaqui.blogspot.com.br/
http://kenblogdobrasil.blogspot.com.br/
Esses são uns exemplos