As fontes disponíveis no WordPress são as Google Fonts. Porém o que fazer quando o layout pede uma fonte externa? Apesar de existir mais de uma maneira, a seguir você encontrará a mais eficiente para otimizar o seu site.
Porque essa é a melhor maneira
Embora esse não seja o único modo, ele é o melhor para você e o seu site. Mas por quê?
Por exemplo: se adicionar os arquivos da fonte no tema, não poderá continuar usando se precisar trocá-lo. Além disso, o melhor lugar para colocar sua fonte é no servidor do site já que o navegador baixa a fonte diretamente de lá. Isso significa não só que você pode trocar de tema, mas também que a fonte carregará mais rápido.
Também, se seguir devidamente o passo a passo, além de eficiente é uma maneira rápida e fácil.
Plugins
Você precisará de três plugins para adicionar a fonte externa. O File Manager para pegar o caminho da fonte, My Custom Funcionality Master para inserir o plugin e Elegant Custom Fonts onde adicionaremos as regras da fonte.
Passo a Passo
Por fim, agora vamos ao que realmente interessa: o passo a passo para a instalção.
1- Uma vez que tiver a fonte no seu PC ou notebook, deverá adicioná-la aos arquivos do My Custom Funcionality Master. Para fazê-lo, você só precisa extrair o arquivo .zip do plugin e colar os arquivos da fonte no seguinte local: my-custom-funcionality-master > assets > fonts. É muito importante que todas as fontes tenham seus nomes padronizados e formatos iguais. Por exemplo, se a família da fonte externa for Lato, os arquivos devem estar todos como no print abaixo (capitalize e .ttf). Depois disso, comprima o arquivo com a fonte e adicione-o ao seu site.
2 – Agora é a hora de instalar os outros plugins (File Manager e Elegant Custom Fonts).
3 – Ao instalar o File Manager, ele vai aparecer na barra lateral do WordPress. É só clicar que os arquivos irão aparecer. Na sequencia você deve procurar pelo seguinte caminho: wp-content > plugins > my-custom-funcionality-master > assets > fonts.
4 – Após chegar nos arquivos da fonte é só clicar com o botão direito, depois em Get info & Share. Em “Path :” você copiará o caminha da fonte a partir de /wp-content. Refaça esse processo em todos os arquivos, um a um. Uma dica interessante é que você copie e cole esse caminho, num bloco de notas por exemplo, para evitar erros e agilizar o processo.
5 – Feito isso temos a parte final e mais importante do processo. No Elegant Custom Fonts, adicione uma nova Font Family. Após colocar o nome, é hora de acrescentar a font-face. É nesse momento em que você precisa de mais atenção para que não adicione nada diferente do layout. Após escolher font-weight e font-style, o .woff URL é aquele caminho do passo 4, lembra? É só colar ele aqui. Não se esqueça de conferir se está tudo certo. Se houver uma segunda família de fonte, é só repetir o processo em uma nova Font Family.
6 – Depois de conferir e tudo estiver certo, a(s) fonte(s) irá aparecer 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. Reveja o passo a passo com calma e refaça onde errou.
Se curtiu essa dica acompanhe nosso blog para muito mais!
