📌 Como adicionar um favicon no WordPress: 3 formas para qualquer site

Um site sem favicon parece inacabado. Um visitante abre cinco separadores, procura o seu entre eles e não o encontra porque, em vez de um ícone, está lá um espaço reservado cinzento do navegador. Um pormenor? Sim. Mas são estes pormenores que moldam a impressão: alguém cuidou de si ou despachou o trabalho à pressa.

O WordPress simplificou a adição de um ícone de site a um par de cliques, mas metade dos proprietários de sites ou desconhece esta funcionalidade ou, depois de fazer o upload, depara-se com o favicon que não aparece. A razão é quase sempre a cache do navegador ou um tamanho de ficheiro incorreto.

A seguir, três formas funcionais de adicionar um favicon no WordPress: através do Personalizador (a mais fácil), manualmente por código e através de um plugin. Mais uma análise detalhada dos requisitos de tamanho e formato para que o ícone apareça em todo o lado: nos separadores, nos marcadores, no iPhone e no Android.

💡 Visão geral rápida:

• O que é um favicon e porque precisa dele: reconhecimento de marca, confiança, navegação por separadores
• Requisitos do ficheiro: uma imagem quadrada de tamanho padrão, formato PNG, ICO ou SVG
• Método 1: upload via "Site" → Personalizador (2 minutos, sem plugins)
• Método 2: inserção manual via functions.php ou header.php (para quem edita temas)
• Método 3: instalar o plugin Site Favicon (se o Personalizador não estiver disponível)
• O que fazer se o favicon não aparecer: cache do navegador, ICO antigo, CDN

Porque precisa de um favicon e quais são os requisitos

Um favicon (abreviatura de favorite icon) é um pequeno ícone que o navegador mostra à esquerda do título da página no separador, nos marcadores e no histórico de navegação. Um utilizador com uma dúzia de separadores abertos encontra o seu site visualmente numa fração de segundo, precisamente pelo favicon, e não pelo texto do título.

A segunda função é menos óbvia: o favicon contribui para a construção de uma micromarca. Quando alguém guarda uma página nos marcadores ou adiciona o site ao ecrã inicial do smartphone, é o ícone do site que aparece lá. Sem ele, o WordPress substitui-o por um espaço reservado cinzento ou por uma captura de ecrã da página, o que tem um aspeto descuidado.

Requisitos de tamanho e formato

Desde 2014, o WordPress suporta o upload de um ícone de site através do Personalizador. Os requisitos são padrão:

• Tamanho: 512×512 píxeis. O WordPress gera automaticamente cópias reduzidas para os navegadores (32×32, 180×180 para o ícone tátil da Apple, 192×192 e 512×512 para Android). Não precisa de fazer upload de ficheiros separados para cada resolução; o núcleo trata disso sozinho. Mais sobre os requisitos do ícone de site na documentação oficial do WordPress.
• Formato: PNG (recomendado), ICO ou SVG. O PNG oferece a melhor qualidade em ecrãs retina. O ICO, um formato legado para navegadores antigos, é praticamente desnecessário em 2026.
• O que usar como favicon: um logótipo que seja reconhecível num quadrado e legível quando reduzido significativamente. Três ou quatro letras de texto sobre um fundo colorido funcionam melhor do que uma ilustração complexa.

A regra principal ao preparar o ficheiro: tem de ser quadrado. O WordPress irá cortar forçosamente uma imagem não quadrada, e o resultado pode não ser do seu agrado.

Como adicionar um favicon no WordPress: 3 métodos

Método 1: através do Personalizador, o mais simples

Este método funciona em qualquer versão moderna do WordPress com um tema clássico. Para temas de blocos (FSE), o caminho é ligeiramente diferente; vou mostrar ambos.

Tema clássico (Personalizador):

