Oie...no layout anterior usei um menu colorido bem simples de fazer e agora o compartilho com vocês. Eu o fiz todinho com html e css, baseado nesse outro tutorial.
Para usar é só colar esse código em um novo gadget HTML/JavaScript, que aconselho que fique abaixo do cabeçalho:
<style>
a.mc {/* primeira cor */
width: 100px;/* largura */
height: 100px;/* altura */
color:#C0F6F6;/* cor do texto */
font-family: 'Rouge Script', cursive;/* tipo de fonte */
font-size: 75px;/* tamanho da fonte */
text-shadow: 1px 2px 3px #1CD4D5;/* sombra do texto */
padding-left:5px;
padding-right:5px;
padding-top: 2px;
padding-bottom: 2px;
-webkit-transition:2s;
}
a.mc:hover {/* muda a cor do texto quando passar o mouse */
text-decoration: none;
color: #C1E3F2;
-webkit-transition:2s;
}
a.mc1 {/* segunda cor */
width: 100px;
height: 100px;
color:#FADDE9;
font-family: 'Rouge Script', cursive;
font-size:75px;
text-shadow: 1px 2px 3px #FF73A5;
padding-left:5px;
padding-right:5px;
padding-top: 2px;
padding-bottom: 2px;
-webkit-transition:2s;
}
a.mc1:hover {
text-decoration: none;
color: #fcc2c2;
-webkit-transition:2s;
}
</style>
<div style="position:absolute;width:100%; height: auto; margin-left: 0px; top: 400px;">
<a class='mc' href='#'>Home <span style='font-size: 12px'>♥</span></a>
<a class='mc1' href='#'>About <span style='font-size: 12px'>♥</span></a>
<a class='mc' href='#'>F.A.Q <span style='font-size: 12px'>♥</span></a>
<a class='mc1' href='#'>Afiliados <span style='font-size: 12px'>♥</span></a>
</div>
Nos códigos já coloquei o que cada um faz; ali onde tem um top: 400px, você muda o valor conforme precisar distanciar o menu do topo, quanto maior o número, mais distante do topo. Onde tem "#", mude para um link, troque os nomes Home, About, F.a.q, Afiliados, pelos nomes dos links que adicionar. A fonte usada é a Rouge Script, do Google Web Fonts. Espero que gostem.
Hola :) ...
ResponderExcluirPodrías hacer un tutorial de como poner los botones de compartir personalizados que hay debajo de cada entrada ? http://i1355.photobucket.com/albums/q710/Leyfzalley_Gonzalez_Melendez/Captura_zps67534961.png
Hola!! Estos botones ya estaban en la plantilla (la descargue aqui); cambié las imágenes; pero voy a hacer un post sobre cómo poner botones personalizados ok?
ExcluirBesitos.
Nossa Roberta até seguidores de outros países , que chique te acompanho desde o começo de 2013 mais tenho Google + a pouco tempo então agr eu te sigo oficialmente , lindoooo o seu template sempre aprendendo com tigo, usei este tutorial no meu template e ficou maravilhoso , só que eu fiz personalizado para outra pessoa !!! Espero que ela mantenha os créditos do final ( eu coloco o endereço dos blogs q me ajudaram e meu crédito porque algumas coisas são minhas ... rs ta chic em !!!!
ExcluirObrigada Alice. Eu fico muito muito contente que esteja aqui também e que sejam úteis os tutoriais :3 Bju ♥
ExcluirMUCHAS GRACIAS :)
ResponderExcluirAmei vou ver se dá certo no meu.. ♥
ResponderExcluir