Handlebars

Learn how to use Handlebars in Fyno templates to create dynamic content with placeholders, conditional logic, loops, date formatting, mathematical operations, custom helpers, and advanced template expressions.

Handlebars is a JavaScript library used for creating dynamic templates.

It allows you to define templates with placeholders, and these placeholders are replaced with data when the template is triggered with the information sent in the payload.

Handlebars within Fyno support features like conditional operations, loops, date time formatting, partial searches, and custom helpers, making it a very cool tool to use when creating your templates.

Handlebars in Fyno's Templates

To understand how handlebars work, we first need to establish a sample payload, based off which the Handlebars function and applicability can be demonstrated.

{
  "members": [
    {
      "first_name": "Ashwin",
      "last_name": "Agarwal",
      "city": ""
    }
  ],
  "investments": [
    {
      "amount": 10,
      "company": "L&T"
    },
    {
      "amount": 20
    }
  ],
  "companies": {
    "L&T": "India",
    "Apple": "USA"
  },
  "user_type": "pro",
  "period": {
    "start": "2023-10-01",
    "end": "2023-10-03"
  },
  "classification": ["active", "pro"]
}

Fyno has default as well as custom handlebars that you can use in your templates. Let's have a look at what these are and how to use them using the above payload and data as example responses.

🚧 Double Quotes within Handlebars {{" "}} may break your templates!

Double quote may break your syntax in HBS, especially in emails! And nobody wants that!

For example: Use {{math number1 '+' number2}} instead of {{math number1 "+" number2}}.

Use single quotes {{' '}} instead! :sunglasses:

To access placeholder values

To access values of an object

To access object values from an array

To access values from an array

To avoid escaping the values

To get length of an array

To check if variable exists

Approach 1: To check if variable equals a certain value

Approach 2: To check if variable equals a certain value

To check if multiple variables equal a certain value (AND and OR options)

To check if variable equals a regular expression

To check if string starts with certain characters

To use OR operator between two variables

To use AND operator between two variables

To use a specified default value if the actual value does not exist (or is null)

To sum two numbers

To subtract two numbers

To multiply two numbers

To divide numbers

To perform modulo

To round numbers

To check for negative condition (show something only if key doesn't exist)

To iterate over a list/array

To use combination of conditions and nesting (advanced)

To lookup values and use them in placeholders (advanced)

To split variables and get value at index

To split variables and loop on it

To check if timestamp equals to today or yesterday or tomorrow

To check difference between two dates (in seconds, minutes, days, hours, month, hours, etc)

To format date value

To format datetime value

To format numeric value

To trim spaces from value

To trim values to a particular length

To trim value to a particular length and then truncate until the last occurrence of the specified delimiter

To remove a string

To sum multiple numbers

Current time with date format

Specific time with formatting and timezone

Convert Number to Words

Convert Unicode to Non Unicode characters