Dynamic Email Templates Back To Documentation

sendwithus supports a large subset of the Jinja templating language. Here we provide examples for common templating use cases.

Simple variable replacement can be achieved using the following syntax.

API Call

{
    "first_name": "Chuck",
    "last_name": "Norris",
    "img": "http://placekitten.com/50/60",
    "link": {
      "url": "https://www.sendwithus.com",
      "text": "sendwithus!"
    }

}

Template HTML

<h1>Hello {{ first_name }}</h1>
<img src="{{ img }}">
<a href="{{ link.url }}">
    {{ link.text }}
</a>




    

Rendered HTML

Hello Chuck

sendwithus!

Conditional syntax can be used to include/exclude email content based on data passed into API calls.

API Call

{
    "paid_customer": false,
    "signup_type": "referral"
}





    

Template HTML

{% if paid_customer %}
    Thanks for being a customer!
{% else %}
    Sign up today and get 30% off!
{% endif %}

{% if signup_type == 'referral' %}
    <a href="#">Refer your friends!</a>
{% endif %}

Rendered HTML

Sign up today and get 30% off!
Refer your friends!







    

The sendwithus API accepts JSON arrays for email data. These arrays can be iterated over inside the HTML template.

API Call

{
    "invoice_items": [
        {
            "desc": "Item One",
            "price": "$5.99"
        }, {
            "desc": "Item Two",
            "price": "$10.00"
        }
    ]
}

Template HTML

<h2>Your Invoice:</h2>
<ul>
    {% for item in invoice_items %}
    <li>
    {{ item.desc }}: {{ item.price }}
    </li>
    {% endfor %}
</ul>



Rendered HTML

Your Invoice:

  • Item One: $5.99
  • Item Two: $10.00

Most of your HTML needs can be met in our template editor or by using Snippets. If you are using user-generated HTML and you need to pass raw HTML as a variable, you'll need to escape it with jinja safe filters or autoescape tags.

API Call

{
    "message": "<h2>Hello</h2><p>Lorem ipsum</p>"
}





Template HTML

{{ message|safe }}
<a href="https://www.sendwithus.com">Click here.</a>






Rendered HTML

Hello

Lorem impsum

Click here.

The following variables are provided by sendwithus and are available in every template.

Usage Description Example
{{ swu.recipient.address }} Recipient's email address danny.tanner@email.com
{{ swu.recipient.name }} Recipient's name (if provided) Danny Tanner
{{ swu.sender.address }} Sending address notifications@yourdomain.com
{{ swu.sender.name }} Sending name AwesomeProduct
{{ swu.sender.reply_to }} Sending Reply-To address (if provided) no-reply@yourdomain.com
{{ swu.template.id }} Template API ID tem_2OASY7df92
{{ swu.template.locale }} Template Locale en-US
{{ swu.template.name }} Template Name Welcome Email
{{ swu.template.version_id }} Template Version Id ver_123453sdf30
{{ swu.template.version_name }} Template Version Name Version A - Friendly Subject Line
{{ swu.webview_url }} URL to view this email in a browser
{{ swu.log_id }} Send receipt ID log_1234asdf9876lkjh

Advanced Jinja for html wizards

The following example illustrates how the round and format filters can be used to display numbers.

API Call

{
    "price": 44.450
}






Template HTML

<h4>Numbers:<h4>
<ul>
   <li>{{ price|round }}</li>
   <li>{{ price|round(1) }}</li>
   <li>{{ price|round|int }}</li>
   <li>{{ "${:.2f}".format(price) }}</li>
</ul>


Rendered HTML

Numbers:

  • 44.0
  • 44.5
  • 44
  • $44.45

The following example illustrates how to use our custom Jinja filters to achieve date formatting of both timestamps and ISO 8601 date strings. For a rundown on formatting rules see the python docs

API Call

{
    "iso_date": "2015-02-17T18:30:20.000Z",
    "timestamp": "1424197820"
}






Template HTML

<h4>ISO:</h4>

{{ iso_date|iso8601_to_time|datetimeformat('%a, %B %d') }}

<h4>Timestamp:</h4>

{{ timestamp|timestamp_to_time|datetimeformat('%a, %B %d') }}

Rendered HTML

ISO:

Tue, February 17

Timestamp:

Tue, February 17



Below we show how to use default to gracefully handle empty variables. The filter wordwrap is shown as an example of how to format a plain text email so it looks good, no matter the size.

API Call

{
    "firstName": "",
    "message": "This be some words"
}


Template Text

Hi {{ firstName|default('there', true) }},
{% filter wordwrap(4) %}
{{ message }}
{% endfilter %}


Rendered Text

Hi there,
This
be
some
words

Let jinja do the CSS work for you! The example below uses the loop control variable loop.cycle to alternate between CSS classes to make a striped table.

API Call

{
    "items": [
        { "price": "$12.00" },
        { "price": "$3.00"  },
        { "price": "$20.00" },
        { "price": "$42.00" },
    ]
}


Template HTML

<table>
 {% for item in items %}
  <tr class="{{loop.cycle('','stripe')}}">
    <td>{{ item.name }}</td>
  </tr>
 {% endfor %}
</table>



Rendered HTML

            
$12.00
$3.00
$20.00
$42.00