Como adicionar um favicon no WordPress
WordPress chama isso de Site Icon e pode gerar todos os tamanhos a partir de um upload. Este passo a passo cobre Customizer, substituições de tema, casos extremos de vários sites, exemplos, perguntas frequentes e problemas de cache que fazem os ícones parecerem travados após a inicialização.
Como WordPress lida com favicons
Desde WordPress 4.3, o core vem com um recurso Site Icon que corta, redimensiona e injeta as tags <link> corretas para você. Nenhum plugin é necessário para sites padrão. Use nosso [gerador favicon] (ferramenta: gerador favicon), [conversor PNG para ICO] (ferramenta: png-to-ico), [conversor SVG para ICO] (ferramenta: svg-to-ico) e [testador favicon ao vivo] (utilitário: favicon-tester) para construir e verificar seu conjunto de ícones e ler o companion guide para um passo a passo condensado.
Os ícones carregados são armazenados na Biblioteca de Mídia e referenciados via wp_site_icon() no front end. WordPress gera vários tamanhos no lado do servidor quando você publica.
O recurso substitui uploads manuais favicon.ico para a maioria dos blogueiros, agências e lojas WooCommerce.
Use our favicon generator, PNG to ICO converter, SVG to ICO converter, and live favicon tester to build and verify your icon set, and read the companion guide for a condensed walkthrough.
Através do Customizer (recomendado)
No wp-admin vá para Aparência → Personalizar → Identidade do site → Site Icon.
Clique em Selecionar Site Icon e carregue um PNG quadrado com pelo menos 512×512 pixels. WordPress mostra um cortador vivo – centralize sua logomarca dentro da área quadrada segura.
Clique em Publicar. O núcleo gera ícone apple-touch, vários tamanhos PNG e meta tags no próximo carregamento da página front-end.
Através do seu tema ou código
Para ícones por seção ou marcas de subdiretórios, filtre get_site_icon_url() em seu tema filho functions.php.
Exemplo de caso de uso: uma rede multisite onde cada subsite precisa de uma marca distinta, mas compartilha um tema. Retorne URLs diferentes com base em blog_id.
Equipes avançadas podem retirar da fila o meta ícone do site padrão e imprimir tags <link> personalizadas em header.php, mas isso duplica o núcleo de trabalho já funciona bem.
Exemplos
Blog único: carregue 512×512 PNG via Customizer. Pronto — sem FTP, sem edição .ico.
Loja WooCommerce: mesmo fluxo; verifique o ícone nas páginas de checkout e de conta, não apenas na página inicial. Os plug-ins de cache às vezes atrasam CSS, mas raramente bloqueiam tags de ícone.
Headless WordPress: as tags Site Icon aparecem apenas em páginas renderizadas em PHP. Seu front end Next.js deve declarar suas próprias tags <link> nessa arquitetura.
Preparação → produção: faça upload novamente ou migre o ID da mídia. Codifique URLs de ícones absolutos somente se você entender a invalidação do cache CDN.
Plug-ins e quando ignorá-los
Plugins populares de SEO também podem expor uma configuração favicon. Evite configurar o plugin SEO e Site Icon de maneira diferente – escolha uma fonte de verdade.
Plug-ins de cache (WP Rocket, W3 Total Cache) não devem bloquear arquivos de ícone, mas podem armazenar em cache HTML sem novas tags até serem eliminados.
Os plug-ins Favicon faziam sentido antes do WordPress 4.3. Em 2026, eles serão redundantes, a menos que você precise de trocas de ícones animadas ou programadas.
Perguntas frequentes
Que tipo de arquivo devo enviar? PNG é o mais seguro. WordPress aceita JPG, mas você perde transparência.
Tamanho mínimo? 512×512 oficialmente; fontes maiores reduzem a escala bem.
WordPress cria favicon.ico? Ele emite tamanhos PNG e metatags. Os navegadores ainda se beneficiam ao colocar um .ico real na raiz da web por meio de hospedagem ou de um tema filho.
Multisite: cada site tem seu próprio Site Icon em seu próprio Customizer. Os administradores de rede definem por site, a menos que um tema filtre URLs globalmente.
Por que meu favicon não está sendo atualizado?
Os navegadores armazenam em cache favicons separadamente de HTML. Após publicar em WordPress, atualize ou teste em uma janela privada.
Anexe ?ver=2 aos URLs dos ícones somente se você rolar as tags manualmente. URLs Site Icon incluem argumentos de consulta que mudam quando você faz um novo upload.
Limpe o cache do objeto WordPress e qualquer CDN (Cloudflare, Jetpack Boost) se o HTML ainda fizer referência a um URL de anexo antigo.
Se você migrou domínios, pesquise no banco de dados URLs de ícones antigos em opções serializadas – alguns importadores perdem siteicon_id.
Solução de problemas
Ícone desfocado após upload: a imagem de origem era menor que 512×512 ou não era quadrada. Regenere a partir de um mestre maior.
Nenhum ícone nos resultados do Google: o Google usa seu próprio cache; solicitar reindexação no Search Console após atualizar Site Icon.
Ícone na área de trabalho, mas não no iPhone: iOS precisa do ícone apple-touch; confirme se Site Icon foi publicado e não apenas salvo como rascunho em Customizer.
Caixa branca ao redor do logotipo: JPG carregado com fundo branco em vez de PNG transparente.
Considerações sobre hospedagem e CDN
Hosts WordPress gerenciados (WP Engine, Kinsta, SiteGround) armazenam em cache HTML na borda. Após alterar Site Icon, limpe todos os caches do painel do host.
Os proxies de nuvem laranja da Cloudflare podem armazenar em cache HTML sem armazenar em cache /wp-content/uploads/ ícones – geralmente bons, mas são eliminados quando os URLs de anexo de ícone mudam.
Plug-ins multilíngues (WPML, Polylang) não duplicam Site Icon por idioma por padrão. Um ícone atende todas as localidades, a menos que você filtre URLs.
Configurações básicas ou sem cabeça podem realocar uploads. Confirme os URLs de mídia no ponto front-end HTML onde seu CDN os espera.
Se você fornecer exportação estática (Simply Static, WP2Static), gere novamente a exportação após as alterações do ícone para que HTML off-line colete novos IDs de anexo.
Permissões e funções
Somente usuários com capacidade de personalização (normalmente administradores e editores em instalações padrão) podem alterar Site Icon. Os autores não podem trocar a marca sem direitos elevados.
Em vários sites, os superadministradores podem fazer upload de temas para toda a rede, mas Site Icon permanece por site, a menos que o código personalizado compartilhe um URL de anexo.
Audite temas de administração de terceiros que ocultam Aparência → Personalizar. Pode ser necessário reativar Customizer ou usar o link direto Customizer ?autofocus[section]=title_tagline.
Ao entregar um site a um cliente, documente que as alterações de favicon estão em Personalização, não apenas na Biblioteca de mídia - carregar PNG lá sem atribuir Site Icon não faz nada.
WooCommerce e sites de membros
O checkout do WooCommerce usa o mesmo tema do resto da loja. Site Icon aparece no carrinho e nas páginas de agradecimento automaticamente.
Plug-ins de associação que substituem modelos de front-end ainda devem chamar wp_head() para meta saídas Site Icon.
Portais de clientes de marca branca às vezes eliminam os ganchos de branding – verifique se o recurso de personalização não está desabilitado nas funções de assinante se os clientes fizerem upload de seu próprio ícone.
Os modelos de email não usam Site Icon. O logotipo do e-mail WooCommerce é uma configuração separada em Aparência → Personalizar → WooCommerce.
Migrando do manual favicon.ico
Se você carregou favicon.ico por FTP anteriormente para a raiz da web, Site Icon não o exclui. Os navegadores podem preferir uma fonte a outra de forma imprevisível.
Escolha uma abordagem: confie nas saídas Site Icon PNG ou mantenha um ICO feito à mão na raiz com design correspondente. Remova duplicatas após o controle de qualidade.
Temas clássicos com link codificado rel=icon em header.php podem combater o núcleo Site Icon. Remova tags manuais ao ativar Site Icon.
Após a migração, limpe os caches e teste a navegação privada para ver qual ícone vence.
Documente a abordagem escolhida em seu runbook para que o próximo desenvolvedor não adicione um segundo plugin favicon conflitante.