¿Qué es el error de sintaxis Liquid en Shopify y por qué ocurre?
El motor de plantillas Liquid es el corazón de Shopify, encargado de renderizar dinámicamente el contenido de tu tienda. Cuando modificas el código de tu tema (archivos .liquid, .json o secciones) y cometes un pequeño error tipográfico, Shopify bloquea la ejecución de la página y muestra un mensaje de error de sintaxis en la vista previa.
Las causas más comunes de este problema incluyen:
- Uso incorrecto de etiquetas de apertura y cierre (por ejemplo, olvidar cerrar un
{% if %}con un{% endif %}). - Variables mal escritas o nulas dentro de las llaves dobles
{{ variable }}. - Filtros aplicados de manera incorrecta o inexistentes en el ecosistema de Shopify.
- Comillas o caracteres especiales mal escapados dentro de las cadenas de texto.
Método 1: Identificar la línea exacta mediante el mensaje de error de Shopify
Cuando ocurre un fallo de Liquid, Shopify suele mostrar un mensaje descriptivo en la parte superior del editor de código o directamente en la pantalla de la tienda.
- Inicia sesión en tu panel de administración de Shopify y ve a Tienda online > Temas.
- Haz clic en el botón de los tres puntos (...) junto al tema activo y selecciona Editar código.
- Revisa la barra de notificaciones superior o el archivo que acabas de modificar; Shopify señalará el nombre del archivo exacto y el número de línea donde se rompió la sintaxis.
- Dirígete a la línea indicada y busca discrepancias en las etiquetas clave como
{% for %},{% if %}, o{% assign %}.
Método 2: Corregir etiquetas de control huérfanas y variables mal cerradas
Un error clásico es olvidar la etiqueta de cierre correspondiente. El motor Liquid es extremadamente estricto con la jerarquía de bloques.
- Busca en tu código bloques condicionales o de iteración abiertos. Por ejemplo, asegúrate de que cada
{% if condition %}tenga su respectivo{% endif %}. - Verifica que las variables usen la sintaxis correcta con doble llave y doble barra si es necesario. Ejemplo correcto:
{{ product.title | escape }}. - Si utilizas objetos complejos, valida que los atributos existan en la documentación oficial de Shopify Liquid para evitar llamadas a propiedades vacías que detengan el renderizado.
Método 3: Revertir a una versión anterior del archivo
Si realizaste múltiples cambios y no logras dar con el error exacto de sintaxis, Shopify incluye un control de versiones nativo para los archivos del tema.
- Dentro del editor de código, abre el archivo que está generando el problema.
- Busca en la parte superior del editor de código el enlace que dice Versiones anteriores (Older versions).
- Haz clic en él y selecciona la fecha y hora exacta en la que tu tienda funcionaba correctamente antes de realizar la modificación.
- Haz clic en Guardar para aplicar la versión estable y comprobar que el error de Liquid desaparezca de tu tienda online.