Fontes de ícones ou fontes de ícones ajudam você a dar dicas visuais ao seu visitantes. Tecnicamente, são pequenas imagens incorporadas como caracteres em arquivos de fonte.

Mais bonitos do que os bitmaps e totalmente responsivos, eles podem ser decorados e manipulados com CSS da mesma forma que as fontes. Nesse sentido, eles são muito fáceis de integrar na maioria dos sites, não sendo exceção aqueles desenvolvidos em WordPress.

Neste artigo, você usará um plug-in para adicionar ícones como recursos diretamente em seu editor WYSIWYG e, finalmente, para o manual mais, percorreremos as etapas para incluir suas fontes de ícone favoritas em seu tema.

Adicione fontes de ícone em seu editor WYSIWYG

A maneira mais fácil de integrar fontes de ícones em seu site é instalar e ativar o plugin. WP Visual ícone Fontes em seguida, visita Configurações >> Fontes de ícone. Lá você terá que escolher entre FontAwesome 4 (super pacote de ícones 369) e Genericons (Ícones 69), que são as duas fontes instaladas por padrão no plug-in. Por fim, salve suas alterações.

Agora no seu editor, logo após o botão Mídia você já conhece muito bem, pode ver um botão rotulado ícone. Clicar nele irá abrir uma lista contendo todos os ícones contidos na fonte do ícone que você selecionou anteriormente. O filtro de pesquisa permite encontrar o ícone desejado com mais rapidez, em vez de percorrer a lista inteira.

Observe que você fez mais do que adicionar um botão em seu editor. Você acabou de disponibilizar uma fonte de ícone em todo o escopo da instalação do WordPress. Isso significa que você pode inserir ícones onde quer que tenha permissão para escrever HTML. E você pode decorá-los com CSS, assim como faria com fontes. Mas isso você já sabia.

Adicionar fontes de ícone manualmente

Por algum motivo, você pode não querer ou não conseguir instalar plug-ins e, portanto, precisa incorporar suas fontes manualmente. Mas antes de sujar as mãos, esteja avisado sobre o perigo de editar arquivos de temas.

É altamente recomendável NÃO modificar o arquivo functions.php ou qualquer outro arquivo no seu tema, pois a atualização do tema apagará suas alterações ou interromperá o site. Em vez disso, crie um tema filho ou escreva um plugin específico para o seu site.

O procedimento é quase o mesmo para todas as fontes de ícone. Portanto, sinta-se à vontade para usar sua fonte favorita.

Baixe o arquivo zip da fonte do ícone de sua escolha no site do desenvolvedor e carregue-o conteúdo em um diretório em seu site. Você poderia, por exemplo, criar um diretório com o nome da sua fonte, por exemplo my-favorito-castSob a pasta css do seu tema.

Agora você precisa registrar sua fonte de ícone com o WordPress. Para fazer isso, adicione isso no final do arquivo functions.php do seu tema.

//enregistrer la feuille de styles de votre fonte auprès de wordpress après upload
wp_enqueue_style('ma-fonte-favorite' ,get_stylesheet_directory_uri() . '/css/ma-fonte-favorite.css');
}
add_action('wp_enqueue_scripts', 'enqueue_icon_fonts_stylesheets');

 Certifique-se de substituir my-favorito-cast pelo nome da fonte do ícone de sua escolha. No bloco de código acima, você declara a função enqueue_icon_fonts_stylesheets quem faz uso da função especial wp_enqueue_style para registrar seu arquivo de estilo de fonte no WordPress. Finalmente, usando a função especial add_action, você conecta sua função (para execução futura) ao evento wp_enqueue_scripts para o arquivo . Css a fonte é adicionada ao cabeçalho da página.

Observe que, se você não quiser fazer upload de arquivos para o seu site, pode pesquisar para ver se a fonte do ícone de sua escolha está hospedada em um CDN. Se sim, sua função enqueue_icon_fonts_stylesheets deve ficar assim:


//example avec Fontawesome
//enregistrer la fonte auprès de wordpress via CDN
function enqueue_icon_fonts_stylesheets(){
wp_enqueue_style('font-awesome , '//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css');
}
add_action('wp_enqueue_scripts', enqueue_icon_fonts_stylesheets ');

A partir deste ponto, você pode usar sua fonte normalmente ou pode ler a documentação no site do desenvolvedor.

Com esse método, você pode adicionar várias fontes de ícone ao mesmo tempo, o que, por outro lado, pode tornar as páginas mais pesadas. Para solucionar esse problema, você pode usar o poder de serviços como Fontello, Icomoon ou Flaticon que permitem selecionar ícones individualmente em diferentes fontes existentes e compilá-los em uma única fonte que você poderá integrar posteriormente em seu site. Assim, você pode ter o melhor de várias fontes em uma.

Agora que você instalou fontes de ícones em seu site, pode querer adicionar ao seu menu do site.