Como adicionar Tipografia Incrível no WordPress com Typekit

Você já se perguntou como os designers conseguem usar fontes personalizadas e bonitas em seus sites? Muitas vezes, eles adicionam fontes personalizadas ao WordPress usando o Typekit, um serviço da Adobe que oferece acesso a fontes de alta qualidade. Neste artigo, mostraremos como adicionar fontes do Typekit no WordPress para melhorar sua tipografia.

Por que usar fontes do Typekit?

O Typekit é um serviço popular de fontes por assinatura que pode economizar muito dinheiro. Em vez de pagar por licenças de fontes individuais, que podem ser bastante caras, você pode acessar toda a biblioteca deles com centenas de fontes gratuitamente ou por uma taxa anual fixa.

A biblioteca do Typekit é uma coleção massiva de mais de 1.000 fontes. Algumas das fontes mais bonitas que você pode encontrar na web estão disponíveis através do Typekit, um serviço da Adobe.

O plano gratuito básico vem com acesso a mais de 230 fontes, e você pode usar 2 famílias de fontes em um site gratuitamente. Outros planos variam de US$ 49,99 a US$ 99,99 por ano.

Essas fontes incríveis do Typekit podem ser facilmente adicionadas a qualquer site sem diminuir a velocidade de carregamento das suas páginas. As fontes são servidas pela CDN da Adobe e carregam em velocidades muito mais rápidas do que se você as hospedasse em seu próprio site.

Tutorial em vídeo do Typekit para WordPress

Se você não gostar do vídeo ou precisar de mais instruções, continue lendo abaixo.

Por que usar fontes personalizadas na web no WordPress?

A tipografia desempenha um papel crucial no design do seu site.

Escolher as fontes certas comunicará claramente sua personalidade e mensagem aos seus leitores. Não importa qual imagem você queira projetar — profissional, amigável, casual, experiente — as fontes em seu site podem ajudar a projetar a imagem certa.

Ao usar o conjunto certo de fontes, você pode deixar uma impressão duradoura. Em vez de parecer com qualquer outro site na web, seu texto fica visivelmente diferente. Selecionar a fonte adequada para o seu site WordPress pode transformar seu site de um design simples em uma obra de arte esteticamente agradável e deslumbrante.

As fontes personalizadas corretas para a web podem:

• aumentar as taxas de conversão
• diminuir a taxa de rejeição do seu site
• aumentar o tempo gasto no seu site
• criar uma experiência memorável para os usuários

Pronto para começar com as fontes do Typekit? Veja como usar o Typekit para personalizar o design do seu WordPress.

Como Começar Com Typekit

Primeiro, você precisará criar uma conta Typekit. Para fazer isso, basta visitar Typekit.com para comparar os planos disponíveis.

Você precisará escolher em qual plano deseja se inscrever. O plano gratuito limita você a um site e inclui acesso a fontes limitadas. Você pode querer começar com o plano gratuito para experimentá-lo e, em seguida, fazer um upgrade mais tarde. O upgrade oferece uma biblioteca maior de fontes e você pode usá-las em mais sites.

O próximo passo é criar um kit. O kit permite que você monte uma biblioteca específica de fontes e configurações para o seu site, para que o Typekit carregue apenas os arquivos e o código necessários. Para criar seu kit, adicione o nome do seu site e o nome do domínio e, em seguida, clique em Continuar.

Depois de preencher suas informações para o seu kit, o Typekit fornecerá um trecho de código JavaScript para adicionar ao seu site. Você pode copiar e colar este código em um editor de texto como o Bloco de Notas para salvá-lo por enquanto. Adicionaremos ao seu site na próxima etapa deste tutorial.

Por enquanto, você pode começar a escolher suas fontes. Você pode navegar pela biblioteca de fontes e filtrar por opções como classificação, peso, largura, altura x e muito mais.

Quando encontrar uma fonte que goste, você pode clicar nela para obter mais detalhes e exemplos. Se desejar adicioná-la ao seu kit da web, clique no botão Uso na Web: Adicionar ao Kit no lado direito.

Isso abrirá um pop-up onde você precisará adicionar a fonte selecionada ao kit que você acabou de criar.

Agora você pode clicar no botão Publicar para salvar as alterações no seu kit.

É só isso! Seu kit de fontes está pronto para uso.

Adicionando Suas Fontes do Typekit no WordPress

A maneira mais fácil de adicionar suas novas fontes personalizadas da web ao seu blog WordPress é usando um plugin WordPress Typekit.

Recomendamos o plugin Typekit Fonts for WordPress. Após instalar e ativar o plugin, você pode visitar Configurações » Typekit Fonts para configurá-lo.

Primeiro, você precisará colar o código JavaScript que salvou anteriormente no campo de código de incorporação do Typekit. Depois disso, você pode adicionar seletores CSS para especificar onde deseja usar a fonte em seu site.

Na captura de tela acima, adicionamos a fonte ao seletor CSS h1.site-title.

Seu tema WordPress pode usar classes diferentes para elementos diferentes. Você precisará usar a ferramenta Inspecionar Elemento em seu navegador da web para descobrir essas classes CSS. Você também pode conferir nossa planilha de referência de CSS gerado pelo WordPress para iniciantes para ajudá-lo a começar.

É isso! Esperamos que este artigo tenha ajudado você a aprender como adicionar tipografia incrível no WordPress com Typekit. Você também pode dar uma olhada em nosso guia sobre como adicionar fontes da web do Google em seus temas WordPress.

Se você gostou deste artigo, então por favor inscreva-se no nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e Facebook.