9.7.12 Ulquioorraa

Esse tutorial foi retirado da Design ON Brasil se copiar coloque fonte

Primeiro vá em HTML e clique em espandir modelos de widgets  e procure por :

h2 {

No minima original, ou seja, sem alterações feitas você pode encontrar esse trecho assim:

h2 {
margin:1.5em 0 .75em;
font:$headerfont;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color:$sidebarcolor;
}

Iremos substituir esse código por:

#sidebar-wrapper h2 {
background:url(TOPO DA SIDEBAR)no-repeat;
width:XXpx;
height:XXpx;
text-align:left;
font-weight:normal;
margin:0px 0px 0px 0px;
padding:0 0 0 0px;
font-family:XXX;
font-size:XXpx;
color:#XXXXXXX !important;
letter-spacing:1px;
line-height:XXpx;
}

#sidebar-wrapper .widget-content {
background:url(MEIO DA SIDEBAR)repeat-y;
margin:0 0 0 0;
padding:0 0 0 0;
}

#sidebar-wrapper .widget{
background:url(RODAPÉ DA SIDEBAR)no-repeat bottom;
padding:0px 0px XXpx 0px;
}

As partes em vermelho, provavelmente, você terá de mudar. Por que mudar? Bem, você terá de mudar de acordo com a sidebar que você quiser estruturar. E como eu sei qual sidebar que estou estruturando? Eu não sei, há 99% de chances do seu code ser diferente do meu.. '-'

NOTAS (LEIA ESSA PORRA, EU NÃO AS ESCREVO A TOA..

Vamos a algumas notas agora:

width:XXpx; ------LARGURA DA SUA IMAGEM
height:XXpx; -----ALTURA DA SUA IMAGEM
font-family:XXX;--DEFINA A FONTE DO TÍTULO(Arial, Calibri, Impact, etc)
font-size:XXpx;---DEFINA O TAMANHO DA FONTE(DO TÍTULO)
color:#XXXXXXX !important;--DEFINA A COR DO TÍTULO
line-height:XXpx;-----------É A PARADA QUE DEFINE SE O TÍTULO DA SIDEBAR VAI SUBIR(COM NÚMEROS NEGATIVOS) OU DESCER (COM NÚMEROS POSITIVOS

#sidebar-wrapper .widget{
background:url(RODAPÉ DA SIDEBAR)no-repeat bottom;
padding:0px 0px XXpx 0px;
}

Provavelmente quando adicionar as imagens da sua sidebar o rodapé dela vai ficar separado, portanto, substitua o "XX" por números(tenta a sorte aí..).