Introducción al Liquid Syntax Error en Shopify
El motor de plantillas de Shopify, conocido como Liquid, es sumamente potente pero también estricto con la sintaxis. Cuando modificas el código de tu tema (HTML/Liquid) y cometes un pequeño desliz tipográfico, aparece el temido Liquid Syntax Error. Este fallo puede bloquear la visualización de tu tienda online, afectando directamente tus conversiones y ventas si no se corrige con rapidez.
Causas comunes del error de sintaxis en Liquid
Las razones principales por las cuales se genera este error en el panel de administración de Shopify incluyen:
- Omitir las etiquetas de cierre en variables o bucles (por ejemplo, olvidar un
{% endif %}o{% endfor %}). - Utilizar comillas simples o dobles incorrectas dentro de las etiquetas Liquid.
- Escribir mal el nombre de un filtro o una etiqueta nativa de Liquid (como
capturen lugar decapture). - Espacios mal ubicados dentro de los delimitadores
{{ ... }}o{% ... %}.
Método 1: Identificar el archivo y la línea exacta del error
Shopify suele ser bastante específico en el mensaje de error cuando ocurre un fallo de Liquid:
- Inicia sesión en tu panel de administración de Shopify y ve a Canales de venta > Tienda online > Temas.
- Haz clic en los tres puntos (Acciones) de tu tema actual y selecciona Editar código.
- Observa la barra de notificaciones superior o el mensaje de error emergente que indica el nombre del archivo (por ejemplo,
index.liquidoproduct-template.liquid) y el número de línea. - Navega en el explorador de archivos izquierdo hasta ubicar el archivo señalado y haz clic sobre él.
Método 2: Corregir la sintaxis del código afectado
Una vez localizado el archivo y la línea del problema, sigue estos pasos para solucionarlo:
- Dirígete directamente al número de línea indicado por Shopify.
- Revisa minuciosamente las etiquetas de apertura y cierre. Asegúrate de que cada
{% if %}tenga su correspondiente{% endif %}. - Verifica que los filtros estén correctamente aplicados usando la pleca o barra vertical (|). Ejemplo correcto:
{{ product.title | escape }}. - Si recientemente añadiste código personalizado de un tutorial o app, coméntalo temporalmente usando
{% comment %} ... {% endcomment %}para aislar el problema. - Haz clic en el botón Guardar en la esquina superior derecha y recarga tu tienda en una pestaña de incógnito para verificar que el error haya desaparecido.