Cómo añadir un favicon a tu tienda Shopify (guía 2026)

Toda tienda Shopify recibe un favicon genérico por defecto — reemplazarlo por el icono de tu marca es una de las victorias de confianza más rápidas que puedes conseguir. Shopify lo pone fácil mediante el editor de temas, sin necesidad de código. Aquí están los pasos.

La forma fácil: subir mediante los ajustes del tema

Primero, genera un PNG de 32×32 (o hasta 180×180) a partir de tu logo.
En tu administración de Shopify, ve a Online Store → Themes.
Junto a tu tema activo, haz clic en Customize.
En la barra lateral del editor de temas, haz clic en Theme settings (el icono de engranaje arriba).
Busca la sección Favicon y haz clic en Select para subir tu PNG.
Haz clic en Save.

¿Necesitas un PNG de favicon listo para Shopify? Sube tu logo a Favicon.one y descarga un paquete con todos los tamaños que Shopify podría necesitar.

Requisitos de tamaño del favicon en Shopify

Shopify recomienda un PNG de 32×32 como tamaño de visualización.
Puedes subir una imagen cuadrada más grande (hasta 180×180); Shopify la redimensiona.
Usa un PNG con transparencia para que el icono se vea limpio en las pestañas del navegador.
Mantén el archivo por debajo de 1 MB.

El favicon se ve distinto en Google Search

Una queja común: tu favicon se ve bien en la pestaña del navegador pero mal (o no aparece) en los resultados de búsqueda de Google. Normalmente es caching — Google vuelve a rastrear los favicons con su propio calendario, a veces tardando días o semanas. Soluciones:

Solicita el reindexado de tu página de inicio en Google Search Console.
Asegúrate de que tu favicon sea un cuadrado de al menos 48×48 (los múltiplos de 48 son ideales).
Verifica que la etiqueta <link rel="icon"> esté en el HTML de tu tienda.

Método manual: editar el código de tu tema

Si tu tema no ofrece un ajuste de favicon, puedes añadirlo manualmente.

Sube tu archivo de favicon en Content → Files (o vía Settings → Files) y copia su URL.
Ve a Online Store → Themes → Actions → Edit code.
Abre layout/theme.liquid.
Dentro de la etiqueta <head>, añade:

<link rel="icon" type="image/png" href="{{ 'favicon.png' | asset_url }}">
<link rel="apple-touch-icon" href="{{ 'apple-touch-icon.png' | asset_url }}">

(Usa el filtro asset_url de Shopify si pones los archivos en la carpeta assets/ de tu tema, o pega la URL completa del archivo desde Content → Files.)

Favicon del checkout

En Shopify Plus, puedes personalizar el favicon del checkout mediante el layout checkout.liquid. En los planes estándar, el checkout usa el favicon de tu tienda automáticamente una vez configurado en los ajustes del tema.

Mi favicon de Shopify no aparece

Borra la caché. La CDN de Shopify almacena favicons en caché — espera unos minutos o prueba en otro navegador.
Tipo de archivo incorrecto. El cargador de Shopify prefiere PNG. Convierte primero tu ICO/JPG.
El tema lo sobrescribe. Algunos temas personalizados tienen un favicon incrustado en theme.liquid. Revísalo.
Imagen no cuadrada. Recorta a 1:1 antes de subir.

Para la lista de verificación general, consulta “¿El favicon no aparece?”.