quarta-feira, 13 de julho de 2011

Personalizando links das postagens

Personalizando links das postagens

Que tal deixar os links das suas postagens com uma cara diferente? Neste tutorial estarei ensinando como personalizar seus links de uma maneira bem fácil, apenas siga os passos abaixo.

1. Faça o login no blogger.

2. Entre no painel do seu blog, vá em “Modelo” – “Editar Modelo”.

3. Aperte CTRL + F e procure por ]]></b:skin>

4. Acima dessa linha cole um dos seguintes códigos que mais lhe agrade:

Links com Cor de fundo que troca quando passar o mouse

.post-body a:link {
background: whitesmoke;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
padding-left: 5px;
padding-right: 5px;
}

.post-body a:hover {
background:#FF6000;
}

Obs: A parte destacada de vermelho é a cor no link normal. A parte em azul é a cor do link quando o mouse estiver sobre ele.

Links com Cor de fundo que troca quando passar o mouse

.post-body a:link {
background: red;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;

padding-left: 5px;
padding-right: 5px;
}

Obs: A parte destacada de vermelho é a cor do fundo. A parte em azul é o código de arredondamento do fundo do link, caso queira tirar é só excluir esta parte.

Links com linha superior

.post-body a:link {
text-decoration: overline;
}

Links sublinhado

.post-body a:link {
text-decoration: underline;
}

Links Tachado

.post-body a:link {
text-decoration: line-through;
}

Escolhido o novo estilo para o link, apenas salve e pronto.

Marcadores: , , , ,