Hey pessoal! Hoje é um dia mega especial pra mim, hoje é meu aniversáriooooo!!! 20 anos nos couros, haha. Mas nem por isso, abandonei vocês, trouxe mais um tutorial facerrímo - mas já aviso logo: TALVEZ NÃO FUNCIONE COM TODOS! Por causa do conflito de scripts e talz.
Já pensou em deixar o botão de comentários personalizada? Com uma outra cor, com uma imagem? Pois vou ensinar isso nesse tutorial!
No HTML do seu modelo, pesquise por ]]></b:skin> (digite Ctrl + F, cole o código e ache) e antes disso cole o seguinte código:
.comment-link {
float: right;
margin: 0 0 0 0;
background:#e7e7e7;
padding: 5px 10px 5px 10px;
font-family: "Arial", sans-serif;
}
.comment-link a {
color: #494949;
}
.comment-link a:hover {
color: #fff;
}
Depois é só salvar!
TRADUZINDO O CÓDIGO
float: right; (orientação - esquerta > left e direita > right)
background: #e7e7e7; (cor do fundo)
font-family: "Arial", sans-serif; (fonte)
color: #494949; (Cor do texto)
color: #fff; (Cor do texto ao passar o mouse)
COLOCANDO IMAGEM DE FUNDO
Se você quiser colocar uma imagem no fundo, no lugar da cor, faça as seguintes alterações:
background:#e7e7e7; mude por: background:" url("LINK DA IMAGEM") center no-repeat; ";
Onde tem LINK DA IMAGEM, coloque o link que você deseja que fique de fundo. Se você salvar e ver que o tamanho da imagem não ficou como desejado, mexa em padding - aumentando ou diminuindo.
No Color Hex, você encontra os códigos das cores que desejar!
Tem alguma dúvida? COMENTE! Tem alguma sugestão de post? COMENTE! Quer fazer um elogio? COMENTE, COMENTE e COMENTE!
Nenhum comentário:
Postar um comentário