Shopify Liquid para SEO: snippets útiles para temas en 2026
5 áreas SEO de Shopify viven en Liquid, no en el admin. Snippets prácticos para meta tags, JSON-LD, hreflang y Open Graph que escalan a miles de URLs.
En este artículo
Liquid es lo que separa un Shopify con SEO improvisado de uno que escala bien a miles de URLs. La interfaz de Shopify expone solo una parte de lo que el theme controla: title tags, meta descriptions, canonicals, schema.org, hreflang y Open Graph viven en Liquid, no en el panel de administración. Tocar esos archivos es la diferencia entre un theme genérico y uno optimizado.
Esta guía recoge los snippets de Liquid que uso más a menudo cuando audito o reescribo el SEO técnico de un Shopify. Cada uno resuelve un problema concreto que la UI de Shopify no permite arreglar bien.
En 30 segundos:
- Liquid es el lenguaje de plantillas open-source de Shopify, en uso desde 2006 y escrito en Ruby (Shopify Liquid, 2024)
- 5 áreas SEO clave dependen de Liquid: meta tags dinámicos, schema.org, hreflang, Open Graph y robots customizado
- Shopify expone decenas de objetos Liquid (product, collection, shop, page, blog, article, request, canonical_url…) que se pueden combinar para SEO dinámico (Shopify Liquid Reference, 2025)
- El theme.liquid es el archivo más rentable de optimizar: cambios ahí se propagan a todas las URLs
- Los snippets de este post requieren acceso al theme code editor (online store > themes > edit code) o trabajar con un theme custom
¿Qué hace Liquid relevante para SEO?
Liquid es el lenguaje de plantillas que Shopify usa para renderizar HTML dinámicamente. Cuando un usuario abre una página de producto, Shopify ejecuta el theme con el objeto product poblado y devuelve HTML estático al navegador. Para SEO esto significa que todas las etiquetas que Google y los crawlers AI leen, se construyen en Liquid antes del render.
A diferencia de otros CMS, Shopify no tiene plugins SEO universales. Yoast no existe aquí. Las apps de SEO en Shopify (SEO Manager, Smart SEO, etc.) son envoltorios que insertan código en el theme. Si entiendes Liquid, no necesitas la app, y casi siempre obtienes un control más fino.
Los objetos Liquid que más uso en SEO técnico son product, collection, shop, page, request.canonical_url, current_page y localization. Combinados con filtros como default, escape, strip_html, truncate y image_url, cubren el 90% de las necesidades.
¿Cómo generar title, description y canonical dinámicos en Liquid?
Las plantillas por defecto de Shopify generan títulos genéricos del tipo “Producto X – Mi Tienda”. Eso desperdicia el espacio de SERP. El siguiente snippet, colocado en el <head> de theme.liquid, genera títulos optimizados con fallbacks explícitos para cada plantilla:
{% if template contains 'product' %}
<title>{{ product.title }} – {{ product.vendor }} | {{ shop.name }}</title>
<meta name="description" content="{{ product.description | strip_html | truncate: 155 }}">
{% elsif template contains 'collection' %}
<title>{{ collection.title }} | {{ shop.name }}</title>
<meta name="description" content="{{ collection.description | strip_html | default: collection.title | truncate: 155 }}">
{% elsif template == 'index' %}
<title>{{ shop.name }} – {{ shop.description }}</title>
<meta name="description" content="{{ shop.description | truncate: 155 }}">
{% else %}
<title>{{ page_title }} | {{ shop.name }}</title>
<meta name="description" content="{{ page_description | default: shop.description | truncate: 155 }}">
{% endif %}
<link rel="canonical" href="{{ canonical_url }}">Tres detalles importantes en este snippet. Primero, el filtro strip_html evita que código HTML del editor enriquecido contamine la meta description. Segundo, truncate: 155 mantiene la descripción dentro del límite SERP. Tercero, {{ canonical_url }} es la variable nativa de Shopify y respeta automáticamente el dominio principal y los parámetros UTM excluidos, así que no tienes que construirlo manualmente.
¿Cómo inyectar JSON-LD a escala con Liquid?
Schema.org en Shopify es uno de los puntos donde más se pierde tráfico de búsqueda enriquecida. La mayoría de themes incluyen un Product schema básico, pero falta breadcrumb, FAQ y Organization. El siguiente snippet, en una {% if template contains 'product' %} dentro del head, cubre el caso producto:
{% if template contains 'product' %}
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Product",
"name": {{ product.title | json }},
"image": {{ product.featured_image | image_url: width: 1200 | prepend: 'https:' | json }},
"description": {{ product.description | strip_html | json }},
"sku": {{ product.selected_or_first_available_variant.sku | json }},
"brand": {
"@type": "Brand",
"name": {{ product.vendor | json }}
},
"offers": {
"@type": "Offer",
"url": {{ shop.url | append: product.url | json }},
"priceCurrency": {{ shop.currency | json }},
"price": {{ product.selected_or_first_available_variant.price | money_without_currency | replace: ',', '.' | json }},
"availability": "{% if product.available %}https://schema.org/InStock{% else %}https://schema.org/OutOfStock{% endif %}"
}
}
</script>
{% endif %}¿Qué hace este snippet diferente de lo que genera Shopify por defecto? El filtro | json. Ese filtro escapa caracteres especiales (comillas, saltos de línea, acentos) que de otro modo romperían el JSON-LD. Sin ese filtro, una descripción con una comilla suelta deja el schema inválido y Google deja de leerlo. Si quieres profundizar en cómo combinar Product, BreadcrumbList y FAQ con el mismo patrón, escribí una guía dedicada sobre schema markup en Shopify.
Cuándo el schema falla en silencio. Muchas tiendas tienen schema mal formado y no lo saben porque el preview en Google Rich Results Test parece bien. El error frecuente: comparar precio con coma en lugar de punto ("price": "29,99" rompe, "price": "29.99" funciona). El filtro replace: ',', '.' del snippet evita este error.
¿Cómo gestionar hreflang en Shopify con Liquid?
Shopify Markets generó la mayor mejora de SEO multi-idioma en años, pero las etiquetas hreflang automáticas no siempre son correctas, especialmente cuando hay dominios distintos por mercado. El siguiente snippet en theme.liquid genera hreflang dinámico a partir del objeto localization:
{% if localization.available_languages.size > 1 or localization.available_countries.size > 1 %}
{% for language in localization.available_languages %}
<link rel="alternate"
hreflang="{{ language.iso_code }}"
href="https://{{ shop.domain }}/{{ language.iso_code }}{{ canonical_url | remove_first: shop.url }}">
{% endfor %}
<link rel="alternate" hreflang="x-default" href="{{ canonical_url }}">
{% endif %}Tres reglas que veo violar en cada auditoría de Shopify internacional. Una: cada URL traducida debe tener un hreflang bidireccional (es ↔ en, no solo es → en). El bucle for resuelve esto. Dos: la etiqueta x-default es obligatoria si hay idiomas múltiples. Tres: el iso_code debe ser válido (en-GB, en-US, no en-UK ni english). El objeto language de Shopify devuelve códigos válidos por defecto.
Si tu tienda usa subdominios o dominios separados por mercado en lugar de subdirectorios, el snippet anterior no funciona — necesitas mapear cada mercado a su dominio en una case/when. Lo cubrí con más detalle en Shopify SEO para ecommerce 2026.
¿Cómo configurar Open Graph dinámico en Liquid?
Las tarjetas de Facebook, LinkedIn y los previews de WhatsApp dependen de Open Graph. Shopify no genera OG correcto por defecto en los themes antiguos. El snippet:
<meta property="og:title" content="{{ page_title | default: shop.name | escape }}">
<meta property="og:description" content="{{ page_description | default: shop.description | escape | truncate: 155 }}">
<meta property="og:url" content="{{ canonical_url }}">
<meta property="og:site_name" content="{{ shop.name | escape }}">
<meta property="og:type" content="{% if template contains 'product' %}product{% elsif template contains 'article' %}article{% else %}website{% endif %}">
{% if template contains 'product' and product.featured_image %}
<meta property="og:image" content="{{ product.featured_image | image_url: width: 1200 | prepend: 'https:' }}">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="{{ 1200 | divided_by: product.featured_image.aspect_ratio | round }}">
<meta property="product:price:amount" content="{{ product.price | money_without_currency }}">
<meta property="product:price:currency" content="{{ shop.currency }}">
{% elsif settings.share_image %}
<meta property="og:image" content="{{ settings.share_image | image_url: width: 1200 | prepend: 'https:' }}">
{% endif %}
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="{{ page_title | default: shop.name | escape }}">
<meta name="twitter:description" content="{{ page_description | default: shop.description | escape | truncate: 155 }}">El filtro escape evita que comillas en el título rompan el HTML. El og:type cambia según la plantilla, que es lo que LinkedIn y Facebook esperan. La altura calculada con aspect_ratio mantiene la proporción correcta sin recortes.
¿Qué errores en theme.liquid hieren más al SEO?
He auditado decenas de Shopify y los patrones que se repiten son siempre los mismos. Los cinco más caros:
El primero es la falta del filtro escape en meta tags. Una sola comilla en page_title rompe el HTML del head, y he visto sites perder rich snippets durante meses por exactamente esto. El segundo: schema.org duplicado, cuando las apps SEO instalan su propio JSON-LD sin desinstalar el del theme y aparecen dos Product schemas en la misma página. Google lo lee como ambiguo y deja de mostrar el precio en SERP.
- Canonical apuntando a la URL con parámetros de tracking. El truco: usar
{{ canonical_url }}(variable nativa) en lugar de{{ request.path }}o construirlo manualmente. La variable nativa ya excluye parámetros UTM. - Imágenes sin lazy loading o sin atributos
width/height. Liquid puede generar ambos automáticamente con el filtroimage_urly los modificadoreswidth. Hacerlo mejora Core Web Vitals. - Y el más caro de todos: bloques noindex olvidados en producción. Un
<meta name="robots" content="noindex">puesto durante el desarrollo y nunca quitado es la causa número uno de tiendas que no rankean nada después del lanzamiento. Búscalo siempre en una auditoría inicial — más de una vez ha sido el único problema real.
Si quieres una revisión sistemática del theme code antes de tocar nada, una auditoría SEO técnica de Shopify ahorra horas de prueba y error. La mayoría de problemas de Liquid se detectan en menos de 30 minutos cuando sabes qué buscar.
Preguntas frecuentes
¿Necesito saber programar para editar theme.liquid?
Editar archivos .liquid para SEO no requiere ser desarrollador, pero sí saber HTML básico y entender la lógica de Liquid ({% if %}, {% for %}, filtros). Los snippets de este post funcionan copiando y pegando, pero recomiendo siempre duplicar el theme antes (Online Store > Themes > Actions > Duplicate) para tener un rollback si algo se rompe.
¿En qué archivos del theme se trabajan estos snippets?
Casi todos los snippets SEO van en layout/theme.liquid, dentro de la sección <head>. Para schema específicos por plantilla, puedes crear un snippet separado (ej. snippets/seo-schema.liquid) y llamarlo con {% render 'seo-schema' %} desde theme.liquid. Para SEO específico de producto, las plantillas templates/product.liquid o sections/main-product.liquid también son válidas.
¿Las apps SEO en Shopify reemplazan a editar Liquid?
Solo parcialmente. Apps como SEO Manager o Smart SEO insertan código en el theme automáticamente. Funcionan bien para sites sin desarrolladores, pero limitan la personalización. Si tu site tiene 5.000+ productos, requisitos de schema avanzados o mercados internacionales con múltiples idiomas, casi siempre vas a necesitar tocar Liquid directamente.
¿Cómo testeo que los cambios en Liquid no rompen nada?
Tres pasos antes de publicar: (1) usar el preview del theme duplicado, (2) validar el JSON-LD en Google Rich Results Test y Schema.org Validator, y (3) verificar el <head> con view-source en producto, colección y home. Si tienes Search Console conectado, revisa la sección Enhancements 1-2 semanas después por errores nuevos.
¿Qué pasa con Shopify 2.0 y los themes Online Store 2.0?
Los themes Online Store 2.0 (Dawn, Sense, Refresh, etc.) usan secciones modulares y metafields más accesibles. La lógica Liquid sigue siendo la misma; solo cambia dónde colocas el código. Para schemas de producto enriquecidos, los metafields de Shopify 2.0 permiten capturar atributos específicos (material, ingredientes, GTIN) directamente desde el panel y rendererizarlos en el JSON-LD vía Liquid.
¿Cómo se diferencia Liquid SEO de WordPress SEO?
Liquid genera el HTML en el servidor de Shopify, no usa plugins JavaScript. Es más cercano a un theme PHP de WordPress que a un Gutenberg moderno. La ventaja: el SEO se renderiza estático y rápido. La desventaja: cualquier cambio requiere acceso al code editor del theme o un desarrollador. Comparé los dos enfoques en Shopify SEO vs WordPress SEO.
Fuentes
- Shopify. Liquid: Open-source template language. https://shopify.github.io/liquid/. 2024.
- Shopify Dev. Liquid objects reference. https://shopify.dev/docs/api/liquid/objects. 2025.
- Shopify Dev. Liquid reference (objects, tags, filters). https://shopify.dev/docs/api/liquid. 2025.
- Google Search Central. Product structured data documentation. https://developers.google.com/search/docs/appearance/structured-data/product. 2025.
- Google Search Central. Tell Google about localized versions of your page. https://developers.google.com/search/docs/specialty/international/localized-versions. 2025.
¿Tu Shopify no rankea y no sabes si es el theme o las URLs? Ofrezco auditorías SEO técnicas para tiendas Shopify — revisión sistemática del theme code, schema, hreflang y rendimiento. 30 minutos de llamada inicial gratuita para ver si tiene sentido.
Recibe una auditoría SEO personalizada de tu web en menos de 48h. Sin compromiso — solo los puntos exactos donde estás perdiendo visibilidad y cómo arreglarlo.
¿Tu cuenta de ads podría
rendir mejor?
30 minutos para revisar tu situación y decirte exactamente qué cambiaría. Sin pitch, sin propuesta de venta.