Como usar o Font Awesome no WordPress

Precisa adicionar ícones de alta qualidade ao seu site WordPress? Você já ouviu falar do Font Awesome, mas não sabe como usá-lo?

Neste artigo, mostraremos como usar o Font Awesome para adicionar ícones ao seu site WordPress.

Ícones do mar disponíveis na Envato Elements.Ícones do mar disponíveis na Envato Elements.Ícones do mar disponíveis na Envato Elements.
Ícones do mar disponíveis na Envato Elements.

Os ícones são um elemento gráfico essencial para qualquer site, independentemente do setor. Eles adicionam um elemento visual que adiciona interesse a qualquer página da Web em que estejam. Font Awesome é o conjunto de ícones usados ​​mais popular da Internet. Você obtém acesso a imagens vetoriais de alta qualidade que podem ser personalizadas com CSS. O melhor de tudo é que o Font Awesome oferece uma versão gratuita com mais de 1.600 ícones gratuitos para você usar. Configurar e usar o Font Awesome WordPress é fácil. Neste artigo, abordaremos todas as etapas necessárias para começar a usar o Font Awesome WordPress. Primeiro, vamos analisar uma oferta atraente para proprietários de sites WordPress.

Elementos Envato: Downloads ilimitados

O Envato Elements é um serviço que fornece uma assinatura de download ilimitado, o que significa que você pode baixar quantos itens quiser de milhões de ativos digitais. Isso inclui temas e plugins premium do WordPress, ícones, banco de imagens, áudio sem royalties e banco de vídeos.

A assinatura é coberta por um licenciamento comercial simples que lhe dá o direito de usar o item em uma ampla variedade de projetos, incluindo aqueles de natureza comercial.

O licenciamento é à prova de futuro, ou seja, mesmo se você cancelar a assinatura e não puder mais baixar itens do Envato Elements, quaisquer usos registrados existentes ainda serão cobertos.

Plug-ins WPPlug-ins WPPlug-ins WP
O Envato Elements tem toneladas de ativos WordPress de alta qualidade, incluindo plugins.

Inscreva-se hoje

Inscreva-se hoje e comece a criar ou saiba mais sobre por que o Envato Elements é ótimo para usuários do WordPress.

Agora vamos abordar como usar o Font Awesome em cinco etapas simples.

1. Instale o plugin WordPress Font Awesome

Configurar o plugin Font Awesome WordPress é como configurar qualquer outro plugin WordPress.

Em seu painel, acesse Plug-ins> Adicionar Novo. No Plugins de pesquisa… campo, pesquise Font Awesome. Em seguida, clique em Instalar Agora > Ativar.

ativarativarativar
Ativando o Font Awesome na seção de plugins do painel do WP.

É isso! O plugin WordPress Font Awesome está instalado e pronto para ser usado. Vamos agora ver como configurar o plugin.

2. Configurar o plug-in e o kit

A configuração do plugin é muito simples. No seu painel WP, vá para Configurações > Fonte incrível. Isso abrirá o menu Font Awesome.

Nossa primeira opção é se queremos usar o Font Awesome WordPress como um kit ou usar um CDN.

Font Awesome recomenda usar a opção Kit, pois oferece a maior quantidade de ícones e dá acesso ao Icon Chooser.

Para configurar isso, primeiro você precisa criar uma conta no Font Awesome e criar um kit. Nenhuma outra ação é necessária depois de criar um kit no site Font Awesome.

Criando um kit no Font Awesome.Criando um kit no Font Awesome.Criando um kit no Font Awesome.
Criando um kit no Font Awesome.

Em seguida, você precisa obter um token da API Font Awesome. Acesse a página da conta para gerar e copiar seu token de API.

Acesse a API Font Awesome da sua conta. Acesse a API Font Awesome da sua conta. Acesse a API Font Awesome da sua conta.
Acesse a API Font Awesome da sua conta.

Volte para as configurações do Font Awesome no painel do WP e cole o token da API no campo API.

Em seguida, escolha o kit que você acabou de criar. Agora você está pronto para começar a adicionar ícones ao seu site WordPress.

Adicionado na chave de API para o plugin Font Awesome WordPress.Adicionado na chave de API para o plugin Font Awesome WordPress.Adicionado na chave de API para o plugin Font Awesome WordPress.
Adicionado na chave de API para o plugin Font Awesome WordPress.

3. Ajustar as configurações impressionantes da fonte

Existem algumas configurações que você pode ajustar nas configurações do Kit no site Font Awesome.

A primeira configuração é se você deseja ou não usar a versão gratuita ou paga do Font Awesome. Se você tiver a versão paga, clique na versão pro.

A última configuração que você pode ajustar é se deseja que os ícones sejam SVG ou fontes da web. Em geral, o SVG é mais poderoso, mas não funciona bem com pseudo-elementos. Nossa sugestão seria usar SVG.

Tudo bem! Tudo está configurado e pronto para ir. Vejamos onde você pode encontrar os ícones para adicionar ao seu site.

4. Encontre ícones que você deseja usar

Agora é hora de encontrar os ícones que você deseja adicionar ao seu site WordPress. Font Awesome tem uma biblioteca de ícones que você pode escolher em seu site.

Existem mais de 1.600 ícones na versão gratuita do Font Awesome que você pode usar.Existem mais de 1.600 ícones na versão gratuita do Font Awesome que você pode usar.Existem mais de 1.600 ícones na versão gratuita do Font Awesome que você pode usar.
Existem mais de 1.600 ícones na versão gratuita do Font Awesome que você pode usar.

Como mencionado, existe uma versão gratuita e paga do Font Awesome. Se você quiser usar a versão gratuita, certifique-se de encontrar apenas os ícones que estão no filtro gratuito.

Abra os ícones que você deseja usar e uma guia separada no seu navegador. Agora estamos prontos para adicioná-los ao seu site.

5. Adicione os ícones às suas páginas e postagens

Abra uma página ou uma postagem no painel do WP. Quando estiver na página ou no editor de postagem, adicione um bloco de código de acesso ao local em que deseja que seu ícone apareça. Em seguida, no bloco de shortcode, você colará o código HTML do ícone que deseja adicionar.

Para obter este código HTML, clique no ícone que deseja adicionar. Um menu pop-up aparecerá. Clique no código HTML e ele será copiado automaticamente para a área de transferência.

ícone FAícone FAícone FA
Copie o código HTML da biblioteca Font Awesome.

Em seguida, cole o código de volta no bloco de shortcode na página ou no editor de postagem.

adicionando código de acessoadicionando código de acessoadicionando código de acesso
Cole o código HTML no bloco de código de acesso do editor de postagem ou página.

É isso! Seu ícone agora está na página ou postagem. Adicione quantos ícones quiser em suas páginas e posts.

Comece a usar o Font Awesome hoje!

Os ícones são necessários para todos os sites. Eles adicionam interesse às suas páginas da web e ajudam a converter essas páginas.

Font Awesome WordPress é uma ótima ferramenta para adicionar ícones de alta qualidade ao seu site. Neste artigo, abordamos duas maneiras de configurar o Font Awesome em seu site. Em seguida, analisamos como adicionar os ícones reais ao seu site WordPress. Em poucos minutos você pode ter ícones no seu site WordPress.

Se você precisar de ainda mais ícones premium para o seu site WordPress, não deixe de conferir o Envato Elements! Existem muitos ícones e outros ativos que são valiosos para qualquer proprietário de site WordPress.

Deixe uma resposta