Modelo para Sidebar.

Bom Dia leitores. Vocês devem estar achando super estranho estar postando hoje, correto? Minha escola está de recesso pois amanhã é dia de São Jorge. Gostaria de avisar novamente que já enviei o convite para a ganhadora a vaga para postadora. O convite tem validade, então espero que aceite u3u. Vocês poderiam pedir algo na Ask, estou realmente sem algo para postar. Isso está a incomodar-me por demasiado... Ah! E obrigada por irem ver o blog que recomendei na última postagem. u3u


Como não sabia o que postar, fui cançar algo pela web. Entrei no blog da Hokuto e vi um modelo para sidebar muito fofinho com fonte pixel. Se quiser vê-lo, clique aqui. Ele é bem fofinho e simples. Bem fácil de colocar também.
  1- Para colocar esse modelo deluxe na sidebar, basta procurar por ]]> e acima dessa tag, colar o seguinte código.
.sidebar h2{
background: #cor_do_fundo_normal;
color: #cor_da_letra_normal;
height: 15px;
padding: 3px;
width: largura_do_títulopx;
font-size: 8px;
text-align: right;
border-right: 5px solid #cor_da_borda_normal;
font-family: "silkscreen";
-webkit-transition-duration: .80s;
}
.sidebar h2:hover{
background: #cor_do_fundo_hover;
border-right: 5px solid #cor_da_borda_hover;
-webkit-transition-duration: .80s;
}
Destaquei em itálico as partes essenciais a serem alteradas. São coisas simples. Agora, ainda acima de b:skin, cole o código que fará a letra pixels funcionar.
@font-face { font-family: "silkscreen"; src: url('http://static.tumblr.com/0xqvkot/7jqmgsn0m/pf_arma_five.ttf'); }
Para aprender a colocar letra pixel no gadget da sidebar, venha neste link e execute o tutorial segundo tutorial. Também é bem fácil e super simples. momento divulgação
Espero que peçam rsrs'
/Ana

15 comentários:

  1. huhu ! finalmente achei um modelo ...nem sabia que o nome era esse lol , mas ele se aplica em todas as gadgets ? :p

    ResponderExcluir
    Respostas
    1. Que bom que gostou!
      - Assim que coloca-o, ele automaticamente se aplica a todos os títulos da sidebar.

      Excluir
  2. Que modelo perfeito! *-*
    Amei, favoritei, com certeza vou usar em um próximo layout >3<
    Beijo
    ill-help-you.blogspot.com

    ResponderExcluir
  3. Que lindo ! Fica muito fofinho mesmo. Muito luxo ^^

    Nhackt

    Crazycherry-sa.blogspot.com

    ResponderExcluir
  4. HAHA, É lindo esse modelo, luxuoso mesmo *-*
    Obrigado por me colocar nos Afiliados Clara, õ/
    Bjão :*
    http://blog-part-of-me.blogspot.com/

    ResponderExcluir
  5. Muito lindo mesmo *u*

    blends-factory.blogspot.com.br Pode seguir? é novo! ^^

    ResponderExcluir
  6. Muito lindo e super diferente!
    http://garotadabolsa.blogspot.com.br/

    ResponderExcluir
  7. Flor,amei este modelo super diferente,mas só que a cor do fundo não está funcionando ,por exemplo eu coloco #fff no background e não pega,fica transparente @-@ Ajude-me ç.ç

    ResponderExcluir
    Respostas
    1. Mas o código: #fff, é a cor branca, anjo. Coloque #000 e verá que fica na cor preto. Bem, espero que consiga.

      Excluir