Overview
Dynamic content enables you to personalize messages at scale. Using Smarty tactics such as conditionals and loops in your message HTML or Sculpt Blocks, you can send one message that will load content specific to each individual contact, tailoring your messages according to product affinity, age, location, and much more.
This article introduces a few impactful ways to begin using dynamic content in your messages.
Get started with dynamic content
In order to unlock all the possibilities of dynamic content in Cordial, you need to have data flowing into your account via Data Job, API, or JavaScript Listeners embedded on your site.
With real-time data available to you, you can create dynamic content in a message using the HTML Editor—or in a Sculpt Block, which you can then add to a Sculpt Template or message.
1. Create a new message using the HTML Editor and navigate to Message Content, or create a new Sculpt Block.
- HTML Editor: Messages > Create New Message > HTML Editor (radio selection) > Message Content
Example referral program message
- Sculpt Block: Content > Sculpt Blocks > New
Example of dynamic product recommendation Sculpt Blocks
2. Use the tactics described below to create dynamic content in your message or Sculpt Block.
Salutations, gender, affinity, and other conditional content
Using conditional {if}
statements in your HTML is a great way to greet contacts by first name and send content specific to gender, product affinity, and more.
Here's a basic example of using {if}
statements to send a personalized greeting and content specific to gender.
-
Hey{if $contact.first_name} {$contact.first_name}{/if}, <p></p> {if $contact.gender == 'male'} We have tons of exciting deals in our new men's wear collection! {elseif $contact.gender == 'female'} Our new women's wear is flying off the shelves! Don't miss out on these deals. {else} You'll love these seasonal deals! {/if}
-
Man
Hey Marcus,
We have tons of exciting deals in our new men's wear collection!
Woman
Hey Tina,
Our new women's wear is flying off the shelves! Don't miss out on these deals.
Gender not specified
Hey,
You'll love these seasonal deals!
Display similar and related products
{foreach}
statements allow you to loop through an array of data and render the results in a message. They're commonly used to display similar and related products after someone browses or purchases an item, or puts a product in their cart.
The following example shows a JSON array of data getting pulled from an example collection called pants
, which could be sent to a contact after they browse pants on a site. The example then uses an {if}
statement to only display pants under $90.
-
{$clothing=$utils->getSupplementRecords('pants')} {foreach $clothing as $pants} {if $pants.price < 90} <strong>{$pants.item} {$pants.collection}</strong><br> ${$pants.price}<br> {/if} {/foreach}
-
[ { "model": "joggers", "collection": "spring", "price": 75, "id": "01" }, { "model": "sweatpants", "collection": "winter", "price": 60, "id": "02" }, { "model": "rise_jeans", "collection": "fall", "price": 100, "id": "03" }, { "model": "capris", "collection": "spring", "price": 85, "id": "04" }, { "model": "cargos", "collection": "fall", "price": 100, "id": "05" }, { "model": "old_school", "collection": "fall", "price": 95, "id": "06" } ]
-
Joggers
$75
Spring collection
Sweatpants
$60
Winter collection
Capris
$85
Spring collection
Display nearest store location to a contact
People love to know what store is closest to them. The following code builds upon the distanceBetweenPostalCodes
utility using {foreach}
statements to do exactly that.
-
{$locations=$utils->getJson("https://p5.zdassets.com/hc/theme_assets/656597/200049057/store_locations.json")}
{foreach $locations as $location}
{$distance = $utils->distanceBetweenPostalCodes({$contact.address.postal_code},{$location.ZIP})}
{$tempArray[] = [
'distance' => {$distance},
'address' => {$location.Address},
'name' => {$location.Name},
'state' => {$location.State},
'zip' => {$location.ZIP}
]}
{/foreach}
<!--Sort Locations by Distance-->
{$sorted_by_distance = $utils->sortArray($tempArray, 'distance', 'asc')}
<!--Print Locations-->
<strong>Nearest Location</strong><br><br>
{foreach $sorted_by_distance as $closest}
{$closest.name}<br />
{$closest.address}<br />
{$closest.state} {$closest.zip}<br />
Approx {$closest.distance|string_format:"%d"} miles<br /><br />
{/foreach} -
[{ "Address":"3430 Galleria Circle", "Name":"Birmingham", "State":"Alabama", "ZIP":"35244" }, { "Address":"11525 Cantrell Rd", "Name":"Little Rock", "State":"ARKANSAS", "ZIP":"72212" }, { "Address":"3040 El Camino Real", "Name":"Tustin", "State":"CALIFORNIA", "ZIP":"92782" }, { "Address":"24201 Valencia Blvd Suite 3210", "Name":"Valencia", "State":"CALIFORNIA", "ZIP":"91355" }, { "Address":"5102 North Nevada Avenue", "Name":"Colorado Springs", "State":"COLORADO", "ZIP":"80918" }, { "Address":"8100 W Crestline Ave", "Name":"Littleton", "State":"COLORADO", "ZIP":"80123" }, { "Address":"4920 Thompson Pkwy", "Name":"Loveland", "State":"COLORADO", "ZIP":"80534" }, { "Address":"10438 Towncenter Drive", "Name":"Westminster", "State":"COLORADO", "ZIP":"80021" }, { "Address":"18713 Biscayne Boulevard", "Name":"Aventura", "State":"FLORIDA", "ZIP":"33180" }]
-
Nearest Location (will only display one store location)
Birmingham
3430 Galleria Circle
ALABAMA 35244
Approx 4 miles
Tustin
3040 El Camino Real
CALIFORNIA 92782
Approx 79 miles
Valencia
24201 Valencia Blvd Suite 3210
CALIFORNIA 91355
Approx 143 miles
Colorado Springs
5102 North Nevada Avenue
COLORADO 80918
Approx 805 miles
Littleton
8100 W Crestline Ave
COLORADO 80123
Approx 816 miles
Westminster
10438 Towncenter Drive
COLORADO 80021
Approx 824 miles
Loveland
4920 Thompson Pkwy
COLORADO 80534
Approx 849 miles
Little Rock
11525 Cantrell Rd
ARKANSAS 72212
Approx 1417 miles
Aventura
18713 Biscayne Boulevard
FLORIDA 33180
Approx 2260 miles
Continue exploring
These examples are only the beginning of what you can do with dynamic content in Cordial.
As always, feel free to contact your CSM to learn more about using dynamic content.
Comments
0 comments
Please sign in to leave a comment.