As fontes disponíveis no WordPress são Google Fonts. Mas o que fazer quando o layout exige uma fonte externa? Embora existam várias maneiras, abaixo você encontrará o método mais eficiente para otimizar seu site.
Por Que Este é o Melhor Caminho
Embora essa não seja a única maneira, é a melhor para você e seu site. Mas por quê?
Por exemplo: se você adicionar os arquivos de fontes ao tema, não poderá continuar a usá-los se precisar mudar o tema. Além disso, o melhor lugar para colocar sua fonte é no servidor do site, pois o navegador baixa a fonte diretamente de lá. Isso significa não apenas que você pode mudar o tema, mas também que a fonte vai carregar mais rápido.
Além disso, se você seguir corretamente as instruções passo a passo, não é apenas eficiente, mas também um jeito rápido e fácil.
Plugin
Você vai precisar de três plugins para adicionar a fonte externa. O File Manager para obter o caminho da fonte, o My Custom Functionality Master para inserir o plugin, e o Elegant Custom Fonts onde vamos adicionar as regras da fonte.
Passo a Passo
Finalmente, chegamos ao que realmente importa: o guia de instalação passo a passo.
1- Uma vez que você tem a fonte no seu PC ou notebook, você deve adicioná-la aos arquivos My Custom Functionality Master. Para fazer isso, basta extrair o arquivo .zip do plugin e colar os arquivos das fontes na seguinte localização: my-custom-functionality-master > assets > fonts. É muito importante que todas as fontes tenham nomes padronizados e formatos iguais. Por exemplo, se a família de fontes externa for Lato, os arquivos devem ser todos como mostrado na captura de tela abaixo (maiúsculas e .ttf). Depois disso, compacte o arquivo com a fonte e adicione-o ao seu site.
2 – Agora é o momento de instalar os outros plugins (File Manager e Elegant Custom Fonts).
3 – Depois de instalar o File Manager, ele aparecerá na barra lateral do WordPress. Basta clicar nele e os arquivos aparecerão. Em seguida, você deve procurar o seguinte caminho: wp-content > plugins > my-custom-funcionality-master > assets > fonts.
4 – Depois de acessar os arquivos fonte, basta clicar com o botão direito e depois clicar em Obter informações & Compartilhar. Em “Caminho:” você vai copiar o caminho da fonte a partir de /wp-content. Repita esse processo para todos os arquivos, um por um. Uma dica interessante é copiar e colar esse caminho em um bloco de notas, por exemplo, para evitar erros e agilizar o processo.
5 – Depois de fazer isso, chegamos à parte final e mais importante do processo. No Elegant Custom Fonts, adicione uma nova Família de Fontes. Depois de dar um nome a ela, é hora de adicionar o font-face. Este é o momento em que você deve ter muito cuidado para não adicionar nada diferente do layout. Depois de escolher o peso e o estilo da fonte, o URL do .woff é o caminho do passo 4, lembra? Basta colar aqui. Não se esqueça de verificar se tudo está correto. Se houver uma segunda família de fontes, basta repetir o processo em uma nova Família de Fontes.
6 – Depois de verificar e garantir que tudo está correto, a(s) fonte(s) aparecerá(ão) no seu site e voilà! Você acabou de instalar uma fonte externa da melhor maneira possível!
É importante lembrar que se algo deu errado, não precisa desanimar. Revise passo a passo com calma e refaça onde você cometeu um erro.
Se você gostou dessa dica, siga nosso blog para muito mais!
