Liquid Template Tester
Render a small Liquid template against JSON data.
Overview
Paste a Liquid template and a JSON data context and the tester renders the output. Supports the core tags and filters - {{ var }} interpolation, {% if %} / {% for %} blocks, and the everyday filters (upcase, date, truncate, default, escape).
It's for developers working with Jekyll, Shopify themes, GitHub Pages, or any system that embeds Liquid. Reach for it when sketching a partial before pasting into a theme, debugging unexpected output, or testing a conditional that won't fire the way you expect.
How it works
Liquid is a templating language created by Shopify, with a strict separation between "objects" (output via {{ }}) and "tags" (control flow via {% %}). The tester implements the standard tag set documented in the Shopify Liquid reference - if, unless, for, case/when, assign, capture, include - and the canonical filter library.
Variables resolve against the JSON data using dotted access ({{ user.name }}) and bracket access ({{ items[0] }}). Missing references produce empty string, not an error - Liquid's design favours forgiving template authoring.
Examples
- Basic interpolation:
Hello, {{ name }}!{"name": "world"}Hello, world! - Conditional + filter:
{% if user.age >= 18 %}{{ user.name | upcase }}{% endif %} - Loop with index:
{% for item in items %}{{ forloop.index }}. {{ item.title }} {% endfor %} - Date formatting:
{{ "2026-05-18" | date: "%B %-d, %Y" }} -> May 18, 2026
FAQ
Does it support Jekyll-specific tags?
The standard tag set. Jekyll-specific tags (include, highlight) require Jekyll's runtime and aren't simulated.
What about Shopify-specific objects?
Shopify-specific globals (product, cart, customer) aren't provided - supply equivalent test data in the JSON context.
How are dates parsed?
The date filter accepts strings (parsed via your data's literal value) and converts using strftime-style format specifiers.
Why doesn't my whitespace control work?
Liquid supports whitespace trimming via {%- ... -%} and {{- ... -}} (hyphen inside the tag). Check that the hyphens are on the side you want trimmed.