Text Formatting Filters

Transform and format text with case conversion, truncation, markdown rendering, and regex operations

Nimbu provides powerful text manipulation filters for formatting strings, rendering markup, and transforming content.

Case Conversion

capitalize

Capitalizes the first word in a string:

{{ "hello world" | capitalize }}
<!-- Output: Hello world -->

{{ product.name | capitalize }}
<!-- "mountain bike" → "Mountain bike" -->

upcase

Converts string to uppercase:

{{ "Hello World" | upcase }}
<!-- Output: HELLO WORLD -->

<h2>{{ section.title | upcase }}</h2>

downcase

Converts string to lowercase:

{{ "HELLO WORLD" | downcase }}
<!-- Output: hello world -->

{{ email | downcase }}

String Manipulation

strip

Removes leading and trailing whitespace:

{{ "   Hello World   " | strip }}
<!-- Output: "Hello World" -->

{{ user_input | strip }}

lstrip / rstrip

Remove whitespace from left or right side only:

{{ "   Hello" | lstrip }}  <!-- "Hello" -->
{{ "Hello   " | rstrip }}   <!-- "Hello" -->

strip_html

Removes all HTML tags from string:

{{ "<p>Hello <strong>World</strong></p>" | strip_html }}
<!-- Output: "Hello World" -->

{{ blog_post.excerpt | strip_html | truncate: 150 }}

strip_newlines

Removes all newline characters:

{{ "Hello\nWorld" | strip_newlines }}
<!-- Output: "HelloWorld" -->

Truncation

truncate

Shortens string to specified length:

{{ "Hello World" | truncate: 5 }}
<!-- Output: "He..." -->

{{ product.description | truncate: 200, "..." }}

Parameters:

Length (required): Maximum characters
Ellipsis (optional): String to append, default "..."

truncatewords

Truncates to word count instead of characters:

{{ "The quick brown fox jumps" | truncatewords: 3 }}
<!-- Output: "The quick brown..." -->

{{ article.content | strip_html | truncatewords: 50 }}

excerpt

Extracts text around a search phrase:

{{ content | excerpt: "search term", radius: 20 }}
<!-- Returns ~20 chars before/after "search term" -->

{{ article.body | excerpt: params.q, radius: 50 }}

Text Replacement

replace

Replace all occurrences of a substring:

{{ "Hello World" | replace: "World", "Universe" }}
<!-- Output: "Hello Universe" -->

{{ product.description | replace: "old", "new" }}

replace_first

Replace only the first occurrence:

{{ "one two one" | replace_first: "one", "three" }}
<!-- Output: "three two one" -->

remove

Remove all occurrences of a substring:

{{ "Hello World World" | remove: "World " }}
<!-- Output: "Hello World" -->

{{ title | remove: "[DRAFT] " }}

remove_first

Remove only the first occurrence:

{{ "one two one" | remove_first: "one " }}
<!-- Output: "two one" -->

URL & Parameter Formatting

parameterize

Convert string to URL-friendly format:

{{ "Hello World!" | parameterize }}
<!-- Output: "hello-world" -->

{{ category.name | parameterize }}

url_encode

Encode string for URL parameters:

{{ "Hello World" | url_encode }}
<!-- Output: "Hello+World" -->

<a href="/search?q={{ params.query | url_encode }}">Search</a>

url_decode

Decode URL-encoded string:

{{ "Hello+World" | url_decode }}
<!-- Output: "Hello World" -->

escape

HTML-escape string:

{{ "<script>alert('hi')</script>" | escape }}
<!-- Output: "&lt;script&gt;alert('hi')&lt;/script&gt;" -->

{{ user_comment | escape }}

Markup Rendering

markdown

Render markdown to HTML:

{{ "# Hello\n\nThis is **bold**" | markdown }}
<!-- Output: <h1>Hello</h1><p>This is <strong>bold</strong></p> -->

<div class="content">
  {{ page.body | markdown }}
</div>

textile

Render Textile markup to HTML:

{{ "h1. Title\n\nThis is *bold*" | textile }}

{{ blog_post.content | textile }}

simple_format

