O ícone do site, também conhecido como favicon, é aquela pequena imagem que aparece na aba do navegador, nos favoritos e em atalhos na tela do celular.
Ele parece um detalhe simples, mas faz muita diferença na identidade visual, passa mais profissionalismo e ajuda o visitante a reconhecer o seu site com mais facilidade entre várias abas abertas.
No WordPress, é possível alterar esse ícone de forma rápida, sem precisar mexer em código. Neste artigo, você vai aprender passo a passo como mudar o ícone do site ou da sua landing page usando os recursos nativos do WordPress e, se quiser, via tema ou page builder.
🧩 O que é o ícone do site (favicon) no WordPress?
O ícone do site é uma pequena imagem quadrada que representa visualmente o seu projeto.
Ele aparece em:
- Aba do navegador (Chrome, Edge, Firefox etc.)
- Favoritos/salvos do navegador
- Tela inicial do celular (quando alguém adiciona o site como atalho)
Normalmente, o tamanho usado é 512 x 512 px (ou algo proporcional), em PNG ou JPG, com fundo transparente ou sólido.
🛠️ Passo 1: Prepare o Ícone do Seu Site
Antes de subir o ícone no WordPress, é importante ter a imagem pronta:
- Formato: PNG (preferencialmente) ou JPG
- Tamanho recomendado: 512 x 512 px
- Formato quadrado: 1:1
- Design simples: logotipo simplificado, símbolo ou inicial da marca
Você pode criar esse ícone em ferramentas como Canva, Photoshop, Figma, Photopea ou qualquer editor de imagem.
🌐 Passo 2: Alterando o Ícone do Site Pelo Personalizar (Temas Clássicos)
Se você usa um tema tradicional do WordPress (como Astra, OceanWP, Neve, GeneratePress, etc.), o caminho mais comum é pelo Personalizar.
Passo a passo:
- Acesse o painel do WordPress.
- Vá em Aparência → Personalizar.
- Procure a opção Identidade do site (ou “Site Identity”).
- Dentro dessa seção, você verá o campo Ícone do site ou Site Icon.
- Clique em Selecionar ícone do site.
- Envie a imagem ou escolha uma já existente na Mídia.
- Ajuste o recorte se o WordPress pedir.
- Clique em Publicar para salvar as alterações.
Depois disso, o novo ícone passará a ser exibido nas abas do navegador e nos favoritos.
🧱 Passo 3: Alterando o Ícone do Site no Editor de Site (Temas em Blocos)
Se você usa um tema em blocos (Full Site Editing), como Twenty Twenty-Three, Twenty Twenty-Four ou outros baseados em blocos, o caminho muda um pouco.
Passo a passo:
- No painel do WordPress, vá em Aparência → Editor (ou “Editor do Site”).
- Na parte superior, procure por Configurações do site ou Configurações globais (ícone de engrenagem ou opções).
- Acesse a área de Identidade do site.
- Você verá campos como:
- Título do site
- Descrição
- Logotipo
- Ícone do site / favicon
- Clique em Selecionar ícone do site.
- Envie a imagem e salve.
O conceito é o mesmo: você define um ícone global que será usado em todo o site, incluindo suas landing pages.
🎯 Passo 4: E se a Landing Page For Feita com Elementor, Divi ou Outro Page Builder?
Muita gente confunde:
- O layout da landing page é controlado pelo page builder (Elementor, Divi, Brizy, etc.).
- Mas o ícone do site continua sendo controlado pelas configurações gerais do WordPress/tema.
Ou seja, mesmo que a sua landing page seja feita com Elementor, por exemplo, o ícone do site é alterado nos mesmos locais:
- Aparência → Personalizar → Identidade do site
- ou Aparência → Editor → Identidade do site (em temas de blocos)
Alguns temas ou page builders até têm atalhos nas suas próprias configurações, mas por trás é sempre a mesma função nativa do WordPress.
🔄 Passo 5: Limpar Cache e Ver o Novo Ícone
Depois de trocar o ícone, você pode notar que o navegador continua mostrando o ícone antigo. Isso é normal e acontece por causa de cache.
Para ver o novo favicon:
- Atualize a página com Ctrl + F5 (ou use aba anônima)
- Limpe o cache do navegador
- Se usar plugin de cache (LiteSpeed, WP Rocket, etc.), limpe o cache do site
- Em alguns casos, o navegador leva alguns minutos para atualizar o ícone em todas as abas e favoritos
💡 Dicas Importantes para um Bom Ícone de Site
- Use uma versão simplificada do seu logo, ícones cheios de texto quase não são legíveis no tamanho pequeno.
- Prefira contraste forte entre fundo e símbolo.
- Pense em algo que identifique visualmente sua marca em 1 segundo entre várias abas abertas.
- Se possível, teste em navegadores diferentes (Chrome, Edge, Firefox) e em dispositivos móveis.
🏁 Conclusão
Mudar o ícone do site/landing page no WordPress é um processo simples, mas que traz um ganho enorme em profissionalismo e identidade visual.
Basta seguir estes passos:
- Criar um ícone no tamanho certo (512×512, quadrado);
- Acessar Aparência → Personalizar → Identidade do site ou Aparência → Editor → Identidade do site;
- Enviar e definir o novo ícone;
- Limpar cache para visualizar a mudança.
Com isso, seu site fica mais organizado, reconhecível e com aparência muito mais profissional tanto em desktop quanto em dispositivos móveis.