Google Font Directory
Stuff,Web, 23/05/2010

O Google lançou recentemente mais uma excelente ferramenta para os desenvolvedores, trata-se do Google Font Directory, com ele é possível utilizar outras fontes para escrever textos e conseqüentemente os posts, mas com exceção de que somente é permitido usar as fontes disponíveis no seguinte diretório.

Para utilizar é bem simples, basta acrescentar no head a seguinte chamada:

<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Reenie+Beanie" type="text/css" />

E no seu arquivo .css configurar o font-family da seguinte forma:

font-family: 'Reenie Beanie', Arial, Helvetica;

Repare que na primeira configuração foi especificado a fonte que será utilizada family=Reenie+Beanie e esta deve de ser configurada no font-family ‘Reenie Beanie’.

Abaixo dois pequenos exemplos usando as fontes:

Fonte Reenie Beanie
Lorem ipsum dolor sit amet, pede sed quisque augue amet et dignissim, eget nonummy amet nec vitae parturient neque, aenean nibh platea. Metus dapibus elit, non auctor justo ex, aliquam in sodales molestie augue, in nostra et.

Fonte Lobster
Lorem ipsum dolor sit amet, pede sed quisque augue amet et dignissim, eget nonummy amet nec vitae parturient neque, aenean nibh platea. Metus dapibus elit, non auctor justo ex, aliquam in sodales molestie augue, in nostra et.

E ainda no Google Font Directory ao passar o mouse sobre uma fonte tem a opção de: Click to embed no qual irá aparecer especificações como opções de variação da fonte, caracteres suportados e Get the code mostrando a forma para chamar e utilizar a fonte.



Tags , , Impressora Imprimir Post
Compartilhe: Del.icio.us | Twitter



7 Comentários para “Google Font Directory”


  1. Ok, beleza, mesmo não entendendo quase nada de html eu consegui colocar uma das fontes, mas isso me fez perceber então o seguinte: a cláusula em html que colocamos no HEAD, se eu quiser colocar tr~es tipos de fonte no decorrer dos posts eu terei que declarar as três fontes nesta cláusula, não é isso?

  2. Caso positivo, sobre o meu comentário anterior, então como seria a sintaxe da declaração pra três fontes distintas? grato e abraços.

  3. Mari Assmann says:

    João,
    Você usa a tag do < head > quantas vezes precisar, uma para cada fonte que deseja.

  4. Adriana says:

    Obrigada. Deu certo.
    Bejos *03*

  5. Desculpe a burrice minha mas onde fica o head no wordpress?
    não encontrei *23*
    Beijoos!

  6. Gui says:

    Mê Fornazari, head quer dizer cabeça em ingles, é o que fica no topo do site… head dos themes fica em: /wp-content/themes/…/header.php

    Os pontinhos estão no lugar do nome da pasta do theme…

  7. Gui says:

    Para quem não sabe nada de HTML é só fazer assim:

    Na header.php do wordpress ou em algum lugar em cima do código de seu blog irá ter um “” , antes disso coloque o primeiro código e no lugar do “Reenie Benie” coloque o nome da fonte escolhida.

    No style.css do wordpress, no arquivo (algo).css ou no topo do seu blog na tag “”, procure o “body {” ou “html {” ou “html, body{” etc, (crie se precisar) e coloque depois isso o segundo código do post e no lugar de Reenie Benie coloque o nome da fonte escolhida…

    Só isso *01*



Get Adobe Flash playerPlugin by wpburn.com wordpress themes