Convert plain text to HTML with paragraph and line breaks:

{{ "Line one\n\nLine two" | simple_format }}
<!-- Output: <p>Line one</p><p>Line two</p> -->

{{ testimonial.quote | simple_format }}

Highlighting & Wrapping

highlight

Wrap search terms with HTML highlighting:

{{ "Hello World" | highlight: "World" }}
<!-- Output: Hello <mark>World</mark> -->

{{ article.body | highlight: params.search }}

Options:

{{ text | highlight: "term", highlighter: '<strong class="search-term">\1</strong>' }}

word_wrap

Wrap text at specified line width:

{{ long_text | word_wrap: 80 }}

{{ product.description | word_wrap: 120 }}

Advanced Text Processing

replace_by_regex

Replace text using regular expressions:

{{ "Product-123-XYZ" | replace_by_regex: '\d+', 'NUM' }}
<!-- Output: "Product-NUM-XYZ" -->

{{ sku | replace_by_regex: '^PROD-', '' }}

Example: Clean phone numbers

{{ "+32 (0)123 45 67 89" | replace_by_regex: '[^0-9+]', '' }}
<!-- Output: "+3212345679" -->

Example: Extract domain

{{ email | replace_by_regex: '.*@', '' }}
<!-- "[email protected]" → "example.com" -->

String Inspection

size

Get string length:

{{ "Hello" | size }}
<!-- Output: 5 -->

{% if product.description | size > 200 %}
  {{ product.description | truncate: 200 }}
{% else %}
  {{ product.description }}
{% endif %}

split

Split string into array:

{% assign words = "one,two,three" | split: "," %}
{% for word in words %}
  <span>{{ word }}</span>
{% endfor %}

slice

Extract substring by position and length:

{{ "Hello World" | slice: 0, 5 }}
<!-- Output: "Hello" -->

{{ sku | slice: 0, 4 }}

Practical Examples

Blog Excerpt with Highlighting

<div class="search-results">
  {% for article in articles %}
    <article>
      <h3>{{ article.title | highlight: params.q }}</h3>
      <p class="excerpt">
        {{ article.body | strip_html | excerpt: params.q, radius: 100 }}
      </p>
    </article>
  {% endfor %}
</div>

Clean User Input

{% assign clean_name = user_input | strip | truncate: 100 | escape %}
{% assign clean_email = email_input | strip | downcase %}

SEO-Friendly URLs

{% assign slug = page.title | parameterize %}
<link rel="canonical" href="{{ site.url }}/{{ slug }}">

Markdown Content with Cleanup

<div class="content prose">
  {{ page.content | markdown }}
</div>

<!-- Or sanitize first -->
{{ page.content | strip_html | markdown }}

Dynamic Text Truncation

{% if product.description.size > 150 %}
  <p>
    {{ product.description | truncatewords: 30 }}
    <a href="{{ product.url }}">Read more</a>
  </p>
{% else %}
  <p>{{ product.description }}</p>
{% endif %}

Format Product SKUs

<!-- Remove prefix -->
{{ product.sku | replace_by_regex: '^PROD-', '' }}

<!-- Format consistently -->
{{ product.sku | upcase | replace: "-", " " }}

Best Practices

1. Sanitize User Input

Always escape or strip HTML from user-generated content:

<!-- ❌ Dangerous -->
{{ comment.body }}

<!-- ✅ Safe -->
{{ comment.body | escape }}
{{ comment.body | strip_html }}

2. Chain Filters Efficiently

Order matters for performance and correctness:

<!-- ✅ Good: strip_html before truncate -->
{{ content | strip_html | truncatewords: 50 }}

<!-- ❌ Bad: might truncate mid-tag -->
{{ content | truncatewords: 50 | strip_html }}

3. Provide Fallbacks

Handle empty or nil values:

{{ product.description | default: "No description available" | truncate: 200 }}

Next Steps

Numbers & Money - Format prices and numbers
Arrays & Collections - Filter and manipulate arrays
Assets & CDN - Image processing and asset URLs
Global Variables - Available content drops

Format and transform text effectively with Nimbu's text filters!

On this page