Como utilizar as fontes do Google no WordPress

Para escolher a fonte, acesse https://www.google.com/fonts.

fonte-google-wordpress1

Após fazer  sua escolha,  clique seta vermelha para selecionar:

fonte-google-wordpress2

A fonte escolhida será selecionada:

fonte-google-wordpress3

Quando você clicar na caixa “Family Selected”, vai encontrar os códigos para inserir a fonte no seu site:

fonte-google-wordpress4

O primeiro código deve ser inserido entre as tags <head> e </head> do seu site. Esse codifo informa o caminho para a referida fonte, no Google:

fonte-google-wordpress5

O segundo código deve ser inserido no arquivo CSS, exatamente onde você deseja que a fonte seja utilizada:

fonte-google-wordpress6

Uma outra forma de inserir fontes do Google no seu site WordPress é através de plugins.

O plugin WP Google Fonts faz todo o trabalho para você. Para baixar esse plugin, clique AQUI.

Com ele é possível selecionar até seis fontes que você deseja usar em seu site a partir de uma lista suspensa, escolhendos em quais elementos cada uma destas fontes pode ser usada. Com ele você também pode adicionar seu próprio CSS personalizado.

fonte-google-wordpress7

Outra boa opção é o plugin Supreme Google Webfonts, outro plugin gratuito, que além de funcionar com o serviço Google Fonts, permite que você selecione as fontes durante a criação de seu conteúdo.

Quando ativado, são adicionados dois novos campos no editor de textos do seu WordPress, o que lhe permite selecionar fontes do diretório Google Fonts e alterar o tamanho do texto. A lista suspensa fonte permite que você visualize cada fonte, assim você não precisa voltar ao Google Fonts para ver o estilo de cada fonte.

Faça o download desse plugin AQUI

fonte-google-wordpress8

O WordPress é um CMS todo feito em PHP.

Você gostaria de aprender essa liguagem tão poderosa e não tão difícil?

Assim você poderia construir o seu próprio CMS do seu jeito! Clique na imagem abaixo e receba, em seu e-mail, um mini-curso gratuito de PHP:

arte_sequencia_free

 

Receba o e-book com dois efeitos de texto em PHOTOSHOP

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.