23/04/2013

Tutorial - Fonte pixel na sidebar



Oi povo u3u'
Primeiramente, quero dizer que escolhi a postadora (sim, é uma menina), ela tem uma boa disponibilidade para postar no blog também, o que é ótimo. Ainda não entrei em contato com ela, mas assim que parar de mexer no PC, ainda terei que fazer o dever, então, só depois eu poderei me comunicar com la pessoita -q
E eu a explicarei como faz as ilustrações daqui u_u'

Bem, lá estava eu, fuçando los bloguitos que acho por aí, quando encontro um que tem um tutorial muito bom, e que eu acho que deixa a sidebar do blog bem bonita, até porque eu gosto bastante de fontes pixel u-u (e no próximo layout, eu irei usar)
Aprendi o tutorial no blog Thing HTML, então créditos à ele. 
(Um exemplo de blog que usa fonte pixel na sidebar é o IIRTW)

Lets...go?


Primeiro, procure por .sidebar .widget {, e selecione desde .footer-inner .widget, .sidebar .widget até a }. Após selecionar, apague, e cole isto no lugar:

.footer-inner .widget,
.sidebar .widget {
  font-family: "silkscreen";
font-size: 8px;
  color: $(widget.text.color);
}

Agora, para fazer a fonte pixel funcionar, procure por ]]></b:skin>, e acima disso, cole:

@font-face { font-family: "silkscreen"; src: url('http://static.tumblr.com/0xqvkot/7jqmgsn0m/pf_arma_five.ttf'); }

Pronto, agora a sua sidebar já está com fonte pixel o3o' Eu testei, e deu tudo certinho >-<' 

16 comentários:

  1. First? Ameei o post!Tava doida pra achar esse, vou tentar baixar pra poder escrever nas imagens com essa fonte também, pra não ficar nada desproporcional, vou isso fazer no próximo layout as vezes da uma preguiçiinha de alterar tudo de novo; Pena que as vagas pra postar acabaram #Chateei, seguindooo!

    candy-reign.blogspot.com

    ResponderExcluir
    Respostas
    1. AHSUASH' as pessoas daqui nem comentam tão rápido assim >_<'
      Sério? Que bom que ajudei >-<
      Sim, entendo perfeitamente u-u ASHAUS'
      Que pena =/
      Obrigada <33

      Excluir
  2. Usando <3
    É perfeito para sidebar,oh <3
    Seguindo ~
    my-perfect-wonderland.blogspot.com.br

    ResponderExcluir
  3. Sou apaixonada por fontes pixel <3 <3 São tão lindas *u* Bia-Chan, eu vi seus e-mails e já aceitei o convite, mas o psd não está funcionando :/

    ResponderExcluir
    Respostas
    1. Eu também sou *3*
      E eu vi o seu Gi-chan, já lhe respondi o3o'
      Confere lá~

      Excluir
  4. Este comentário foi removido pelo autor.

    ResponderExcluir
  5. Yoo estava a procura deste tuto *oo*
    Leu minha mente ...
    Chu♥~
    Portal Encantado

    ResponderExcluir
  6. Estava precisando desse tutorial,muito Obrigada >3<

    ResponderExcluir
    Respostas
    1. Hm, sou mesmo leitora de mentes u3u' -n
      Que bom que gostou >3<

      Excluir
  7. Meu deus, tava precisando *-* Salvei aqui nos tutos pra depois não perder uahsuha. Vlw amora :3

    ResponderExcluir
  8. Bia, eu tentei mas os espaços ficam muito longe...
    Me ajuda?

    ResponderExcluir
    Respostas
    1. Pode me mostrar? Se puder, eu tento ver o que aconteceu, mas se não conseguir, você pode me convidar no blog e eu ajeito :3 (Não vou estragar nada nele não EHEUHE')

      Excluir
    2. Este comentário foi removido pelo autor.

      Excluir