Using Actito's specific tags

Personalizations

Personalizations allow you to customize your messages and adapt them to every recipients. To personalize your emails you can use a wide range of data stored in Actito and, of course, you can also use them when coding an email HTML file.

The unsubscribe link

In each B2C communication, it is mandatory to allow the person receiving the email to unsubscribe quickly and easily.

How to do it:

By adding an unsubscribe link at the top or the bottom of the email.

Example

<a href="${unsubscribe}" title="unsubscribe" target="_blank"> Unsubscribe </a>

The mirror link

In each communication, we recommend putting a mirror link in the email, so that the reader can see the email in a web browser, rather than the classic email client .

How to do it:

By adding a mirror link at the top or bottom of the email.

Example

<a href="${WebVersion}" title="version web" target="_blank"> Web version </a>

Personalization based on the database

It is possible to customize the copy of the email by adding a personalization coming directly from your database.

How to do it:

Using ${attributName}.

Example

Dear $\{firstName} ==> Will give Dear Sébastien

Personalization based on the person's gender

It is possible to customize a part of your text based on the gender of the person you are contacting.

How to do it:

Using ${genderTest}.

Example

If he is a man: Dear Mr. Smith

If she is a woman: Dear Ms. Smith

Including a form in your html email

You can easily bind a form to a html email.

How to do it:

Using ${form}.

Example

<a href="${form}" title="My form" target="_blank"> Web Form link </a>

Link names

The title of the links in your e-mail is displayed when a profile will hover them with their mouse. In addition to that, you can add a name to these links. The name is used in the reporting of your campaign, to allow you to quickly analyze the click results.

It is inserted with the attribute data-actito-link-name.

Example

<a
  target="_blank"
  href="http://www.actito.be"
  title="My link description"
  data-actito-link-name="My reporting reference"
>
  actito.be
</a>

Conditions

With display conditions, different blocks of the same message can be shown or not shown to a profile depending on a series of pre-determined conditions.

The result is that some parts of your content will only be seen by the profiles who meet the relevant criteria. Conditions are also available when using an HTML file to define your email messages.

You just need to add the attribute data-actito-if= in the email section for which you want to create the condition.

This implies only establishing the association between the condition variable and the relevant HTML section. For example: data-actito-if=${condition1}

You will then need to set the parameters for the different criteria through the Actito interface, via the Personalizations tab. It is not possible to code the parameters directly on the HTML file.

Example

<td data-actito-if="${condition1}" align="left">
  <a href="https://www.actito.com/en-BE" target="_blank" style="border:0;">
    <img
      src="https://pbs.twimg.com/profile_images/1194974678969917440/HWjtzNpP_400x400.jpg"
      width="640"
      height="390"
      class="resize320"
      style="display:block; border:0; width:100%; height:auto;"
      alt=""
    />
  </a>
</td>

Loop customizations

Loop customizations are often used with Transactional E-mails, when you use several lines of data that are associated, such as Custom Tables. They allow you to replace the customization variable by a set of related values instead of a single value. They are also set up through HTML code.

To configure loop customizations, add the parameter "data-actito-each" and to define it as "loop name": ${loop name in plural}: data-actito-each ="example:${examples}". Each element of the loop needs to follow the format: ${loop name.element name}: **${example.element}.**

Let's look at a practical example: We want to display a loop containing the last purchases made by contacted profiles and, for each one, to display the article name and its price. You would need to insert the following piece of code.

Example

<div data-actito-each="purchase:${purchases}">
  <span> Article: ${purchase.article} </span>
  <span> Price: ${purchase.price} </span>
</div>

After inserting the correct piece of code, the variables must be set up through the Personalizations tab. You will find more information on this topic in the article on transactional e-mails.

info

Loop customizations are available for all e-mail types, only on Actito's NewMail engine.

Background images

It is possible to apply a background image in your HTML e-mails, allowing you to design e-mails with two layers: a global image in the background and elements in the front (text, another image).

Background images can create a very nice effet in your e-mail, but to ensure a proper display, make sure that the size of the image match the elements appearing above. It can be applied to the whole e-mail, or more commonly, to part of it.

To display the background image on Outlook, it must be specifically referenced in a conditional comment, as the standard way to insert it won't work.

tip

The image URL must be in https. This means that, if you import the image in the zip, your link domain must be certified.

The following snippet gives a good example of the code used to insert a background image.

<td style="height:320px;background-image:url(images/3.jpg);background:url*(images/3.jpg) no-repeat center top/640px 320px;background-size:640px 320px;background-position:center top;background-repeat:no-repeat;vertical-align:top"  background="images/3.jpg" height="320">

<!--[if gte mso 12]> <v:image xmlns:v="urn:schemas-microsoft-com:vml" style="width:202px;height:298px;" color="#ffffff" src="images/3.jpg" />