Dynamic content personalisation

The Sign-Up.to dynamic content system allows emails to be personalised for individual subscribers by automatically changing the content of the email sent to them based on a set of rules that you create. This is done using a new set of mark-up tags that are placed within your conventional HTML.

Dynamic content can benefit you in several ways:

  • You can send one campaign that has different content for different groups of people.
  • Personalisation extends beyond outputting a field from a database. Dynamic content allows different text and images to be sent depending on what we know about an individual.
  • As well as our standard personalisation fields (name, date of birth etc.), you can use dynamic content with your own custom profile fields relevant to your brand, such as preferred operating system or nearest store (note that dynamic content is not compatible with multiple select fields). 
  • By targeting your message to specific subscriber interests you can increase the relevance of your emails, leading to better results and happier subscribers!

Dynamic content uses conditions which can be expressed with logic of arbitrary complexity so that you can create fine-grained rules to determine which subscribers see what content.

In order to use dynamic content and this documentation you will need a working understanding of HTML.

The sections below provide complete documentation for all the dynamic content tags and their syntax. The Errors section documents all of the errors that can be returned if you make a mistake when using dynamic content, and finally, the Examples section has a listing of sample campaigns.

Testing your campaigns

To make it easy to test your dynamic content campaigns, we've created a sandbox tool which you can use to simulate sending a campaign to different subscribers, to see the content that will be output under different conditions.

Availability

This feature is available to all customers but if you've had an account with us for a while then you may need to check with Support that dynamic content has been activated.

Contents

Getting started – the if statement

At the core of dynamic content is the if statement. In its simplest form this consists of an expression and a then statement containing HTML output or more dynamic content. In the below example we provide additional text for female subscribers.

<sut:if>
    <sut:equals>
        <sut:profile name="gender" />
        <sut:value>female</sut:value>
    </sut:equals>
    <sut:then>
        <p>This is visible only to women</p>
    </sut:then>
</sut:if>

Any number of conditions and actions can be placed inside an if statement. Extending the above, we can produce alternative text for men and women. Each expression will be evaluated in sequential order and in the first case that one evaluates to true, the following then tag will be placed in the email.

<sut:if>
    <sut:equals>
        <sut:profile name="gender" />
        <sut:value>female</sut:value>
    </sut:equals>
    <sut:then>
        <p>This is visible only to women</p>
    </sut:then>
    <sut:equals>
        <sut:profile name="gender" />
        <sut:value>male</sut:value>
    </sut:equals>
    <sut:then>
        <p>This is visible only to men</p>
    </sut:then>
</sut:if>

Some conditions we cannot easily anticipate. For this reason, the else tag can optionally be placed at the end of the if statement.

<sut:if>
    <sut:equals>
        <sut:profile name="gender" />
        <sut:value>female</sut:value>
    </sut:equals>
    <sut:then>
        <p>This is visible only to women</p>
    </sut:then>
    <sut:equals>
        <sut:profile name="gender" />
        <sut:value>male</sut:value>
    </sut:equals>
    <sut:then>
        <p>This is visible only to men</p>
    </sut:then>
    <sut:else>
        <p>This is a gender-neutral default</p>
    </sut:else>
</sut:if>

Back to contents

The profile tag

The profile tag is a replacement for the older personalisation tags.

<p>Hello <sut:profile name="first_name"/></p>
<p>Hello <sut:profile name="first_name" alt="Sir/Madam"/></p>
<p>Hello <sut:profile name="first_name" format="ucase"/></p>

The profile tags can also be used as standalone conditional expressions to see if we have that information about a person.

<sut:if>
    <sut:profile name="first_name" />
    <sut:then>The subscriber has a firstname</sut:then>
    <sut:else>The subscriber doesn't have a firstname</sut:else>
</sut:if>

The below table has a full breakdown of attributes:

The following formatting modes are available:

A list of basic profile fields and their default format:

Back to contents

Action tags

Action tags insert links for specific actions that can be triggered from your email, for example an unsubscription request. You can customise your own text within the tags to appear to your subscribers.

<sut:change_format>Change Format to text</sut:change_format>
<sut:unsubscribe >Unsubscribe from this list </sut:unsubscribe>
<sut:send_to_friend>Send this to a friend</sut:send_to_friend>
<sut:online_version >View this in a browser</sut:online_version>

Default text:
Change Format
Unsubscribe
Send to Friend
View online version

Any attributes you add to the tags will be preserved when output, allowing you to add styles, names, classes, etc:

<sut:change_format>Change format to text</sut:change_format>
<sut:unsubscribe style="color:#ffffff;">A white unsubscribe link</sut:unsubscribe>
<sut:send_to_friend style="font-family:Arial;">Specified font</sut:send_to_friend>
<sut:online_version align="center">Centred view online</sut:online_version>

You can also include other tags, for example images, within the action tags:

