Introducción
Uno de los problemas más frustrantes a los que se enfrentan los administradores y desarrolladores de e-commerce al personalizar sus tiendas es el temido Liquid syntax error. Este fallo aparece de forma repentina en la tienda online, bloqueando la visualización de la página y mostrando un mensaje críptico en lugar de tus productos. Afortunadamente, tiene solución si sabes dónde buscar.
Causas comunes del Liquid Syntax Error en Shopify
El motor de plantillas Liquid es muy estricto con la sintaxis. Las causas más habituales por las que se genera este error son:
- Falta de etiquetas de cierre en condicionales (
{% endif %}) o bucles ({% endfor %}). - Uso incorrecto de filtros o comillas mal cerradas dentro de las variables.
- Modificaciones manuales recientes en archivos de código como
theme.liquid,index.jsono secciones personalizadas. - Variables no definidas o mal escritas que el sistema no logra interpretar.
Método 1: Revisar el registro de cambios y el archivo afectado
Shopify suele indicar en el mensaje de error el archivo exacto y la línea donde se ha producido el fallo de sintaxis.
- 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 del tema activo y selecciona Editar código.
- Busca el archivo exacto mencionado en el mensaje de error (por ejemplo,
section-header.liquid). - Dirígete a la línea de código indicada y busca etiquetas abiertas sin cerrar, como
{% if product.available %}que carezcan de su correspondiente{% endif %}. - Corrige el error de sintaxis y haz clic en Guardar.
Método 2: Revertir a una versión anterior del archivo
Si has realizado múltiples cambios y no logras dar con la línea exacta del error, la mejor opción es utilizar el historial de versiones nativo de Shopify.
- Dentro del editor de código, abre el archivo que está causando el conflicto.
- Busca la opción Versiones más recientes o el historial de cambios situado en la parte superior del archivo.
- Selecciona una fecha y hora anterior a cuando comenzaste a realizar las modificaciones.
- Haz clic en Guardar para restaurar la versión estable del código y comprobar que la tienda vuelve a funcionar con normalidad.