Liquid Filters

Objects give you values.

Filters transform those values for output.

Filter syntax

The official tutorial introduces filters with a pipe:

{{ "hello" | capitalize }}

The input flows through the filter.

You can read it as:

"hello"
   ↓ capitalize
"Hello"

Useful examples

Depending on the value and supported Liquid/Jekyll filters, you may use patterns such as:

{{ page.title | downcase }}
{{ page.title | upcase }}
{{ page.date | date_to_string }}

The exact filter set matters. Check Jekyll/Liquid documentation instead of inventing filter names.

Chaining

Liquid can chain filters:

{{ page.title | strip | downcase }}

Read from left to right.

Each step changes the value passed to the next step.

Guided experiment

Create front matter:

title: "  Robotics Project  "

Output the raw title and a filtered version.

Build.

Inspect generated HTML.

Then answer:

• Did the source data change?
• Or did only the rendered representation change?

A filter usually transforms output, not the stored front-matter source.

Do not hide bad data with filters

If every title has random whitespace because your content model is sloppy, adding strip everywhere may mask the symptom.

Sometimes the better repair is cleaning the source data.

Filters are not an excuse to avoid data quality.

Portfolio action

Use at least one filter where it has a real presentation purpose.

Record the original value and rendered value.

Checkpoint

Explain:

When should a filter fix presentation, and when should you fix the source data instead?