Design

Liquid Logic for Personalization

a photo of a postcard

Poplar offers a variety of flexible and creative ways to customize mailers based on customer data. Dynamic customizations such as first name, order history, recipient location, and so much more can be further optimized by the use of Liquid Template language.


Liquid Template language is used in conjunction with HTML and CSS to add extra functionality to variables by way of objects, filters, and if/else statements. For example, if HTML/CSS is a pizza with toppings, Liquid logic could help determine what toppings you’d like based on your previous order.


There's no limit to the number of ways you can get creative with Liquid Templates; in this article we’ll cover some example use cases and code snippets to get you started.


Rolling Expiration Date

A common frustration with triggered direct mail is the need to constantly update elements such as expiration date.  While many users want to keep an expiration date in their mailing to drive urgency, they’d prefer not to update the creative constantly to keep that expiration date at an appropriate date.  Using liquid logic, you can get around that by having the creative automatically update based on rules you set.


This is a handy way to utilize Liquid logic; no dynamic merge tag data needed. A rolling expiration date will always show a date, in the format of your choosing, that’s 30, 60, 90, etc. days to the date of print. 


The Liquid filter below creates a Unix timestamp, adds the number of seconds in 90 days and then reformats the date:


Example:

If the postcard is printed on January 1, 2020 the output will automatically

calculate and show 90 days in the future.

Code:

<div class="terms">
<p>
Offer valid before {{ "now" | date: "%s" | plus: 7776000 | date: "%b %e, %Y" }}.
Visit heypoplar.com/legal for additional terms.
</p>
</div>

Result:

Test out different date formats here...

Variable Discount

Say you want to reward customers with different offers based on how much they've spent with your business.  You don't need to segment out your customer list and create two different creatives for those groups - instead you can use liquid logic to personalize a single creative.


Variable discounts can be offered based on a customer’s purchase history, average order value, loan-to-value, etc. The example if/else statement below uses a custom merge tag to display a different offer message based on the purchase_history value that may be stored in your audience data.

Example:

A value greater than or equal to $200 for purchase_history would should read:

"In celebration of your birthday, please take 20% off your next purchase..."

A value below $200 should read:

"In celebration of your special day, take $10 off your next purchase..."


Code:

<div class="offer">
<h1>We want to say thank you for your loyalty -</h1>
<p>
{% if custom.purchase_history >= "200.00" %}
Enjoy 20% off your next purchase!
{% else %}
Here's $10 off your next purchase of $100 or more!
{% endif %}
</p>
</div>

Results:

For purchase_history equal to or greater than $200

For purchase_history less than $200

Terms & Conditions

Depending on your product, certain states may have different legal requirements for marketing and consumption. Instead of uploading separate creatives and taking the time to segment your audience by state, liquid logic can be used to dynamically show different legal text based on the recipient's location.

Below is an example of how to use the recipient.state default merge tag to determine which terms and conditions appear on the creative.

Example:

Adjusting the legal text only on mailers sent to California to be CCPA

compliant.


Code:

<div class="legal">
<p>
Offer valid for first purchase.
{% if recipient.state_name == "California" %}
Under the California Consumer Privacy Act (CCPA)...
{% else %}
Read our privacy policy at heypoplar.com/legal.
{% endif %}
</p>
</div>

Results:

For residents of California

For residents of all other states

Behavior Dependent Images

Dynamically showing a different product image based on characteristics related to the recipient’s most frequently purchased item, is another popular and effective way to utilize Liquid logic.

Below we have an example that uses a custom merge tag called item-color, and the image shown in the creative features items of a similar color to those most frequently purchased.


Example:

If a customer frequently buys red sunglasses, we want to show an image containing

mostly red sunglasses.


If a customer frequently buys blue sunglasses, we want to show an image containing

mostly blue sunglasses.


For all other customers with an unspecified preference, we want to default to showing a neutral pair of sunglasses.

Code:

<img
{% if custom.item-color == "red" %}
src="https://amazons3.com/my_images/red_sunglasses.png"
{% elsif custom.item-color == "blue" %}
src="https://amazons3.com/my_images/blue_sunglasses.png"
{% else %}
src="https://amazons3.com/my_images/mixed_sunglasses.png"
{% endif %}
>

Results:

Output for red
Output for blue
Output for all other recipients without a red or blue preference

These are only a few common examples of how liquid logic can be used, but the creative possibilities are next to endless. For more information or assistance on how to implement Liquid Template logic, reach out to support@heypoplar.com!