Menu para créditos #1 - Imagine

"Ser gay não é pecado. Ser preconceituoso sim." - Gabriela A. Trevisol.

Hey guys, como estão? Eu vou bem, graças a Deus *O* Adivinhem? Eu aprendi a usar PSD's de efeito no Photoshop, acreditam? Eu vi uns bem legais no KW e fui correndo tentar aprender. Gente, é tudo tão difícil de fazer lá que uma besteirinha dessas que eu aprendi já fico feliz õ/

Bom, lembram que eu tinha dito que traria um Menuzinho para créditos pra vocês? Aqueles que a gente geralmente coloca no final de certo Gadget de Agradecimentos, Fins, Good Bye, etc? Vejam a Prévia dele abaixo:

LIVE PREVIEW

Gostaram? É fofinho não é? Eu o chamei de Imagine pensando na música perfeita do Jonh Lennon. Bom, se quiser aprender, basta continuar lendo a postagem.

No Painel do Blogger, clique no Nome do seu Blog - Modelo - Editar HTML - Procure por: ]]></b:skin>. Quando achar, cole o código abaixo (de personalização do menu) antes desse, fazendo as devidas alterações no fundo e nas bordas.

creditos {

background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc5o77-69-JuInFNhu1ahIcGtMsCfv5kJcUkyIX-NqL_lMCWUpC_ukeUfI-_8asBKt6M31qiP7aLm_ERiNBIy_jJyqe4fuhA3Eg_yVKZMsCKemyi-MdQhBVqbHcEP2W4U3rdh_f55qtmk/s1600/faixa+fofa+2.png)no-repeat; /* Fundo do menu, se não quiser imagem, troque tudo por background: #COR */
opacity: 0.50; /* Opacidade do Fundo, não retire */
padding: 4px; /* Espaço interno do menu */
border-radius: 5px; /* Arredondamento das Bordas */
border-bottom: 3px solid #A27DA8; /* Borda na parte de baixo do menu */
border-right: 3px solid #A27DA8; /* Borda na parte direita do menu */
display: inline-block;
font-size: 9px; /*Tamanho da Fonte */
font-family: 'Tahoma';  /*Fonte do Menu */
-o-transition-duration: .70s;
-ms-transition-duration: .70s;
-moz-transition-duration: .70s;
-webkit-transition-duration: .70s;
width: 2%; /* Tamanho de cada menu */
text-align: center;
cursor: pointer;
color: #000000; /* Cor da letra do Menu */
}
creditos:hover {
opacity: 0.99; /* Cor de fundo do Menu */
border-bottom: 3px solid #DBB7DB; /* Borda na parte de baixo do menu hover*/
border-right: 3px solid #DBB7DB; /* Borda na parte direita do menu hover*/
color: #fff; /* Cor da letra do menu hover*/
}

Pronto? Depois de colar o código e fazer as alterações, agora você precisa aplicar o código do próprio menu, para isso mude para a Ala Layout do lado esquerdo da tela - Adicionar um Gadget - HTML/JavaScript e cole o código abaixo dentro da caixinha colocando os links que se pedem.

<center>
<a href="LINKDOBLOG1"><creditos>01</creditos></a>
<a href="LINKDOBLOG2"><creditos>02</creditos></a>
<a href="LINKDOBLOG3"><creditos>03</creditos></a>
</center> 

Fácil não é? Não se esqueça de creditar o próprio POM se usar, certo? Bom, acho que na próxima postagem irei trazer alguns materiais do Ian, se quiserem, ainda da temo de pedir algo na Ask AQUI, ok? Fiquem com Deus!