<sut:change_format><img src="textversion.jpg" alt="Change Format to text" /></sut:change_format>
<sut:unsubscribe><img src="unsubscribe.jpg" alt="Unsubscribe from this list" /></sut:unsubscribe>
<sut:send_to_friend><img src="sendtofriend.jpg" alt="Send this to a friend" /></sut:send_to_friend>
<sut:online_version><img src="viewinbrowser.jpg" alt="View this in a browser" /></sut:online_version>

Back to contents

The image tag

The image tag can be used to build personalised HTML img tags. The src attribute can be personalised to insert all basic profile fields and extended profile fields in their raw format. Field names must be enclosed in '%' characters. e.g. %first_name%, %surname% and %email%. For example:

<sut:image src="http://www.sign-up.to/assets/images/%first_name%.png" name="image1" />

The above example would generate the following HTML image tag – based on the specified field containing the raw value 'logo':

<img src="http://www.sign-up.to/assets/images/logo.png" name="image1" />

N.B. the HTML img tag will inherit all other sut:image attributes, allowing you to specify all supported img tag attributes.

Back to contents

The value tag

The value tag is used to encapsulate literal values within an expression.

Back to contents

Comparison tags

There are a variety of tags that can be used within a conditional statement. First of all, the equals tag can be used to compare two values. In the below example, the expression evaluates to true if the subscriber lives in a town called Woking. This is a case-insensitive match.

<sut:equals>
    <sut:profile name="town" />
    <sut:value>Woking</sut:value>
</sut:equals>

The not_equal tag behaves the opposite way to the equals tag. In the below example the expression evaluates to true if the subscriber lives anywhere except a town called Woking.

<sut:not_equal>
    <sut:profile name="town" />
    <sut:value>Woking</sut:value>
</sut:not_equal>

There are tags to deal with checking ranges of values. The following example evaluates to true if the subscriber was born after July.

<sut:greater_than>
    <sut:profile name="birth_month" />
    <sut:value>7</sut:value>
</sut:greater_than>

More comparisons can be done with the following tags:

<sut:greater_or_equal>
<sut:less_than>
<sut:less_or_equal>

There are simplified aliases for all of the comparison tags.

<sut:eq>   Equals
<sut:neq>  Not equals
<sut:gt>   Greater than
<sut:gte>  Greater than or equal to
<sut:lt>   Less than
<sut:lte>  Less than or equal to

Back to contents

Logic tags

More complicated comparisons can be built up by using logical operator tags. These can be nested to any depth. The and tag evaluates to true if all sub-expressions are true. In the below example, the expression is true if the subscriber lives in Woking and was born in December.

<sut:and>
    <sut:equals>
        <sut:profile name="town" />
        <sut:value>Woking</sut:value>
    </sut:equals>
    <sut:equals>
        <sut:profile name="month_birth" />
        <sut:value>12</sut:value>
    </sut:equals>
</sut:and>

The or tag evaluates to true if any of the contained expressions are true. In the below example, the expression evaluates to true if the subscriber either lives in Guildford or was born in January.

<sut:or>
    <sut:equals>
        <sut:profile name="town" />
        <sut:value>Guildford</sut:value>
    </sut:equals>
    <sut:equals>
        <sut:profile name="month_birth" />
        <sut:value>1</sut:value>
    </sut:equals>
</sut:or>

The not tag inverts the result of an expression. In the below example, the expression evaluates to true if the subscriber does not live in Woking.

<sut:not>
    <sut:equals>
        <sut:profile name="town" />
        <sut:value>Woking</sut:value>
    </sut:equals>
</sut:not>

Back to contents

Dates and times

There are a handful of tags available for easier manipulation of dates and time.

The most flexible is the now tag, which can be used in comparisons or can be formatted according to other rules to produce the output you require.

<sut:now />					2010-01-22 17:31:44
<sut:now format="date" />			22nd January 2010
<sut:now format="php_date" pattern="F" />	January

A few additional tags have been introduced to make comparisons simpler.

<sut:now_date />	2010-01-22
<sut:now_time />	17:31
<sut:now_day />		01-22
<sut:now_month />	1

In addition to the day, month and year fields which can be used on an individual basis, a composite of their day and month of birth can be retrieved from a profile field. This is designed to do full birthday comparisons with the now_day tag.

<sut:profile name="birthday"/>	07-03

Back to contents

Errors

If you create a message with invalid dynamic content, syntax errors will be reported and the message will not be stored. This section describes each error.

Tag not closed

The new dynamic tags should always be valid mark-up. This means all tags must be closed at some point.

<sut:value>This tag hasn't been closed
<sut:value>This tag has been closed</sut:value>
<sut:value />Before this text is an empty tag, it wont need a close tag

Unexpected close tag

If a closed tag is found when no tag of that type was previously opened an error is produced.

After this text is an unexpected close tag</sut:value>

Unsupported dynamic tag

If you use a tag that is not recognised this error will be produced. The purpose of this error is to help identify spelling mistakes and avoid sending HTML that won't render in a web browser. Only tags in a name-space known to have dynamic content tags will be scanned for unsupported tags.

<sut:unsupported_tag>This will produce an error</sut:unsupported_tag>
<unsupported_tag>This will not produce an error</unsupported_tag>

