Coloque imagens por trás de seus widgets

Este código é bastante interessante, você pode colocar imagens por trás de seu wingets, como imagens atrás do “Arquivo, Categorias” ou qualquer outra que você tiver em seu blog. Para isso siga o tutorial abaixo.

Salve o Template > localize <div id='sidebar-wrapper'> e em baixo você verá uma pequena lista começando com: <b:widget id

Nessa lista (exemplo abaixo) cada widget tem um nome exclusivo, exemplo:

<b:widget id='Label1' locked='false' title='CATEGORIAS' type='Label'/>

Label1 é o meu único ID. Pegue esse ID (o seu) e substitua por cada widget que você quiser colocar uma imagem.

Faça um novo grupo, como este (abaixo) na sua folha de estilo, para ficar fácil de encontrar. (não é obrigatório)

/* widgets
----------------------------------------------- */

Agora, para cada item que você deseja adicionar, adicione uma linha como essas linhas abaixo. (note que nesse código abaixo, você teria três imagens em três widget. Ex: em Label você tem uma imagem, em BlogArquivo outra e assim por diante)

#Label1{
background: #fff url(URL DA IMAGEM) no-repeat;
}
#BlogArchive1{
background: #fff url(URL DA IMAGEM) no-repeat;
}
#Text1{
background: #fff url(URL DA IMAGEM) no-repeat;
}

As categorias acima destacado em negrito você troca pelos seus e lembre-se das URL. Você pode fazer com quantos widget você quiser é só você colocar o ID e a URL da imagem.

Essa dica eu testei e funciona só o que você precisa lembrar também é do tamanho da imagem, eu fiz num blog teste veja aqui: Baixe-templates está em Categoria, Arquivo e Licença dos Templates.

Qualquer dúvida deixe um comentário.