sábado, 8 de março de 2014

Como Colocar Imagem no Título de Postagem

Hey, pessoal! Tudo bem?
Recentemente, na página Peça Tutoriais, eu recebi um pedido de tutorial de como colocar imagem no  título de postagem.
Eu fiquei com vontade de postar isso não só por que é um pedido, mas por que eu também tinha vontade de ensinar isso!
Bem, vamos logo ao assunto.
Abra seu editor de imagem (usaremos o Fireworks) e crie um novo arquivo com 625 de largura por 39 de altura:
Agora vamos começar a edição.
Primeiro, faça um retângulo.
Depois disso, troque as cores para as cores do seu template.
Agora, coloque alguns efeitos... Uma boa é fazer um simples retângulo branco por cima e deixar com pouca opacidade:
Pra terminar, coloque algum objeto, pinguim, ou puffle.
Bem, agora salve.
Agora vá em algum site que hospede imagens (como Imgur ou Tinypic). Agora vá no HTML do seu blog e procure por .post h3 {. Quando achar, troque tudo de lá por este código:
.post h3 {
background-image:url(Direct Link da Imagem);
color:#ffffff;text-shadow:1px 1px 0px #ffffff;font-size:18px;font-weight:regular;
line-height:32px;
letter-spacing:-1px;padding:0 0 0px;text-align:center;height:36px;
margin-left:-5px;padding-left:10px;padding-top:3px
}
}
Onde tem Direct Link da Imagem, troque pelo direct link da imagem que você hospedou.
Depois, salve o HTML e teste!
E é isso! Espero que tenham aprendido! Até mais!
~Son Ivson

Nenhum comentário:

Postar um comentário