Helpers
Helpers cover a few common website patterns that come up all of the time.
Date Formatting
Format dates into readable formats.
<!-- formatDate -->
{{formatDate published-date}} <!-- Dec 14, 2024 -->
{{formatDate published-date "short"}} <!-- Dec 14, 2024 -->
{{formatDate published-date "long"}} <!-- December 14, 2024 -->
{{formatDate published-date "full"}} <!-- Saturday, December 14, 2024 -->
{{formatDate published-date "month"}} <!-- December 2024 -->
{{formatDate published-date "time"}} <!-- 3:30 PM -->
{{formatDate published-date "datetime"}} <!-- Dec 14, 2024, 3:30 PM -->
<!-- year (handy for footer copyright lines) -->
© {{year}} Acme Inc. <!-- © 2026 — year is set at publish time, empty in the editor preview -->Text Truncation
Cut long text with ellipsis.
{{truncate description}} <!-- Default: 100 characters -->
{{truncate description 150}} <!-- Custom length -->Default Values
Fall back to a value when a field is missing. (An empty field passes its blank value through, so this fires for unset fields, not blank ones.)
<h2>{{default headline "Untitled"}}</h2>
<a href="{{default cta-url "#"}}">{{default cta-text "Learn more"}}</a>Active Navigation
Highlight navigation links based on the current page.
How it works
{{#isActive "/path"}}: matches the path and any sub-pages (e.g./blogmatches/blog/my-post){{#isActive "/path" exact=true}}: matches only that exact path
<!-- Basic usage -->
<nav>
<a href="/" class="{{#isActive "/" exact=true}}text-brand font-bold{{/isActive}}">
Home
</a>
<a href="/about" class="{{#isActive "/about" exact=true}}text-brand font-bold{{/isActive}}">
About
</a>
<a href="/blog" class="{{#isActive "/blog"}}text-brand font-bold{{/isActive}}">
Blog
</a>
</nav>
<!-- Common patterns -->
<!-- Home link (use exact to avoid matching everything) -->
<a href="/" class="{{#isActive "/" exact=true}}active{{/isActive}}">Home</a>
<!-- Section link (matches all posts in /blog/*) -->
<a href="/blog" class="{{#isActive "/blog"}}active{{/isActive}}">Blog</a>
<!-- With else for inactive state -->
<a href="/about" class="{{#isActive "/about" exact=true}}text-brand{{else}}text-fg-muted{{/isActive}}">
About
</a>Works in layouts, so your header navigation automatically highlights the correct link on every page.
Posts & Pagination
Pulling in posts and paginating archives has its own set of helpers.
Post Basics
{{posts}}and{{postFieldValues}}for displaying and filtering posts.- Posts Index, Paginate, Filter & Sort pagination for large post indexes.