Você sabe que existem muitas maneiras de melhorar a experiência do usuário em através do design, e uma delas é adicionar ou alterar os ícones do painel de administração do WordPress. Personalizar o painel do WordPress não se resume apenas à aparência — trata-se de tornar o seu site mais fácil e agradável de usar! Uma maneira rápida de começar é adicionando ou alterando os ícones do painel de administração.
Ícones personalizados podem agilizar seu fluxo de trabalho e facilitar a navegação, principalmente para novos usuários. Além disso, um painel personalizado é muito mais acolhedor e agradável de usar!
Hoje, vamos explorar tudo sobre os ícones de administração do WordPress, mostrar como adicionar ícones facilmente usando um plugin e explorar como usar uma fonte de ícones do WordPress. Pronto para melhorar a experiência do usuário do seu site? Então, vamos começar!
Entendendo os ícones de administração do WordPress
do WordPress são aquelas pequenas imagens que você vê ao lado de cada item de menu no painel de controle do WordPress. Eles ajudam a tornar o painel de navegação mais intuitivo e visualmente organizado. Por padrão, o WordPress usa Dashiconsde ícones fonte que existe desde 2013 e não mudou muito desde então.
Se você deseja renovar a área administrativa do seu WordPress, trocar esses ícones pode ser um ótimo ponto de partida! Você pode substituir os ícones padrão por outros que combinem melhor com o seu estilo ou até mesmo adicionar ícones personalizados para um visual totalmente exclusivo.
Os ícones são poderosos porque são universalmente reconhecidos e facilitam a localização do que as pessoas precisam, seja uma página de login, um artigo específico ou outras seções importantes do site. Isso pode ser especialmente útil se você estiver trabalhando em um site multilíngue ou tiver um público internacional.
Para clientes de web design que não estão familiarizados com o WordPress, ícones personalizados podem simplificar a navegação no painel de administração e tornar a experiência mais personalizada.
Saiba mais sobre: Como corrigir o problema de ícones do Elementor que não aparecem?
Os ícones de administração do WordPress são elementos essenciais de design web para o seu site
Entre em contato com nossos web designers e adicione ou altere facilmente os ícones de administração do WordPress, melhorando a experiência do usuário em seu site.
Como adicionar ou alterar ícones de administração do WordPress: dois métodos
Agora que você conhece a função dos ícones de administração do WordPress, é hora de entender como adicionar ou alterar esses ícones. Existem duas maneiras fáceis de modificar os ícones de administração do WordPress. A primeira é usar um plugin, o que permite fazer isso de forma rápida e fácil. A segunda é alterar os ícones de administração usando um trecho de código.
Analisaremos os dois métodos para ajudá-lo a decidir qual funciona melhor para você. Vamos lá:
Como adicionar ou alterar ícones de administração do WordPress usando um plugin
Se você é iniciante na adição de ícones no WordPress, usar um plugin é a maneira mais fácil de começar. Neste guia, mostraremos como adicionar ícones usando o Font Awesome plugin
Para adicionar ícones do Font Awesome ao seu site WordPress, siga estes passos simples:
Instale e ative o plugin.
Primeiro, faça login no painel do WordPress, depois acesse Plugins e instale e ative o plugin Font Awesome.
Ajuste as configurações do plugin conforme necessário.
Após a ativação, você será redirecionado para a de Plugins Instalados . Encontre o Font Awesome e clique em Configurações. O plugin está configurado para usar ícones da web gratuitos através do CDN por padrão, então, se você estiver satisfeito com isso, está tudo pronto.
Saiba como excluir usuários administradores invisíveis do WordPress?
Se você quiser ícones gratuitos e pagos, precisará criar um Font Awesome Kit, obter um token de API e adicioná-lo às configurações do plugin. (Mas se você estiver procurando apenas por ícones básicos, pode pular esta etapa!) Depois de concluir, não se esqueça de clicar em Salvar alterações.
Adicione o ícone onde você deseja que ele apareça.
Agora vem a parte divertida! Ícones do Font Awesome podem ser adicionados usando um shortcode ou um de HTML . O formato do shortcode é [icon name= “value”]. Basta substituir “value” pelo nome do ícone desejado. Por exemplo, para adicionar um ícone de prêmio, use [icon name= “award”].
Se você se sente mais confortável com HTML, pode usar a sintaxe padrão do Font Awesome. O Font Awesome fornece trechos de HTML para cada ícone, então basta copiar e colar onde você quiser que o ícone apareça.
Visualize suas alterações.
Antes de publicar, visualize a postagem ou página para garantir que o ícone esteja correto. Se ele não aparecer, verifique se você está usando um ícone gratuito e não um premium.
Saiba também: Como editar e personalizar cabeçalhos no WordPress sem problemas?
Método 2: Como adicionar ou alterar manualmente ícones do menu de administração usando um trecho de código
Se você estiver disposto a colocar a mão na massa, pode personalizar os ícones de administrador adicionando um pouco de código.
Antes de começar, recomendamos que você dê uma olhada no guia rápido sobre como adicionar código personalizado no WordPress com segurança, caso nunca tenha feito isso antes.
A maneira mais fácil e segura de fazer isso é com o WPCode , que é ótimo para adicionar código personalizado, CSSe HTML sem o risco de danificar nada. Além disso, existe uma versão gratuita (WPCode Lite) que resolve o problema, embora a versão Pro inclua alguns recursos extras muito úteis.
Exemplo: Substituindo um ícone usando os ícones padrão do painel
Neste exemplo, usaremos o Dashicons (conjunto de ícones integrado do WordPress) para substituir um ícone existente. Como os Dashicons são otimizados para WordPress, eles não deixarão seu site mais lento.
Eis o que você precisará antes de começar:
- O URL do item de menu que você deseja atualizar
- O nome do ícone que você deseja usar
Digamos que você queira alterar o ícone do menu "Posts". Basta passar o cursor sobre o item de menu "Posts" no seu painel de controle e você verá o URL na barra de status na parte inferior do seu navegador. Você só precisa da última parte — neste caso, seria edit.php.
Em seguida, acesse o site da Dashicons, encontre o ícone desejado e copie seu "slug" (como dash icons-format-aside).
Agora, vamos adicionar o código:
- Acesse Trechos de Código » Adicionar Trecho de Código no seu painel.
- Clique em + Adicionar Snippet Personalizado e dê um título ao seu snippet.
- Selecione "Snippet PHP" em "Tipo de código"e cole o seguinte código no editor:
function change_post_menu_icon() {global $menu;// Percorre os itens do menuforeach ($menu as $key => $menu_item) {// Encontra o item de menu “Posts” (a URL padrão é 'edit.php')if (isset($menu_item[2]) && $menu_item[2] == 'edit.php') {// Altera o ícone para uma classe Dashicon diferente$menu[$key][6] = 'dashicons-format-aside'; // Altere isso para o slug Dashicon de sua preferência}}}add_action('admin_menu', 'change_post_menu_icon');
Basta substituir dashicons-format-aside pelo slug do ícone que você copiou anteriormente.
Depois de inserir o código, role para baixo até a Inserção , defina o Local como 'Somente administrador' e ative o snippet .Em seguida, clique em Salvar snippet.
Agora, o WordPress começará a usar o ícone escolhido para a página de Postagens — assim, sem mais nem menos!
Relacionado: Como configurar shortcodes do Elementor para facilitar o uso de templates
Concluindo
Como você pode ver, adicionar ou alterar os ícones do painel de administração do WordPress não é difícil. Depois de entender a essência e a função desses ícones, eles ajudarão você a aprimorar e ampliar o design do seu site e a experiência do usuário.
Seja usando um plugin para trocar ícones rapidamente ou adicionando código personalizado para uma abordagem mais prática, o processo é simples e pode fazer uma grande diferença, especialmente para clientes ou usuários que não estão familiarizados com o WordPress. Então, vá em frente — dê uma repaginada na sua área administrativa e deixe-a com a sua cara!
