Modelo de Sidebar + Faixinhas


Yoo ~~

Depois que eu troquei de template eu recebi muitos pedidos. Esse será o ultimo post de hoje e amanhã eu continuo postando !

Bom pediram que eu postasse como colocar aquela faixinha, que agente usa aqui no blog na sidebar, então eu vou postar ! Aviso: Nada de fazer igual agente aqui viu pessoal u.u

Mais emfim vamos ver !

Enjoy ~~
Procure por
/* Widgets
Abaixo cole :
.sidebar .widget { text-align: center;
   border-bottom: 2px solid $(widget.border.bevel.color);
  padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
  margin: 30px 0;
Background: #ffffff;
box-shadow: inset 0 0 40px #eee, 0 0 6px #ccc;
border-bottom: 10px solid #aca8e8;
}
.sidebar h2 {
font-family: Century Gothic; /*Nome da fonte*/
text-transform: uppercase;
font-size: 20px; /*Tamanho da fonte*/
color: #fff; /*Cor da fonte*/
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEip9oLyuMPqHWl97NvCUM_oZMzSmNY9IQ-udydrlXp39EVpg3iL7ODhVL6FDA0lt9WbuQJ6ghC40u6L49vn_39uI6Pp-prZ8-Vbl8tyIahpVBSKCQ1UkoYK-Vo-nZzX_CI0OeNXAabn0F0/s1600/74.png) no-repeat center; /*Sua faixa e posição*/
height: 16px;/*Altura da imagem*/
line-height: 6px;
text-align: center; /*Alinhamento do texto*/
margin-top: 0px;
margin-left:-36px ;
text-shadow:0 2px 2px #e07eb6;
margin-bottom:20px ;
margin-right: -4px;
padding:21px;
width:112%;
-webkit-transition-duration: .40s;
}

Você pode trocar os locais que eu destaquei ! Mude a url da faixinha que você quer, e mude a cor da barrinha que fica embaixo da gadget da sidebar !

Como prometido algumas faixinhas:

Créditos ao blog Kawaii World

30 comentários

  1. Olá, boa noite!
    Parabéns pelas delicias do blog em (:
    to começando agora e amei o teu blog, belo ritmo de inspiração.
    Beijos
    http://aosdezesseisanos.blogspot.com.br/

    ResponderExcluir
  2. onw muito obrigada estar linda

    ResponderExcluir
  3. Adorei, vou usar no meu futuro lay :)

    ResponderExcluir
  4. São tão divas essas faixinhas! Amo elas. *3*
    Thiago te mandei um e-mail, vê se chegou.

    ResponderExcluir
  5. Nossa, amei, acho que vou usar! u.u
    Poderia pedir um tuto? Como colocar um tracijado em baixo do titulo do blog?
    Obrigada
    Bjos
    Biti's Place

    ResponderExcluir
    Respostas
    1. Divisória abaixo do título

      Painel> Modelo> Editar HTML> Marque a opção "expandir modelos de widgets" e pesquise por:

      <div class='post-header'>

      coloque ACIMA dele o seguinte código:

      <div style="border-top: 1px dashed #000000"></div>

      Excluir
  6. Muito bonito! Eu já uso essa faixinha no título da minha sidebar!
    teenage-dreams2

    ResponderExcluir
  7. Anônimo19.11.12

    Aain que lindas as faixinhas ameii s2

    ResponderExcluir
  8. Achei uma graça >.<
    Obrigada

    ResponderExcluir
  9. Olá meu nome é Kimya Kwang sou da Girl Band G1T, adorei seu blog, estou seguindo, poderia seguir devolta? Obrigada!
    http://kpop-idol-kimya.blogspot.com.br/

    ResponderExcluir
  10. Adorei, estou usando,
    só modifiquei alguns detalhes *u*
    Obrigada viu? Ajudou muito, seguindo aqui ;3

    goodies-foor-you.blogspot.com

    ResponderExcluir
  11. Eu tive que colocar outra imagem tudo bem? É que eu já tinha feito uma imagem, e demorou tanto (Quase 1 hora)

    ResponderExcluir
  12. Sonho se tornando realidade obg ^^ vou botar no meu blog vou creditar ;)

    ResponderExcluir
  13. Amei seu tutorial ^^ eu usei ele e peguei uma faxinha muito obrigada *-* você salvou minha pele rsrs

    ResponderExcluir
  14. Oiew não consegui aparece assim widget.border.bevel.color); ala que esse tag e variavel e não consigo tem como me ajudar?

    ResponderExcluir
  15. Anjoo, como arruma a largura da sidebar? Ficou muito fininha :c

    ResponderExcluir

- Se quiser um post, peça na ask !

- Se não gostou, não use palavras ofensivas. Ninguém precisa rebaixar-se a tanto para expressar a opinião.

- Leio todos os comentários, respondo e retribuo sempre que o tempo deixa.