Expected tag

This message will be produced if a tag has been closed prematurely or contains the wrong kind of tags. For example, failing to provide a then tag after an expression in an if statement.

<sut:if>
    <sut:profile name="surname" />
    <sut:value>This should be an sut:then tag</sut:value>
</sut:if>

Expected attribute

Some tags require attributes. For example, sut:profile needs the name of the profile field to display.

<sut:profile name="surname"/>
<sut:profile />

Unsupported attribute

Some tag attributes have a very specific set of allowed values and failing to provide a correct value results in this error, for example when determining the format of the output of a sut:value or sut:profile tag.

<sut:profile name="surname" format="ucase" />
<sut:profile name="surname" format="uppercase" />

Expected tag to be empty

Some tags should never contain anything else. The profile tag is the perfect example of this.

<sut:profile name="surname" />
<sut:profile name="surname"></sut:profile>
<sut:profile name="surname">Expected tag to be empty</sut:profile>

Other errors

If an undocumented error has occurred, please contact support.

Back to contents

Examples

Upcoming birthdays

This is a message sent to patrons of a restaurant. If someone lives in Woking and it's their birthday in December it will display a special message.

<p>Hello <sut:profile name="first_name" alt="Sir/Madam"/></p>
<p>Come to our restaurant - the food is great!</p>
<sut:if>
    <sut:and>
        <!-- If it's their birthday in December ? -->
        <sut:equals>
            <sut:profile name="month_birth" />
            <sut:value>12</sut:value>
        </sut:equals>
        <!-- And they live in Woking ? -->
        <sut:equals>
            <sut:profile name="town" />
            <sut:value>woking</sut:value>
        </sut:equals>
    </sut:and>
    <sut:then>
        <p> It's your birthday soon, why not throw a party? </p>
    </sut:then>
</sut:if>
<p>
<sut:if>
    <sut:profile name="first_name" />
    <sut:then>Yours sincerely,<br /></sut:then>
    <sut:else>Yours faithfully,<br /></sut:else>
</sut:if>
The Chef
</p>

Last purchase

This example shows three images of a clothing vendor's latest outfits based on their last purchase and gender. It presumes the company has last_purchase set up as an extended profile field, and that they are updating subscriber profiles once a purchase is made.

<p>Our latest offers!</p>
<sut:if>
    <sut:equals>
        <sut:profile name="last_purchase" />
        <sut:value>casual</sut:value>
    </sut:equals>
    <sut:then>
        <p>Our latest casual clothes..</p>
        <img src="http://www.myclothes.none/tshirt1.jpg" alt="Red Tshirt"/>
        <img src="http://www.myclothes.none/tshirt2.jpg" alt="Green Tshirt"/>
        <img src="http://www.myclothes.none/tshirt8.jpg" alt="Yellow Tshirt"/>
    </sut:then>
    <sut:equals>
        <sut:profile name="last_purchase" />
        <sut:value>professional</sut:value>
    </sut:equals>
    <sut:then>
        <sut:if>
        <sut:equals>
            <sut:profile name="gender" />
            <sut:value>male</sut:value>
        </sut:equals>
        <sut:then>
            <p>Our latest Men's work clothes..</p>
            <img src="http://www.myclothes.none/maleshirt10.jpg" alt="Men's shirt white"/>
            <img src="http://www.myclothes.none/maleshirt20.jpg" alt="Men's shirt black"/>
            <img src="http://www.myclothes.none/maletrousers23.jpg" alt="Men's trousers black"/>
            </sut:then>
            <sut:equals>
                <sut:profile name="gender" />
                <sut:value>female</sut:value>
            </sut:equals>
            <sut:then>
                <p>Our latest Women's work clothes..</p>
                <img src="http://www.myclothes.none/femaleshirt10.jpg" alt="Women's shirt white"/>
                <img src="http://www.myclothes.none/femaleshirt20.jpg" alt="Women's shirt black"/>
                <img src="http://www.myclothes.none/femaletrousers23.jpg" alt="Women's trousers black"/>
            </sut:then>
            <sut:else>
                <p>Our latest work clothes..</p>
                <img src="http://www.myclothes.none/maleshirt10.jpg" alt="Men's shirt white"/>
                <img src="http://www.myclothes.none/maletrousers23.jpg" alt="Men's trousers black"/>
                <img src="http://www.myclothes.none/femaleshirt10.jpg" alt="Women's shirt white"/>
            </sut:else>
        </sut:if>
    </sut:then>
    <sut:else>
        <p>Our latest clothes...</p>
        <img src="http://www.myclothes.none/tshirt2.jpg" alt="Green Tshirt"/>
        <img src="http://www.myclothes.none/femaleshirt20.jpg" alt="Women's shirt black"/>
        <img src="http://www.myclothes.none/maletrousers23.jpg" alt="Men's trousers black"/>
    </sut:else>
</sut:if>
<p>
<a href="http://www.myclothes.none/welcome">Visit our online store!</a>
</p>

Back to contents

Further reading

Powered by Zendesk