Skip to main content

Prewritten HTML Snippets

To simplify the process, ready‑to‑use HTML examples are provided for you to copy, paste, and adapt as needed.

Skip a line - <br>

Good news {{order.first_name}}! <br> Your {{shop.name}} package is in the hands of {{carrier.name}} and is on its way.

Bold text - <b></b>

<b> "Hello {{order.first_name}}" </b>

Italic text -

<i> Good news {{order.first_name}}! Your {{shop.name}} package is in the hands of {{carrier.name}} and is on its way. </i>

Put text in lowercase (in the title of a notification, for example) <div style="text-transform:none;">Your package is on its way! </div>

Left justify text <p align="left"> Good news {{order.first_name}}! {{carrier.name}} marked that your package was delivered.</p>

Right justify text <p align="right"> Good news {{order.first_name}}! {{carrier.name}} marked that your package was delivered.</p>

Center justify text <p align="justify"> Good news {{order.first_name}}! {{carrier.name}} marked that your package was delivered.</p>

Change color of a word Hello <font style="color:#ee8900";> {{order.first_name}} {{order.last_name}} </font>

Insert a hyperlink on a word ("HERE" in our example) <a href = "page URL">HERE</a>

Insert a Call to Action (CTA) Copy and paste the HTML snippet below into the "email body" part of the desired notification.

<tr><td align="center">Hello {{ order.first_name }},</td></tr>
<tr><td align="center">You have just received your order from XXX.com</td></tr>
<tr><td align="center">We'd like to get your feedback.</td></tr>
<tr><td align="center">This is important to us and only takes a few seconds.,</td></tr>
<tr><td align="center">A big thank you for your participation. </td></tr>
<tr><td align="center" style="padding-top:20px;padding-bottom:10px;">The {{ shop.name }} team
</td></tr>
</br>
<tr>
  <td align="center" class="button-wrapper" style="-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;mso-table-lspace:0pt;mso-table-rspace:0pt;word-break:break-word;padding-top:40px;padding-bottom:20px;padding-right:25px;padding-left:25px;">
    <table cellpadding="0" cellspacing="0" align="center" border="0" style="-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;mso-table-lspace:0pt;mso-table-rspace:0pt;">
      <tbody>
        <tr>
          <td align="center" valign="middle" class="button email-main-color-bg" style="-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;mso-table-lspace:0pt;mso-table-rspace:0pt;background-color:#d0063c;border-radius:0px;cursor:pointer;padding-top:10px;padding-bottom:10px;padding-right:25px;padding-left:25px;text-transform:uppercase;">
            <a href=
            "https://survey.diduenjoy.com/fr/ABCD?ref_mail={{order.email}}&date_shipping={{tracker.expedition_date}}&order_ref={{order.order_number}}&country={{shipping_address. country_code}}&date_order={{order.order_date}}&firstname={{order.first_name}}&name={{order.last_name}}"
            target="_blank" style="-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;font-family:Helvetica, Arial, sans-serif;font-size:16px;cursor:pointer;color:#FFFFFF;text-decoration:none;">
            I'LL TAKE PART
            </a>
          </td>
        </tr>
      </tbody>
    </table>
  </td>
</tr>

Note: The snippet below (taken from the code above) is the URL to be changed with the variables available in ZigZag if you wish to retrieve information automatically:

"https://survey.diduenjoy.com/fr/ABCD?ref_mail={{order.email}}&date_shipping={{tracker.expedition_date}}&order_ref={{order.order_number}}&country={{shipping_address. country_code}}&date_order={{order.order_date}}&firstname={{order.first_name}}&name={{order.last_name}}"