Você escolheu o tema para o seu site, instalou e ativou tudo. Quando você vai verificar como ficou o novo visual, percebe que a fonte dos textos e títulos não contribuem muito. Talvez por falta de atenção no momento de escolher o tema, ou simplesmente, porque o layout era bom demais e valeria à pena fazer a alteração das fontes depois.
Para qualquer site e principalmente blogs – onde a existência de conteúdos em texto é ainda maior, a escolha da fonte certa é algo de extrema importância para seu sucesso e fidelidade dos visitantes. Por isso, o CanalWP vai te mostrar como é possível utilizar qualquer fonte em seu WordPress com plugin, podendo trocá-la sempre que necessário e definindo diferentes fontes para textos e títulos.
Utilizar Qualquer Fonte no WordPress
Plugin Font Organizer
Para você que tem vontade de alterar e testar fontes afim de proporcionar uma melhor leitura, navegabilidade e também, visual mais confortável para seu WordPress – o plugin Font Organizer é uma ferramenta excelente.
Sem qualquer necessidade de conhecimento técnico em linguagem de programação, o plugin Font Organizer permite carregar fontes personalizadas e também utilizar variadas Google Fonts em sites WordPress.
Font Organizer é um plugin 100% gratuito e completo para gerenciar fontes customizadas em seu site. Além do upload de fontes você pode, através dessa mesma ferramenta, definir quais elementos do seu site devem utilizar as fontes customizadas que adicionou.
Página de Configurações
Depois que você tiver realizado a instalação e ativação do plugin Font Organizer em seu site WordPress, já é possível realizar o upload de fontes customizadas e as devidas configurações.
Acesse através do menu Configurações do Painel Administrativo, a opção Font Settings.
Se você precisar de sites para fazer o download de algumas fontes gratuitas, tenho aqui alguns para te indicar:
Esses são apenas alguns sites onde você encontrará opções de fontes grátis e nos formatos comumente utilizados para esse tipo de arquivo, como: .ttf, .woff, .woff2, .otf, .svg, .eot.
Upload De Fonte Personalizada
Já com o arquivo da fonte que você quer utilizar em seu site WordPress em mãos, precisamos agora fazer o upload e configuração dele.
Observação: Assim que você entra na página de configurações do plugin Font Organizer, estará na aba General.
O item 1. Add Fonts é para que você possa utilizar Google Fonts.
No entanto, como esse não é o objetivo do tutorial de hoje, vamos pular para o item 2. Custom Fonts.
Em 2. Custom Fonts encontramos a área específica para que possamos fazer o upload dos arquivos das fontes personalizadas que pretendemos adicionar ao site.
O primeiro passo aqui é adicionar o Nome da Fonte (Font Name). Você pode digitar qualquer nome, inclusive o nome padrão e oficial da fonte que baixou anteriormente.
Em Font Weight você vai indicar a espessura e/ou o estilo daquela fonte que estará adicionando.
E por último, em Font Weight File você vai adicionar o arquivo ou os arquivos da fonte. Para adicionar diferentes formatos da fonte, basta clicar no botão de + Add Another Font Format File.
Para finalmente “upar” a fonte customizada, clique no botão Upload.
Após o upload do arquivo, se tudo ocorreu corretamente você verá a seguinte mensagem de sucesso:
Atribuindo Uma Fonte A Determinado Elemento
Depois que a fonte customizada foi adicionada ao WordPress, vamos para o passo 3. Known Elements Settings.
Nessa área você vai definir quais elementos do seu site devem possuir e exibir a fonte customizada.
É possível aplicar a fonte para todo o site – escolhendo a opção <body> Font -, ou para elementos específicos: como títulos h1, h2, h3, h4, h5, h6; parágrafos, links, dentre outros.
Faça as suas configurações e clique no botão Salvar alterações quando terminar.
Atribuindo Fonte A Elemento Através De Classe Ou ID
Para quem possui alguma afinidade com código CSS ou HTML, o plugin Font Organizer traz no passo 4. Custom Elements Settings uma opção interessante.
É possível aplicar a fonte customizada informando uma classe ou id de um elemento HTML do seu site.
Deletando Uma Fonte
Em 5. Manage Fonts, você pode deletar fontes customizadas que tenha upado para seu site. Assim, se você havia adicionado fontes e hoje não as utiliza mais, pode simplesmente excluí-las do seu servidor.
Para deletar uma fonte, basta selecioná-la na lista e esperar que o botão Delete Font seja exibido. Daí é só clicar neste mesmo botão para que a fonte customizada seja apagada.
Demonstração Da Fonte Customizada No Site
Agora que você fez o upload da fonte customizada, configurou e aplicou-a a elementos do seu site. É necessário que você navegue em suas páginas para ver como ficou o novo visual.
Eu configurei a minha fonte customizada para os elementos de título h1 do meu WordPress. Olha só como ficou:
Configurações Avançadas
O Font Organizer traz ainda uma aba para configurações avançadas. Clicando na aba Advanced você verá outras opções para configuração.
Essa área é voltada para quem precisa trabalhar com regras de CSS adicionais e também, para quem deseja utilizar Google Fonts.
O plugin Font Organizer traz uma lista estática de fontes Google. Assim, para obter a lista de fontes mais atual é necessário obter uma chave de API (API Key).
Conclusão
Inúmeras podem ser as razões para você querer utilizar uma fonte diferente em seu site. A escolha da fonte dos textos tem grande peso na hora de garantir uma leitura confortável de seus conteúdos por parte de seus leitores. Caso contrário, torna a leitura dos títulos e do texto em algo difícil e nada prazeroso.
Para quem quer ter maior liberdade e flexibilidade em prol de garantir melhor experiência para a leitura e navegabilidade do site, o plugin Font Organizer é uma ferramenta ótima! Como ele você pode fazer o upload de diferentes e variadas fontes customizadas e ainda, escolher quais elementos devem receber uma ou outra fonte. O Font Organizer permite utilizar qualquer fonte em seu WordPress com plugin e sem obrigatoriamente utilizar código para isso.
Se você gostou desse artigo considere compartilhar nas redes sociais. Siga-nos nas redes sociais para acompanhar mais artigos como esse. Se de alguma forma este artigo lhe foi útil deixa seu comentário abaixo para podermos saber a sua opinião.
Ferramentas WordPress Veja Mais Ferramentas
CloudFlare
Asset CleanUP PRO
RafflePress
Infelizmente esse plugin foi descontinuado.
Olá Romeu,
Obrigado por nos informar.
Você encontrou algum outro plugin que lhe serviu bem? Ainda precisa de algo assim?
Abraço.
Preciso usar uma fonte personalizada em um wp, o que vc recomenda? Obrigado
Você tem uma fonte personalizada (ttf,otf,woff) que deseja usar ou você quer escolher entre um banco de fontes como o Google Fonts?
Se você quer usar as fontes do Google eu recomendo utilizar esse plugin:
https://wordpress.org/plugins/easy-google-fonts/
Se você quer utilizar sua própria fonte esse plugin é uma ótima opção:
https://wordpress.org/plugins/use-any-font/
Abraço.
Obrigado. muito util!
Olá! Antes, parabéns pelo site! Achei muito bonito e bem interessante! Estou trabalhando em um e-commerce com wordpress e woocommerce… Ao tentar fazer upload da fonte, apareceu esta mensagem: Error uploading the file: Este tipo de arquivo não é permitido por razões de segurança. Procurei, mas não encontrei como posso alterar. Saberia me dizer onde devo modificar? Desde já, muito Obrigada, Sendy.
Mesmo problema, conseguiu resolver?
O WordPress por padrão só aceita uma lista definida de tipos de arquivos por questões de segurança. Se essa mensagem for exibida é porque o arquivo que você está tentando subir não está na lista padrão.
Você pode fazer isso adicionando a seguinte linha de código no seu arquivo wp-config.php:
define('ALLOW_UNFILTERED_UPLOADS', true);Salve o arquivo e envie de volta ao servidor.
Se mesmo assim não resolver esse problema talvez você precise entrar em contato com o seu servidor de hospedagem também, já que alguns servidores removem arquivos especificos da lista de permissões por questões de segurança.
Abraço.
Olá Sendy. Parabéns pelo artigo.
Como não entendo muito dessa área, estou com uma dúvida. Mesmo depois do Font Organizer ter colocado o arquivo da fonte escolhida na pasta “wp-content”, eu preciso adicionar um código css com outras fontes secundárias? Por exemplo: font family: ‘Roboto’, ‘Arial’, sans-serif’;
Ou não precisa? Meu site será carregado sem problemas? Porque vi, ao inspecionar elemento, que fica apenas uma opção de fonte ao usar este plugin e antes o tema padrão tinha outras opções de fonte caso a primeira não fosse carregada.
Obrigado.