2.1.13

Sidebar Cute


Oiii, a pedido de uma leitora nossa, eu vim ensinar a vocês, como deixar a sidebar como a daqui do CDS. É muito simples e cute *-* Vamos ao tuto!

                                 Vá em Disign  Adicionar um gadget  HTML/JavaScript

                                                    Cole o seguinte código:

<style>
/**SIDEBAR BAD REPUTATION**/
.sidebar .widget {
box-shadow: inset 0 0 10px #eee, 0 0 2px #dbdbdb;
-webkit-border-top-right-radius: 20px;
-moz-border-radius-topright: 20px;
border-top-right-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-bottomright: 20px;
border-bottom-right-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
-moz-border-radius-bottomleft: 20px; 
border-bottom-right-radius: 20px;
width:100% !important;
background:#fff;  /** COR DO FUNDO DO GADGET **/
margin:33px 0 !important;
padding:10px;
border-top:2px solid #ebebeb;
border-right: 2px solid #ebebeb; 
border-left: 2px solid #ffd6eb; 
border-bottom: 2px solid #ebebeb; 
}
.sidebar .widget h2 {
text-align: center;
box-shadow: inset 0 0 10px #eee, 0 0 2px #dbdbdb;
border-left:2px solid #ffd6eb;  /** COR DA BORDA DE CIMA **/;
border-top:2px solid #ebebeb;  /** COR DA BORDA DE CIMA **/;
border-right:2px solid #ebebeb;  /** COR DA BORDA DE CIMA **/;
background: #ebf9ff;  /** COR DO FUNDO DA ÁREA DO TITULO **/
text-shadow:0 1px #ccc/** SOMBRA DO TITULO **/;
color:#ff94c9/** COR DO TITULO **/;
font-size:15px /** TAMANHO DO TITULO **/;
margin-top:-35px /** MARGIN **/;
margin-left:-12px /** MARGIN **/;
margin-bottom:5px /** MARGIN **/;
padding:3px;
width:40%;
overflow:hidden
-webkit-border-top-right-radius: 20px;
-moz-border-radius-topright: 20px;
border-top-right-radius: 20px;
-webkit-border-top-left-radius: 20px;
-moz-border-radius-topleft: 20px;
border-top-left-radius: 20px;}
.sidebar .widget:first-child {
  margin-top: 0;
}
/** FIM DA SIDEBAR BAD REPUTATION [bad-reputation-13.blogspot.com.br]**/
</style> 


  Se quiser a sidebar igual a daqui, é só ajustar as margens e salvar , mas se não quiser, modifique do seu gosto e depois salve.

 Mas lembre-se:  Vá em modelo  Personalizar  Avançado  Plano de fundo da barra lateral  coloque transparente nos dois.

 Desta maneira:

                             

 Salve e pronto!
Só isso
Créditos: Bad Reputation
Bjoks! 



2 comentários:

  1. Aahhh, achei muito fofa a sidebar, eu adorei a bordinha q tem na sua, a cor fica bem diferente, faz muita diferença né, hehe, adorei!!
    Beijokass
    Fer --> retardadasdanet.blogspot.com
    Feliz ano novo!

    ResponderExcluir
    Respostas
    1. É muito fofa mesmo ^^
      Obrigadaa, Bjok!

      Excluir

Oii, obrigado por comentar! Só tenho algumas regrinhas:

♥ Não comente com palavras ofensivas, não xingue e nem fale palavrões;

♥ Leia a FAQ antes de fazer qualquer pergunta;

♥ Respeite essas duas regras e você será bem vindo aqui ^^