17 de outubro de 2013

Tutorial - Oque é e como usar a font-face?

♡ ice cream ♡ | via Tumblr

Olá, meu povo e minha pova (^-^)

Primeiramente mil desculpas por não postar ontem, fiquei enrolando e enrolando e como sempre acontece não deu tempo, então ficou a noite para mim retribuir e responder comentários e como eu estava arrumando o meu querido quarto que estava uma bagunça acabou meu tempo e quando vi já era quase meia noite e percebi que não dava mais tempo para postar e foi assim -qq. Agora quero avisar vocês que em breve eu vou fazer um concurso de desenho, o melhor vai ganhar...ainda não sei, mas será uma divulgação e tais e tais e lembrando que no dia que o blog completar 500 seguidores eu irei fazer tipo uma maratona de goodies e vai ter de 4 a 10 postagens no dia...

Mudando de assunto, eu andei percebendo que tem bastante gente que não sabe usar o font-face e não faz nem ideia do que eu estou falando, bem vou explicar: Sabe, quando você entra no blog e vê o titulo de post com uma fonte diferente das comuns (Arial, georgia, verdana entre outras) então a pessoa provavelmente usou o font-face para fazer isto, entenderam? Não. Bem, então click em "leia mais" que eu explico melhor o baguio -qq

Oque é font-face?
É oque nos permite personalizar as fontes do seu layout, ou seja, colocar as fontes de seu computador no titulo de post, no titulo dos gadgets entre outros...

Com font-face
Como podem perceber a fonte é personalizada

Sem font-face 
Já neste caso a fonte é uma normal do blogger

Como usar a font-face
Primeiramente, você deve escolher a fonte do seu computador que você vai usar e coloca-la em uma pasta fácil e acessível.

Depois de fazer isto, você vai neste site e hospeda a sua fonte, depois de escolher o arquivo click em Carregar arquivo. Vai aparecer um link em baixo copie-o... Agora é só colocar ele neste código:
@font-face {font-family: "nomedasuafonte"; src: url('linkquevocêcopiou');}
Pronto, agora você cola acima do que você quer usar, por exemplo, se você quiser usar nos posts cole acima de h3.post-title a { ou acima de ]]></b:skin>
Lembre-se que se quiser usar: font-family: nomedasuafonte;

16 comentários:

  1. Legal o tutorial talvez eu use quando a minha inspiração voltar, pois no momento tenho que me contentar com layouts free.
    Flor quero ser afiliada do seu blog, posso? responde no meu blog.

    ResponderExcluir
    Respostas
    1. Obrigada ~ Tomara que sua inspiração volte logo <3

      Excluir
  2. Amei a postagem! Fica muito lindo no blog ^-^
    Acho que vai ser legal esse concurso de desenho!
    luisadub.blogspot.com

    ResponderExcluir
    Respostas
    1. Obrigada ~ Também acho, alias oque seria de mim sem a font-face...
      Já postei o concurso ~

      Excluir
  3. Amei o tuto! Muito legal! :3
    Vou ver se eu uso no lay novo ;)
    Beijos e fique com Deus!
    Batom De Framboesa

    ResponderExcluir
  4. muito útil to precisando mesmo, as fontes do blogger estão ficando enjuativas hsauhsush
    e vc conseguiu achar seu quarto no meio da bagunça,?? ou não tava tão bagunçado?? shaush
    Anw Vi.. só vc :D ♥
    obg pelo post ajudou muito :D
    beeijo beeijokas
    Rumo a Paris•

    ResponderExcluir
    Respostas
    1. Obrigada ~ Depois de um tempo usando as fontes do blogger enjoa mesmo ashuahauhahuahau... bem, por um milagre eu achei meu note dentro da bagunça do meu quarto KKKKKKKKKKKKKKKKKKKKKK

      Excluir
  5. amo font-face ;3
    Tutorial bem útil! amei vai ajudar muito.

    http://euamotutoriais.blogspot.com.br/

    ResponderExcluir
  6. Nossa, que legal! Eu já sei editar as fontes do blog só que de outra forma.. Desse jeito é bem legal também e parece ser um pouquinho mais fácil.
    Quando eu quiser usar uma fonte que eu tenha no pc, vou usar esse tutorial.
    Beijoos!
    sensatasonhadora.blogspot.com

    ResponderExcluir