• Inicie sessão na administração do WordPress.
• Vá a Aparência → Personalizar.
• Selecione a secção Identidade do Site. Em alguns temas, chama-se "Informação do Site" ou "Ícone e Logótipo do Site".
• Encontre o campo Ícone do Site. Clique em "Selecionar ícone do site" e faça upload de um PNG quadrado; o WordPress espera uma imagem de pelo menos 512×512, de acordo com a documentação.
• Se necessário, recorte a imagem usando o editor integrado e clique em "Guardar Alterações".

Tema de blocos (Editor de Site, WordPress 5.9+):

Se o tema suportar Edição Completa do Site, o Personalizador é substituído pelo Editor de Site. Vá a Aparência → Editor, abra o painel Estilos ou Definições, encontre a secção Ícone do Site e faça o upload da mesma imagem quadrada. A lógica é a mesma, a interface é diferente.

Depois de guardar, abra o site numa nova janela privada do navegador; o favicon deve aparecer no separador. Se não aparecer imediatamente, não entre em pânico: os navegadores guardam os favicons em cache de forma agressiva. Mais sobre isto na secção de Perguntas Frequentes abaixo.

Método 2: manualmente via functions.php

Uma opção para quem edita um tema filho e não quer depender do Personalizador. Adicione o seguinte código ao functions.php do tema filho ou através do plugin Code Snippets:

1
/**
2
 * Include favicon via wp_head.
3
 * The favicon.png file should be in the root of the child theme.
4
 */
5
add_action( 'wp_head', 'sdstudio_add_favicon' );
6
 
7
function sdstudio_add_favicon() {
8
    $favicon_url = get_stylesheet_directory_uri() . '/favicon.png';
9
    echo '<link rel="icon" href="' . esc_url( $favicon_url ) . '" type="image/png" sizes="512x512">' . "\n";
10
    echo '<link rel="apple-touch-icon" href="' . esc_url( $favicon_url ) . '" sizes="180x180">' . "\n";
11
}

O que está a acontecer aqui: o hook wp_head insere duas tags <link> no <head> de cada página. A primeira é um favicon padrão para navegadores, a segunda é um ícone tátil da Apple para dispositivos Apple (iPhone, iPad). A função get_stylesheet_directory_uri() devolve o URL do tema filho; o favicon precisa de ser colocado lá, na raiz da pasta do tema.

Não é necessário renomear o ficheiro para favicon.ico. O WordPress funciona bem com PNG, e os navegadores compreendem-no sem problemas. O principal é um quadrado de tamanho padrão.

Se estiver a ligar o favicon não a partir do tema, mas da raiz do site, substitua get_stylesheet_directory_uri() por home_url() e ajuste o caminho:

1
$favicon_url = home_url( '/favicon.png' );

Depois de adicionar o código, faça o upload do favicon.png para a pasta correspondente via FTP ou pelo gestor de ficheiros do alojamento. Verifique o resultado numa janela privada do navegador.

Método 3: através de um plugin

Se o Personalizador, por alguma razão, não permitir o upload de um ícone de site (isto acontece em temas personalizados e desatualizados), instale o plugin Site Favicon, que é minimalista e gratuito. Instale-o da forma padrão: Plugins → Adicionar Novo → pesquisar "Site Favicon" → Instalar → Ativar. Após a ativação, aparece um item de menu Definições → Site Favicon na administração, onde pode fazer o upload de um ícone e ver uma pré-visualização imediatamente.

Outra opção é o All in One SEO. Se o plugin de SEO já estiver no site, verifique as suas definições: há lá uma secção de upload de ícone de site que faz o mesmo sem um plugin adicional. Mas não recomendamos instalar uma suite de SEO pesada apenas para um favicon; o Site Favicon resolve a tarefa, pesa menos e não adiciona carga extra.

Depois de configurar o favicon usando qualquer um dos três métodos, verifique se o ícone aparece realmente: abra o site em modo anónimo e olhe para o separador do navegador.

O vídeo acima é uma demonstração passo a passo dos três métodos num site WordPress ativo. Se depois de ler ainda tiver dúvidas sobre algum dos passos, veja o vídeo: aos 1:15 mostram o upload via Personalizador, aos 3:40 o método manual.

