Liquid

Liquid is een open-source template-taal die Shopify ontwikkelde om dynamische content te genereren in webshops en websites. Je schrijft Liquid-code in HTML-templates en gebruikt daarbij tags, objecten en filters om gegevens uit een database op te halen en weer te geven. Denk aan productnamen, prijzen, voorraadstatus of klantgegevens. Liquid draait server-side, wat betekent dat de code wordt uitgevoerd voordat de HTML naar de browser wordt gestuurd. Voor MKB-webshops is Liquid de standaard manier om Shopify-thema's aan te passen zonder de kernfunctionaliteit aan te raken.

Hoe Liquid-code werkt in de praktijk

Liquid gebruikt drie soorten syntax-elementen. Ten eerste objecten, geschreven tussen dubbele accolades zoals {{ product.title }}, die gegevens uit je database ophalen en tonen. Ten tweede tags, geschreven tussen accolade-procent zoals {% if product.available %}, die logica en controlestructuren afhandelen. Ten derde filters, geschreven met een pipe-symbool zoals {{ product.price | money }}, die data transformeren of formatteren. Je combineert deze elementen in .liquid-bestanden binnen je thema-structuur. Een typische productpagina bevat tientallen Liquid-regels die samen zorgen voor prijsweergave, variant-selectie, add-to-cart-functionaliteit en voorraadmeldingen. De officiële Liquid-documentatie van Shopify beschrijft alle beschikbare objecten en filters.

Waarom Shopify Liquid ontwikkelde

Voor 2006 gebruikten webshop-platforms vaak PHP of andere server-side talen direct in templates, wat veiligheidsrisico's opleverde wanneer merchants zelf code aanpasten. Shopify wilde een veilige omgeving creëren waarin shop-eigenaren templates konden aanpassen zonder toegang tot server-level code. Liquid biedt een beperkte, gecontroleerde syntax die geen directe database-toegang of systeemcommando's toestaat. Hierdoor kunnen ook niet-developers veilig aanpassingen maken. Inmiddels gebruiken ook andere platforms zoals Jekyll en 11ty varianten van Liquid, maar de Shopify-implementatie blijft het meest uitgebreid. Voor Nederlandse webshops betekent dit dat je met één template-taal kunt werken voor zowel je Shopify-store als eventuele content-sites die op Jekyll draaien.

Wat Liquid oplevert voor webshop-eigenaren

Met Liquid pas je de presentatie van je webshop aan zonder de onderliggende Shopify-infrastructuur te raken. Je kunt productpagina's personaliseren op basis van collectie, klantgroep of voorraadstatus. Een voorbeeld: een sportwinkel toont hardloopschoenen anders dan wielrenschoenen door in Liquid te checken op product-tags en vervolgens andere content-blokken te laden. Je behoudt alle Shopify-updates en beveiligingspatches omdat je alleen de presentatielaag aanpast. Voor MKB-bedrijven die een webshop laten maken of uitbreiden, betekent Liquid dat ontwikkelaars snel custom functionaliteit kunnen toevoegen zonder een volledig maatwerk-platform te bouwen. De code blijft leesbaar en overdraagbaar, wat belangrijk is als je later van bureau wisselt. Daarnaast integreer je met API-koppelingen door Liquid te combineren met JavaScript voor real-time data zoals levertijden of dynamische prijzen.

Liquid komt in de praktijk terug bij vrijwel elke aanpassing aan een Shopify-webshop, van kleine tekstwijzigingen tot complexe product-configurators. Hieronder zie je de meest voorkomende scenario's waarin MKB-webshops Liquid inzetten, inclusief situaties waarin alternatieven beter passen.

Dynamische productpagina's per collectie of categorie

Je gebruikt Liquid om productpagina's automatisch aan te passen op basis van de collectie waarin een product zit. Een meubelwinkel toont bijvoorbeeld maattabellen en montage-instructies bij kasten, maar levertijd en kleurvarianten bij stoelen. In plaats van voor elk product handmatig content toe te voegen, schrijf je één Liquid-template die checkt op product.collections en vervolgens de juiste content-blokken laadt. Dit scheelt uren handwerk bij webshops met honderden producten. Je definieert de logica één keer en Shopify past deze toe op alle relevante producten. Een veelgemaakte fout is te veel geneste if-statements gebruiken, wat de code onleesbaar maakt. Beter is werken met Liquid-snippets die je per producttype inlaadt, zodat de hoofdtemplate overzichtelijk blijft.

Klantspecifieke prijzen en content via Liquid-logica

Groothandels en B2B-webshops tonen vaak verschillende prijzen aan ingelogde klanten versus bezoekers. Met Liquid check je {% if customer.tags contains 'wholesale' %} en toon je aangepaste prijzen, bulkkortingen of netto-bedragen. Je kunt zelfs hele productcategorieën verbergen voor niet-geautoriseerde bezoekers. Een installatiebedrijf verbergt bijvoorbeeld professionele gereedschappen voor consumenten en toont deze alleen aan klanten met de tag 'professional'. Liquid haalt klantgegevens op uit het Shopify-customer-object, waardoor je geen externe database nodig hebt. Let op: complexe kortingsstructuren met meer dan drie klantniveaus worden onoverzichtelijk in Liquid. Dan is een Shopify-app zoals Bold Custom Pricing of een headless-architectuur met API-integratie effectiever. Liquid werkt het beste voor twee tot drie klantsegmenten met duidelijk verschillende prijslijsten.

Meertalige webshops met Liquid-locale-filters

Shopify Markets en meertalige thema's gebruiken Liquid-filters zoals {{ 'general.search.title' | t }} om vertalingen te laden uit locale-bestanden. Je beheert alle teksten centraal in JSON-bestanden per taal en Liquid kiest automatisch de juiste versie op basis van de klant-locale. Een webshop die zowel Nederland als Vlaanderen bedient, toont 'winkelwagen' versus 'winkelmandje' zonder dubbele templates te onderhouden. Dit werkt ook voor datumformaten, valuta en maateenheden. Je schrijft de Liquid-template één keer en voegt vertalingen toe via het thema-admin-paneel. Voor webshops met meer dan vijf talen wordt het beheer van locale-files complex. Dan is een translatie-app zoals Weglot of Langify handiger, omdat die ook dynamische content zoals productbeschrijvingen automatisch vertaalt. Liquid-locale-filters zijn ideaal voor statische UI-teksten in twee tot vier talen.

Wanneer Liquid de juiste keuze is en wanneer niet

Gebruik Liquid wanneer je binnen de Shopify-omgeving wilt blijven en aanpassingen nodig hebt aan presentatie, logica of content-weergave. Het is de standaard voor thema-ontwikkeling en wordt ondersteund door alle Shopify-apps en -updates. Kies geen Liquid als je complexe real-time berekeningen nodig hebt (zoals verzendkosten op basis van externe API's), want Liquid draait server-side en kent geen asynchrone calls. Ook voor zeer dynamische interfaces met veel interactie is een JavaScript-framework zoals React of Vue effectiever, eventueel in een headless-setup. Liquid combineert goed met maatwerk front-end development voor hybride oplossingen waarin Liquid de basis-rendering doet en JavaScript de interactieve laag verzorgt.