Dynamic template attributes
Bind a block's font and colour to variables so its appearance can change with each order. For example, clients can choose different handwriting styles while using the same template.
Bind attributes to variables
- In Variables, create an order-scoped text variable called Note font with this mapper:
return order.variables?.note_font ?? null - Create another order-scoped text variable called Note colour:
return order.variables?.note_colour ?? null - Open your template and select the note block. For a handwriting block, use the control beside Font and Color to select the corresponding variables. For a normal text block, select Use a variable in the font dropdown and colour picker.
- Set the block's fallback font and colour, then publish the template.
The variable names and payload keys above are examples. Use matching keys in your mappers and requests. If you send the note through order.note, bind the block's content to the built-in Note variable.
Send attribute values
Include the values in order.variables when you create or update an order. This example selects Nightingale handwriting and dark blue ink in a template whose handwriting block uses the bindings above:
{
"source": "warehouse-east",
"sourceId": "WE-1001",
"order": {
"orderNumber": "#1001",
"note": "Hi Sam,\n\nThank you for your order!\n\nThe team",
"overrides": {
"template": "YOUR_TEMPLATE_ID"
},
"variables": {
"note_font": "Nightingale",
"note_colour": "darkBlue"
}
}
}
Sending values changes only attributes bound to the corresponding variables. No block IDs or additional handwriting flag are required.
Supported values
| Block type | Font | Colour |
|---|---|---|
| Handwriting | A handwriting style available in Yuzu. | A named ink colour from the editor, such as black or darkBlue. |
| Normal text | A Yuzu font or a font already uploaded to your team. Use its font family name, such as EB Garamond, rather than a file URL or asset ID. | A valid CSS colour, such as #373DCF. |
Handwriting styles are Arthur, Carpenter, Foster, George, Grogan, Knowles, Nightingale, Robinson, Singh, and Stafford. CSS colour values do not select handwriting ink colours.
The block type determines whether the text renders as handwriting or normal text. A font variable does not change that type. If your integration offers both, use a template for each block type and select it with order.overrides.template.
Fallbacks and preview
Missing, empty, or unsupported font or colour values use the block's configured fallback. Font and colour resolve independently.
Preview representative orders before using the template in production. Use Fetch order to check the saved variables and Fetch order PDF to inspect the rendered result.