"Colocando imagens nos links que modificam"

fonte e créditos:
templateseacessorios

Colocando imagens nos links que modificam

"Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo."


Para colocar imagens em seus links que modificam como nesse exemplo AQUI proceda da seguinte forma.

Para colocar nos posts
Vá até o HTML do seu blog e procure pelo código:
/* Comments
----------------------------------------------- */









E acima dele cole o código abaixo fazendo as modificações necessárias como cores das letras e endEreço das imagens.

/* POSTS COM IMAGENS NO LINK-----------------------------------------------
*/
.post-body a:visited {
color: #c00000;
padding-right: 13px;
background: url(AQUI O ENDEREÇO DA IMAGEM) no-repeat 100% 50%;
}
.post-body a:visited:hover {
background: url(AQUI O ENDEREÇO DA IMAGEM) no-repeat 100% 50%;
padding-right: 13px;
color:#800000;
}

Para colocar imagens que mudam na widgets(colunas)
Procure pelo código:

/* Sidebar Content----------------------------------------------- */

E cole o código abaixo depois dele.

/* IMAGENS PARA OS LINKS
-------------------------- */
.LinkList a {
color:#000000;
padding-left: 16px;
background: url(AQUI O ENDEREÇO DA IMAGEM) no-repeat;
}
/* LINKS QUE MODIFICAM
-------------------------- */
.LinkList a:hover {
padding-left: 16px;
background: url(AQUI O ENDEREÇO DA IMAGEM) no-repeat;
color:#0066cc;
}
/* LINKS VISITADOS
-------------------------- */
.LinkList a:visited {
padding-left: 15px;
background: url(AQUI O ENDEREÇO DA IMAGEM) no-repeat;
color:#00C0C0;
}
.main .widget {
margin:0 0 1.5em;
padding:0 0 1.5em;
}
.crosscol .widget{
padding:8px;
}
.main .Blog {
border-bottom-width: 0;
}





Coloque imagens pequenas.


Imagens AQUI, ou AQUI

Leia Mais ►