Templates

This documentation is intended for the development of custom themes and their templates in SparkLayer. You can learn more hereļ»æ

Templates

Available Templates:

Template

Type

Description

invoice.liquid

pdf

Invoice PDF template

quote.liquid

pdf

Quote PDF template

limited-user-purchase-review.liquid

email

Notification of a new purchase placed by a limited user for review

limited-user-purchase-approve.liquid

email

Notification of a new purchase placed by a limited user approved

email-header.liquid

section

Re-usable email header section

email-footer.liquid

section

Re-usable email footer section

Note: Only the above templates can be used, any other files uploaded to a theme are discarded, including supporting files such as images and fonts.

Template Markup & Liquid

Templates are written in liquid and have access to the majority of liquids tags and filters. We also have some additional helper filters documented below.

Styling must be added in the template using either the style HTML element, or inline styles. Note however all styles are inlined when rendering the template for better compatability with email clients.

The email templates provided have been tested in modern web based email clients such as Gmail, however we don't offer support for older email clients such as desktop variations of Outlook. We recommend using testing your custom email templates as they can be particularly problematic with modern HTML and CSS.

Filters & Blocks

Currency

Monetary values should use the currency filter in a template to properly render the currency and its appropriate formatting based on locale.

Text
ļ»æ

You can also change the currency formatting with one of the following three options:

  • display_none
  • display_code
  • display_symbol (default)
Text
ļ»æ

Note this filter also has a shorthand alias c which works the same.

Translate

Internationalisation can be supported in templates using the translate filter. A theme will need to have the appropriate language file with the desired translation strings. Documentation on theme language files can be found hereļ»æļ»æ

JSON
ļ»æ
Text
ļ»æ

Note this filter also has a shorthand alias t which works the same.

Language strings can support interpolation by providing slots in the string, and arguments to the translate filter like so:

JSON
ļ»æ
Text
ļ»æ

This filter uses the store locale from the merchant core data to translate, falling back on the en translation file if no translation is found for the respective locale.

Localised Date Format

Localised date formatting is supported with the ldate filter. By default, this filter uses the stores locale, provided in the merchant core data, but an optional locale parameter can be provided and used instead.

Text
ļ»æ

With a provided locale:

Text
ļ»æ

Country From Country Code

Country names can be rendered from the country code using the country filter. This is helpful for address data where the country code is stored instead of the country name.

Text
ļ»æ

Note that country names are only returned in english despite the stores locale.

Template Sections

We have limited support template sections with the section tag. The available section templates are documented above under templatesļ»æ, and we do not support custom sections outside of these.

Text
ļ»æ

Internationalisation & Translations

Language JSON files can be added to themes for internationalisation in templates. The language file must be named using a language code (i.e. en, fr, etc.) and should match the locale used by your store. The translations in these files are available through the translateļ»æ liquid filter.

By default, the filter will use the stores locale, falling back on SparkLayers own core language files if no translations in your custom language files are found, with en being the final fall back.

Available Data

Templates have a range of data available to them via the data liquid variable, for example data.merchant.store_name.

Template

Top Level Objects

invoice.liquid

ļ»æmerchant, purchase, settingsļ»æ

quote.liquid

ļ»æmerchant, purchaseļ»æ

limited-user-purchase-review.liquid

ļ»æmerchant, purchaseļ»æ

limited-user-purchase-approve.liquid

ļ»æmerchant, purchaseļ»æ

While this data can vary from template to template, they all have access to the store details (data.merchant). This objectļ»æ contains the stores general information, and can be changes via the SparkLayer dashboard. Learn more hereļ»æ

More information about the objects and their properties can be found in the Template Objectļ»æ documentation.