Customize your designs with the new Liquid syntax

Customize your designs with the new Liquid syntax

-

#1 - Add mirror and unsubscribe links

• Mirror link = {{ mirror_page_url }}

Example: See the online version here (behind here, you must place the variable {{ mirror_page_url }} )

• Unsubscribe link = {{ unsubscription_form_url }}

Example: If you no longer wish to receive our emails, you can unsubscribe here (behind here, you must place the variable {{ unsubscription_form_url }} )

-

#2 - Use a conditional block and reformat the content

• Include a personalized welcome message with the contact's first name

{% if contact.firstname != "" %}
Hello {{ contact.firstname }},
Welcome! We are delighted to have you.
{% else %}Hello,
Welcome among us!
{% endif %}

• Capitalize a personalization variable. Below is an example with the first name:

{% if contact.firstname != "" %}
Hello {{ contact.firstname | capitalize }},
Welcome! We are delighted to have you.
{% else %}
Good morning,
Welcome among us!
{% endif %}

• Format a personalization variable as proper names. Below is an example with the first name:

{% if contact.firstname != "" %}
Hello {{ contact.firstname | downcase | capitalize }},
Welcome! We are delighted to have you.
{% else %}
Good morning,
Welcome among us!
{% endif %}

-

#3 - Adapt the message according to the contact's language

• Create a different custom block depending on the contact's language

{% if contact.language == "fr" %}
Take advantage of our special offers in France!
{% elsif contact.language == "es" %}
Enjoy our new special offers in Spain!
{% else %}
Discover our special offers worldwide!
{% endif %}

• Distinguish between contacts living in Paris and those residing in the rest of France

-

#4 - Adapt the message according to the contact's gender

• Create gender-based personalization and personalize with the contact's first name

{% if contact.custom_fields["gender"] == "female" %}
Dear {{ contact.firstname }}, take advantage of our exclusive offers just for you!
{% elsif contact.custom_fields["gender"] == "male" %}
Dear {{ contact.firstname }}, here are some promotions that might interest you!
{% else %}
Hello {{ contact.firstname }}, discover our latest news!
{% endif %}

• Reformat all these first names to uppercase format

{% if contact.custom_fields["gender"] == "female" %}
Dear {{ contact.firstname | upcase }}, take advantage of our exclusive offers just for you!
{% elsif contact.custom_fields["gender"] == "male" %}
Dear {{ contact.firstname | upcase }}, here are some promotions that might interest you!
{% else %}
Hello {{ contact.firstname | upcase }}, discover our latest news!
{% endif %}

-

#5 - Display dates

Today's full date: {{ "now" | date: "%Y-%m-%d" }}

• Show the day first, then the month, and finally the year

Today's full date in DD-MM-YYYY format: {{ "now" | date: "%d-%m-%Y" }}

• Add current day of week and month dynamically

Day of the week: {{ "now" | date: "%A" }}
Current month: {{ "now" | date: "%B" }}
Today's full date in DD-MM-YYYY format with the current day of the week and month in place of the MM: {{ "now" | date: "%A %d-%B-%Y" }}

• Remove hyphens and display days, months, and years in my contacts' language

• Show only the day of the week (not the month)

Today's full date in DD-MM-YYYY format with the day of the week in French: {{ "now" | date: "%A, %d-%m-%Y" | replace: "Monday", "Lundi" | replace: "Tuesday", "Mardi" | replace: "Wednesday", "Mercredi" | replace: "Thursday", "Jeudi" | replace: "Friday", "Vendredi" | replace: "Saturday", "Samedi" | replace: "Sunday", "Dimanche" }}

• Display a date in DD-MM-YYYY format even if it was stored in another format

{{contact.custom_fields['fields'] | date: "%d-%m-%Y" }}
Please note : this format transformation works equally well if the field is in date or text format.

-

#6 - Include automatically calculated variables

• Example 1: the amount remaining to be reached to benefit from free delivery for an abandoned basket

Hello {{ contact.firstname }}, you're almost there ;) You still need to spend {{ 20 | minus: order.total_price }} euros to benefit from free delivery.
Rounding up a number: {{ 123.4567 | ceil }}
Rounding down a number: {{ 123.4567 | floor }}
Rounding to the nearest number: {{ 123.4567 | round }}

Note: 123.5 is always rounded up

• Example 2: you want to format the price of an order by replacing the “.” with a “,” and always displaying two digits after the decimal point

{% assign parts = order.total_price | split: "." %}{% assign decimal = parts[1] | append: "00" | slice: 0, 2 %}{{ parts[0] }},{{ decimal }} € 

-

#7 - Adding a post-purchase (or abandoned basket) loop with the image and information of the product

• Creating a loop to display all the products in the basket or purchase with the information of your choice (price, image, name, etc.). Example using the Message Builder: :

Syntax to use by using Liquid directly:
{% for orderline in order.orderlines %}
Product: {{orderline.product.name}}
Product: {{orderline.product.external_id}}
Quantity: {{orderline.quantity}}

Please note: the loops are based on the ticket lines, so the variable to use is not the one from the product table, namely {{orderline. product.name}} and not {{product.name}}.

NB: the variable to place behind the image to display the dynamic image of each product is: {{orderline.product.img_url}}

-

#8 - Modify the display of a personalisation loop

• Display products horizontally rather than vertically, for example.

To do this, simply create 3 columns:

1. First column = {% for orderline in order.orderlines limit:3 %} + Image + Product name: {{orderline.product.name}} + Product price: {{orderline.product.price}} €

2. Second column = {% endfor %}

3. Third column = leave empty

Please note: To avoid any discrepancies in the display of product names, it is essential to define a maximum character limit for the names of the fields to be displayed and to always use images of the same size.

-

#9 - Create a product loop from a customised field of the contacts table

• For example, for a back in stock campaign to customise the design according to the preferences of each contact

  

{% create_products_list products_list=contact.custom_fields[‘city’] %}{% for product in products_list %}
{{product.name}}
{{product.price}} €
{% endfor %}

Please note: in this case, it is the products table that must be used after creating the list. All the variables will therefore refer to this table.

NB: the variable to be placed after the image to display the dynamic image of each product is: {{product.img_url}}

-

#10 - Create a loop of recommended products from a customised field in the products table

• For example, display a list of recommended products from a customised field in the product table to display them in a post-purchase campaign

{% for orderline in order.orderlines limit:1 %}
{% create_products_list products_list=orderline.product.custom_fields['splio_product_recommendation_1'] %}{% for product in products_list %}
{{product.name}}
{{product.price}} €
{% endfor %}
{% endfor %}

-

#11 - Create a product loop using the external IDs of certain articles

• Customise a design by displaying default products in a campaign

{% create_products_list products_list='splio01,splio02,splio03' %}
{% for product in products_list %}
{{product.name}} {{product.price}} €
{% endfor %}

-

#12 - Add store personalisation

• Customise a post-purchase campaign according to the shop where the purchase was made, for example to remind customers of its opening hours.

{% if order.store.external_id == ‘physique’ %}
Thank you for shopping at {{order.store.name}}.
The opening hours of your favourite store are as follows: {{order.store.custom_fields[‘opening_hours’]}}
{% endif %}

-

#13 - Automatically customise your UTM variables

To dynamically customise your UTM variables, you can use the following variables:

• {{campaign_name}} to display the name of the campaign

• {{campaign_id}} to display the ID of the campaign

-

Going further

More information on technical documentation.

--