⁉️🤔 Perguntas frequentes

Porque é que o favicon não aparece depois do upload via Personalizador?

Na maioria dos casos, o problema é a cache do navegador. Os favicons são armazenados em cache de forma agressiva; o navegador pode manter a versão antiga durante vários dias. Abra o site em modo anónimo (Ctrl+Shift+N no Chrome): se o ícone aparecer, o problema é de facto a cache. Limpe a cache do seu navegador ou aguarde que expire naturalmente. A segunda razão mais comum é o favicon ter sido carregado em formato ICO enquanto o navegador espera PNG. O WordPress desde a versão 4.3 prefere PNG; faça o upload de um quadrado de tamanho padrão em PNG, como a documentação exige, e o problema desaparecerá.

Posso usar o meu logótipo como favicon?

Pode e deve; é uma prática padrão. Mas nem todos os logótipos são adequados. Verifique como o seu logótipo fica em tamanho reduzido: se os detalhes se fundirem numa mancha ilegível, faça uma versão simplificada. Um bom exemplo é o ícone do WordPress (W sobre fundo azul): reconhecível mesmo num tamanho minúsculo. Um logótipo horizontal com dez letras de texto transformar-se-á numa faixa cinzenta quando reduzido significativamente; para o favicon, use apenas o símbolo sem o texto.

Porque é que o WordPress exige um favicon exatamente deste tamanho?

Para o WordPress, sim. O núcleo aceita exatamente este tamanho como fonte e gera automaticamente todas as cópias reduzidas necessárias; a documentação oficial confirma o requisito mínimo de 512 px em cada lado. Se fizer o upload de um favicon mais pequeno (por exemplo, 128×128), o redimensionamento para 512 píxeis ocorrerá com perda de qualidade, e em ecrãs retina o ícone parecerá desfocado. A exceção é se ligar o favicon manualmente via código (método 2): aí pode preparar vários tamanhos e especificá-los com tags <link> separadas.

Como removo ou substituo um favicon?

A substituição é feita através da mesma interface onde o carregou: Personalizador → Identidade do Site → Ícone do Site → "Remover" e depois faça o upload de um novo. O ícone antigo permanecerá na cache do navegador durante algum tempo (até vários dias); isto é normal. Para uma remoção completa, use o botão "Remover" na mesma interface, após o que o WordPress deixará de emitir as tags do favicon e o navegador voltará ao espaço reservado cinzento.

O favicon afeta o SEO?

Diretamente, não. O Google não usa a presença ou ausência de um favicon como fator de classificação. Indiretamente, sim: um site com favicon parece mais profissional, e é menos provável que os utilizadores o confundam com concorrentes ao navegar entre separadores. Isto reduz a taxa de pogo-sticking (retorno aos resultados de pesquisa), que os motores de busca têm em conta indiretamente. Além disso, o Google por vezes mostra favicons nos resultados de pesquisa móvel; o ícone torna o snippet visualmente mais notório, o que melhora a CTR.

Qual o método a escolher: um algoritmo curto

Se tem um tema padrão com Personalizador, use o método 1. São dois cliques, e o WordPress trata de todo o trabalho técnico: redimensionamento, geração de tags, suporte para Apple e Android. Nove em cada dez sites WordPress resolvem a questão do favicon exatamente desta forma.

Um tema personalizado sem suporte para ícone de site? Ligue-o via functions.php (método 2); o código de três linhas dá-lhe controlo total sobre tamanhos e formato. Guarde o plugin (método 3) para os casos em que nem o Personalizador nem a edição do tema estão disponíveis, por exemplo, se o site estiver numa instalação multisite com permissões restritas ou se estiver a trabalhar com um construtor que não dá acesso ao functions.php.

E o mais importante: depois de fazer o upload do favicon, verifique o site no modo anónimo de um novo navegador. Não confie numa janela normal; a versão antiga ou o próprio espaço reservado podem estar em cache lá. Vê o ícone no separador? Está feito.