artwo.xyz
fork
Configure Feed
Select the types of activity you want to include in your feed.
A simple, folder-driven static-site engine.
bun
ssg
fs
fork
Configure Feed
Select the types of activity you want to include in your feed.
1# Template Helpers
2
3Webette registers a set of Handlebars helpers available in all templates and layouts.
4
5## Comparison / flow
6Helpers to branch logic or pick items inside templates.
7
8- `eq a b` / `neq a b`: strict equality/inequality.
9- `in value list`: true if `value` is in an array.
10- `first array`: first element of an array.
11- `firstBlockOfType blocks type`: first block whose `type` matches.
12- `renderLayout name`: render another layout partial (defaults to `templates.default.layout` when no name is provided).
13
14Example:
15```hbs
16{{#if (eq entry.status "draft")}}Draft{{else}}Published{{/if}} {{!-- Published --}}
17{{#if (in "posts" site.collections)}}...{{/if}} {{!-- enters block if "posts" exists --}}
18{{first entry.blocks}} {{!-- first block object --}}
19{{firstBlockOfType entry.blocks "image"}} {{!-- first image block or "" --}}
20{{renderLayout "post"}} {{!-- renders the post layout with current context --}}
21```
22
23## Strings / text
24- `upper value`: uppercase.
25- `lower value`: lowercase.
26- `capitalize value`: first letter uppercase.
27- `titleCase value`: capitalize each word.
28- `truncate value len [suffix]`: shorten to `len` chars; suffix defaults to `…`.
29- `match value pattern [flags]`: return first regex match (or capture group 1).
30- `nl2br value`: convert newlines to `<br>`.
31- `safe value`: mark string as SafeString (no escaping).
32- `displayName [object]`: return `object.displayName` if set, else `object.name` (useful with `name.webt`).
33
34Examples:
35```hbs
36{{upper site.title}} {{!-- MY WEBSITE --}}
37{{lower collection.name}} {{!-- posts --}}
38{{capitalize entry.name}} {{!-- My first post --}}
39{{titleCase "hello world"}} {{!-- Hello World --}}
40{{truncate entry.name 12 "..."}} {{!-- My first po... --}}
41{{truncate "hello world" 8}} {{!-- hello wo… --}}
42{{match entry.route "#(.+)$"}} {{!-- anchor without # --}}
43{{displayName collection}} {{!-- collection.displayName ?? collection.name --}}
44{{displayName entry}} {{!-- entry.displayName ?? entry.name --}}
45{{#each entries}}{{displayName}}{{/each}} {{!-- uses the current context when called with no args --}}
46{{{nl2br collection.description}}} {{!-- keep line breaks --}}
47{{{safe content.html}}} {{!-- inserts HTML as-is --}}
48```
49
50## Dates / time
51- `formatDate value [hash options]`: uses `Intl.DateTimeFormat`; defaults to `site.lang` (if present) and can be overridden with `locale`; hash supports `dateStyle`, `timeStyle`, `locale` (e.g. `{{formatDate entry.date dateStyle="long"}}`); falls back to ISO on error.
52- `fromNow value [locale?]`: uses `Intl.RelativeTimeFormat`; defaults to `site.lang` and accepts a `locale` override; returns human “X seconds/minutes/hours/days/months/years ago/from nowâ€.
53
54Examples:
55```hbs
56{{formatDate buildTime dateStyle="long"}} {{!-- April 5, 2025 --}}
57{{formatDate entry.date dateStyle="medium" timeStyle="short"}} {{!-- Apr 5, 2025, 14:32 --}}
58{{fromNow entry.date}} {{!-- 2 days ago --}}
59{{fromNow entry.date locale="fr"}} {{!-- il y a 2 jours --}}
60```
61
62## Numbers / math
63- `add a b` / `subtract a b` / `multiply a b`: basic arithmetic (returns `""` if inputs are not numeric).
64- `divide a b`: division (returns `""` on non-numeric or division by zero).
65- `percent part total [decimals]`: percentage, rounded (or fixed decimals if provided).
66
67Examples:
68```hbs
69{{add 2 3}} {{!-- 5 --}}
70{{subtract 10 4}} {{!-- 6 --}}
71{{multiply 3 7}} {{!-- 21 --}}
72{{divide 10 2}} {{!-- 5 --}}
73{{percent 2 5}} {{!-- 40 --}}
74{{percent 1 3 2}} {{!-- 33.33 --}}
75```
76
77## Collections lookup
78- `withCollection <slugOrId>`: find a collection by slug/id/route and set it as context.
79- `withEntry <slugOrIdOrRoute>`: find an entry across collections and set it as context (also exposes `collection` in block data).
80
81Examples:
82```hbs
83{{#withCollection "posts"}}
84 <h2>{{name}}</h2> {{!-- renders collection name --}}
85{{/withCollection}}
86
87{{#withEntry "/posts/my-first-post"}}
88 <h2>{{name}}</h2> {{!-- entry name --}}
89 <p>Collection: {{collection.name}}</p>
90{{/withEntry}}
91```
92
93## Images
94- `imageSrc block [variant="small|medium|large|default"]`: returns the best URL for the requested variant if it exists on the block, otherwise falls back to the configured `images.defaultVariant`, then the original route.
95- `image block [...]`: renders an `<img>` (or `<figure>` when `figure=true`) using the same variant selection. Supports common HTML attributes via hash:
96 - `variant`, `class`, `id`, `alt` (fallback: block name/rawName), `title`, `loading` (defaults to `lazy`), `decoding`, `sizes`, `data-*` passthrough.
97 - `figure=true` wraps in `<figure>` and `caption` (defaults to `alt/name`); `figureClass` applies to the `<figure>`.
98 - Width/height and `srcset` are filled from available variants when present.
99
100Examples:
101```hbs
102{{imageSrc myImage variant="small"}} {{!-- URL only --}}
103{{image myImage variant="medium" class="hero" figure=true caption="Cover photo"}}
104```
105
106## Images in Markdown (block:)
107
108Markdown image URLs can target internal blocks and reuse the same options:
109
110```
111
112![Hero](block: cover.jpg, figure: true, caption: "Cover", class: hero)
113```
114
115Notes:
116- Accepted prefixes for internal targets: `collection:`/`coll:`, `entry:`, `block:`.
117- Options align with the `image` helper; `variant` must be one of `default|small|medium|large`.
118
119## Assets
120- `asset path`: build a URL to the configured templates assets base.
121
122Examples:
123```hbs
124<link rel="stylesheet" href="{{asset "css/init.css"}}">
125<script src="{{asset "js/app.js"}}" defer></script>
126```
127
128## Context hints
129- `buildTime` is available in the render context (use with `formatDate`/`fromNow`).
130
131Notes:
132- Variables are escaped by default; use `safe` or triple mustaches for trusted HTML.
133- Helpers return `""` when inputs are invalid (e.g., math with non-numeric or division by zero).