Gerador de favicon
Os seus ficheiros de favicon
favicon.ico16, 32 e 48 px num só ficheiro, para todos os navegadores.favicon.svgNítido em qualquer tamanho, para os navegadores atuais.favicon-16x16.png, favicon-32x32.png, favicon-48x48.pngOs tamanhos pequenos em PNG.apple-touch-icon.png180 × 180 px, para os ecrãs principais do iPhone e do iPad.android-chrome-192x192.png, android-chrome-512x512.pngPara Android e aplicações web instaladas.site.webmanifestO nome do site e os ícones para Android.head-tags.htmlAs etiquetas abaixo, para colar no <head> da página.
<link rel="icon" href="/favicon.ico" sizes="48x48"> <link rel="icon" href="/favicon.svg" type="image/svg+xml"> <link rel="apple-touch-icon" href="/apple-touch-icon.png"> <link rel="manifest" href="/site.webmanifest"> <meta name="application-name" content="Acme Studio"> <!-- Criado com Elfsight: https://elfsight.pt/tools/favicon-generator/ -->
- Clique em Copiar código acima para o copiar.
- Descomprima os ficheiros e carregue-os para a pasta raiz do seu site, de modo que
yoursite.com/favicon.icoabra o ícone. - Abra o ficheiro HTML da página ou o modelo que todas as páginas usam.
- Cole o código dentro de
<head>, antes do</head>de fecho. - Guarde e carregue a página.
Onde carregar um favicon na sua plataforma
Shopify
No administrador do Shopify, vá a Loja online → Temas e clique em Editar tema.
Abra as Definições do tema (ícone de roda dentada) e depois Logótipo ou Favicon, consoante o seu tema.
Em Imagem do favicon, clique em Selecionar imagem e escolha o seu ficheiro.
Clique em Guardar. O favicon aparece na sua loja ativa, e não na pré-visualização do editor de temas.
HTML
Carregue os ficheiros gerados para a pasta raiz do seu site.
Cole as etiquetas
<link>geradas dentro de<head>em todas as páginas, ou pelo menos na página inicial.Certifique-se de que os ficheiros abrem num navegador, por exemplo
/favicon.ico.Limpe a cache do navegador para ver o novo ícone.
Porque é que o Google não mostra o seu favicon
O Google só mostra um favicon junto ao seu resultado se o conseguir encontrar e obter a partir da sua página inicial. Verifique estes pontos do guia de favicons do Google:
A etiqueta está na página inicial. O Google lê a etiqueta
<link rel="icon">no<head>da sua página inicial.shortcut icon,apple-touch-iconeapple-touch-icon-precomposedtambém funcionam.É quadrado. 1:1, com pelo menos 8 × 8 px. O Google recomenda mais de 48 × 48 px para ficar nítido.
O formato é suportado: ICO, PNG, GIF, JPEG, BMP, PPM ou TIFF. O SVG não consta da lista do Google, por isso adicione um ICO ou PNG ao lado de um ícone SVG.
O Google consegue rastreá-lo. O robots.txt não pode bloquear o ficheiro do ícone (para o Googlebot-Image) nem a sua página inicial (para o Googlebot).
O URL mantém-se. Não altere com frequência o endereço do favicon.
Um favicon por nome de anfitrião.
example.comeshop.example.compodem ter ícones diferentes.example.com/shopnão pode; usa o ícone do site.Representa a sua marca. O Google substitui os ícones inadequados por um predefinido.
As alterações aparecem depois de o Google voltar a rastrear a sua página inicial, o que pode demorar dias ou semanas. Pode pedir a indexação da página inicial na ferramenta de Inspeção de URL do Search Console. Alguns construtores de sites ainda dizem que o tamanho tem de ser múltiplo de 48 px. Essa era a regra antiga do Google, e esses tamanhos continuam a funcionar bem.
Como adicionar um favicon ao seu site
Desenhe o ícone
Use uma ou duas letras ou um emoji, ou carregue um logótipo quadrado.
Transfira o zip
Inclui o favicon.ico, tamanhos PNG para telemóveis, um SVG, o manifesto web e as etiquetas HTML.
Carregue os ficheiros
Coloque os ficheiros na pasta raiz do seu site e cole as etiquetas no
<head>. Os construtores de sites costumam ter um campo de favicon — carregue aí o PNG de 512 px.