Modelo para Sidebar

Yoo ~~ 

Um leitor pediu para que eu ensinasse como eu uso a sidebar desse jeito. O titulo da sidebar é bem legal né, parece que quase nenhuma palavra, vai caber bem nele. Porém eis que tem a parte mais legal, ele se adequada com qualquer palavra. Eu encontrei esse modelo lá no Kawaii World, então se usarem, creditem ele.

Veja um exemplo:

Vamos lá ? 

Vá no HTML do seu blog e procure por .sidebar .widget, o que estiver lá você apaga e no lugar cole:

.sidebar .widget {

-webkit-border-radius: 0px;

-moz-border-radius: 0px;

border-radius: 0px;

padding-bottom: 12px;

margin: 0px 0;

Background: #ffffff;

margin-top:41px;

padding:11px;

box-shadow: 1px 2px 3px 1px #e1dddd;

}

Indo para o próximo código, procure por .sidebar h2, faça o mesmo processo, apague o que estiver lá e cole no lugar:

.sidebar h2 {

text-align:center;

background-color: #ee91af;

-moz-box-shadow: inset 0 0 10px #d85882;

-webkit-box-shadow: inset 0 0 10px #d85882;

box-shadow: inset 0 0 10px #d85882;

padding:2px;

-webkit-border-top-left-radius: 4px;

-webkit-border-top-right-radius: 4px;

-moz-border-radius-topleft: 4px;

-moz-border-radius-topright: 4px;

border-top-left-radius: 4px;

border-top-right-radius: 4px;

display:inline;

float:right;

margin-top:-38px;

}

Prontinho, apenas edite as cores, e a sua sidebar estará formada.