WordPress icons: jeito fácil de inserir ícones no WordPress

Há diversas formas de usar WordPress icons (fontes de ícones) para tornar um texto mais des­con­traído no WordPress. Uma delas é usando um plugin do WordPress para fontes de ícones como, por exemplo, o Font Awesome. Com ele, é possível usar short­co­des para inserir ícones ou vincular fontes in­di­vi­du­ais e conjuntos completos de fontes de ícones ma­nu­al­mente, por embed code. Caso você precise somente de alguns ícones padrão, você também pode usar ícones de cons­tru­to­res de páginas ou dashicons.

O que são fontes de ícones?

Fontes de ícones são pic­to­gra­mas e símbolos que você pode inserir na sua página para facilitar a navegação ou tornar o texto mais des­con­traído. A maior diferença entre as fontes de ícones e outros ícones do WordPress é que as fontes de ícones são inseridas como fontes con­ven­ci­o­nais. Ao invés de letras, números e ca­rac­te­res especiais, as fontes de ícones contêm pequenos símbolos.

Há muitas vantagens em se usar WordPress icons. Uma delas é que a inserção dos ícones é mais fácil quando os pic­to­gra­mas estão ar­ma­ze­na­dos como ca­rac­te­res de uma fonte. Da mesma forma, eles também podem ser mo­di­fi­ca­dos como uma fonte. Você pode alterar o tamanho e a cor deles como quiser. Além disso, é mais rápido carregar fontes de ícones do que gráficos in­di­vi­du­ais.

Onde encontra fontes de ícones para o WordPress

Close

Várias or­ga­ni­za­ções dis­po­ni­bi­li­zam WordPress icons. Muitos deles são grátis. O site de ícones gratuitos mais popular do mundo é o Font Awesome. Nesse site você encontra mais de 7.500 ícones, que vão de setas simples e símbolos comuns, como carrinhos de compras e lupas, a ícones sobre temas es­pe­cí­fi­cos.

Inserir ícones no WordPress com plugin

Close

Quando você encontrar os ícones do WordPress ideais para sua página, há diversas formas de inseri-los. Um método simples é a inserção por plugin. Para o Font Awesome, por exemplo, existe um plugin chamado Better Font Awesome. Com ele você pode inserir ícones no WordPress usando um shortcode. O plugin sempre dis­po­ni­bi­liza os conjuntos de ícones mais novos e não requer atu­a­li­za­ções manuais. É muito fácil usá-lo: depois de instalado, o plugin permite que você selecione e insira os ícones que quiser por meio do shortcode icon name="exemplo". Os diversos pic­to­gra­mas também podem ser se­le­ci­o­na­dos no editor de texto.

Inserir ícones no WordPress ma­nu­al­mente

Você também pode inserir ícones ma­nu­al­mente no WordPress. Para isso, o Font Awesome dis­po­ni­bi­liza a fonte cor­res­pon­dente por embed code. Funciona assim:

1. Registre seu endereço de e-mail no Font Awesome para receber o embed code por e-mail.
2. Faça um backup de seu site. Como você vai alterar o código, é im­por­tante ter uma cópia de segurança.
3. Adicione o código no cabeçalho do seu tema. Isso pode ser feito através do arquivo header.php ou, em alguns temas, até mesmo di­re­ta­mente no back-end. O embed code deve ser inserido ime­di­a­ta­mente antes de </head>.
4. Após fazer isso, é hora de se­le­ci­o­nar os ícones do WordPress para a sua página.

Al­ter­na­ti­va­mente, faça o download do conjunto de ícones que preferir di­re­ta­mente no Font Awesome:

1. O primeiro passo é des­com­pac­tar o arquivo ZIP que você receber. Nele, você também en­con­trará um arquivo chamado “all.css”.
2. Use o FTP para se conectar à página do seu servidor. Nessa página, você en­con­trará uma pasta com o nome “fonts”.
3. Dentro da pasta “fonts”, você deve criar uma subpasta com o nome “Font Awesome” e, dentro dela, outra subpasta com o nome “css”. Adicione o arquivo “all.css” na subpasta “css”.
4. Abra o arquivo header.php do seu tema e insira o seguinte código antes de </head>:

<link href="https://www.exemplodepagina.com.br/themes/exemplodetema/fonts/fontawesome/css/all.css" rel="stylesheet">

Ícones de cons­tru­to­res de páginas e dashicons no WordPress: menor variedade, maior fa­ci­li­dade

A terceira forma de inserir ícones no WordPress é a mais fácil. Alguns dos cons­tru­to­res de páginas para WordPress mais usados possuem seus próprios conjuntos de ícones. Entre eles estão o Beaver Builder e o Elementor Pro, por exemplo. Nos cons­tru­to­res de páginas, os ícones são sim­ples­mente ar­ma­ze­na­dos como fontes. Eles podem ser se­le­ci­o­na­dos e inseridos por arraste e solte.

Há, contudo, uma des­van­ta­gem: em com­pa­ra­ção com a grande variedade de ícones dis­po­ní­veis em plugins como o Font Awesome, os cons­tru­to­res de páginas oferecem muito menos ícones, pro­por­ci­o­nando menos liberdade para expressar estilos in­di­vi­du­ais. Todavia, esse método pode ser su­fi­ci­ente, caso você precise somente de alguns ícones.

Close

Os dashicons funcionam de forma se­me­lhante. Eles são os ícones padrão do WordPress e podem ser inseridos com um plugin. Para inseri-los, basta copiar no site o código de um ícone e adicioná-lo no back-end. Há re­la­ti­va­mente poucos ícones dis­po­ní­veis para sua página no WordPress, mas eles são os ícones clássicos: símbolos de e-mail, lo­go­mar­cas de di­fe­ren­tes pla­ta­for­mas de mídias sociais e um carrinho de compras, por exemplo.

Conclusão: WordPress icons são úteis e fáceis de integrar

Há diversas formas de inserir ícones no WordPress e todas elas funcionam de maneira simples. As fontes de ícones oferecem diversas vantagens em relação aos gráficos e podem ser uma boa opção para você. O im­por­tante é usar ícones com moderação. Ao conter ícones em excesso, sua página pode passar uma impressão ruim. Um favicon do WordPress e alguns ícones em cada página são su­fi­ci­en­tes.