No post anterior vimos como colocar separadores entre as postagens, e agora veremos como colocar separadores entre os gadgets.
Podemos usar bordas:
Ou imagens:
Para isso vamos em Design > Editar HTML;
Se quiser uma borda, cole antes de ]]></b:skin> o seguinte:
.column-right-outer .widget, .column-left-outer .widget {
border-bottom:4px solid #000;
padding-bottom:20px;
}
Se quiser uma imagem, substitua o código acima por este:
.column-right-outer .widget, .column-left-outer .widget {
background: url(URL da imagem)no-repeat 50% 100%;
padding-bottom:70px;
border:0;
}
Basta colocar a URL da imagem no local indicado, se a imagem ficar pequena aumente o valor 70px;
No caso das bordas, para personalizá-las basta alterar os valores em :
border-bottom:4px solid #000;
Onde 4px é a grossura, solid o tipo de borda, que pode ser trocado por dotted, dashed, double, groove, ridge, outset, ou inset, e #000 é a cor da borda.
Em padding-bottom:20px; podemos alterar o valor da distância entre os gadgets.