SmartSender supports a large subset of the Twig templating language. Below are examples for some common templating use-cases.
API Call Template HTML Rendered HTML |
Variable Replacement Simple variable replacement can be achieved using the following syntax. |
{
"variables": [{
"name": "firstName",
"value": "John"
}, {
"name": "image",
"value": "http://domain.com/image.gif"
}, {
"name": "link",
"value": "https://smartsender.io"
}]
} <h1>Hello {{ firstName }},</h1>
<img src="{{ image }}">
<a href="{{ link }}"> Go to SmartSender</a> |
| |
Conditional Content
Conditional syntax can be used to include/exclude email content based on data passed into API calls or stored in contact list.
{"variables": [ {
"name": "paidCustomer",
"value": false
}, {
"name": "signupType",
"value": "referral"
}], {% if paidCustomer %}
Thanks for being a customer!
{% else %}
Sign up today and get 30% off!
{% endif %}
{% if signupType == 'referral' %}
<a href="https://smartsender.io">Refer your friends!</a>
{% endif %} HTML in Variables Most of your HTML needs can be met in our template editor. If you are using user-generated HTML and you need to pass raw HTML as a variable, you’ll need to escape it with Twig raw filters or autoescape tags. {"variables": [ {
"name": "message",
"value": "<h4>Hello</h4><p>World</p>"
}], {{ message|raw }}
<a href="https://smartsender.io">
</a> |
Formatting Numbers The following example illustrates how the round and format filters can be used to display numbers. {"variables": [ {
"name": "price",
"value": 9800.333
}] <h4>Numbers:<h4>
<ul>
<li>{{ price|round }}</li>
<li>{{ price|round(1, 'floor') }}</li>
<li>{{ price|number_format(2, '.', ',') }}</li>
<li>{{ price|number_format(0, '.') }}</li>
<li>{{ "$%.2f"|format(price) }}</li>
</ul>
Numbers:
9800
9800.3
9,800.33
9 800
$9800.33 |
Formatting Dates The following example illustrates how to use Twig filters to achieve date formatting of both timestamps and ISO 8601 date strings. {"variables": [ {
"name": "timestamp",
"value": "1539377301"
},{
"name": "isoDate",
"value": "2016-04-29T15:47:28+02:00"
},] <h4>Flexible date formating</h4>
<p>Current date: {{ "now"|date("m/d/Y") }}</p>
<p>isoDate: {{ isoDate|date("D, F y") }}</p>
<p>timeStamp to custom:<
{{ timestamp|date('g:ia \o\n l jS F Y') }} </p> Flexible date formating
Current date: 10/12/2018
isoDate: Fri, April 16
timeStamp to custom: 8:48pm 2018 Friday 12th October 2018
|
