How to show or hide template blocks based on dynamic variables (classic editor)

read
Last updated at:

You will learn

Learn how to use the email template editor’s show/hide feature to show a particular block to certain email recipients, but not all. This feature allows you to target your email content based on information about your subscribers, so each recipient has a highly personalized marketing experience. In this article, you’ll learn how to use this feature in your own messaging. 

Are you using Klaviyo’s new template editor? Head to our new editor resource center.

Before you begin

Before you begin crafting your email, make sure you have the data you need by following the guidelines below.

Collect data

You can use show/hide conditions based on profile data in any Klaviyo email. You can use Klaviyo properties or custom profile properties; just make sure the data has been added to Klaviyo before you begin. Profile properties can be added in the following ways: 

Learn more about profile properties in Klaviyo. 

If your email is sent as part of an event-triggered flow (e.g., an abandoned cart or order confirmation flow), you can also show or hide blocks based on the details of that flow’s trigger event. So, in an abandoned cart flow with the trigger Started Checkout, you can build show/hide conditions based on a cart’s value or the specific items the customer added. Learn more about event variables.

Understand how data is stored

Before configuring your show/hide condition, check to see how your data is stored. There are five data types in Klaviyo: 

  • Text
  • Number
  • Date
  • Boolean
  • List

How your data is stored will influence which show/hide condition structures will work for you. Learn how to identify data types in your own account.

Craft your message

The first step to adding show/hide conditions in a message is to build the email template. This section will walk through a specific example, but you can follow the same steps to set any block to display based on your own criteria.

For example, if your company sells leather bags, you may collect customer preferences for how they use their bags with a signup form, as shown below. 

A Klaviyo signup form containing radio button options

You can then display a different image based on your customer’s bag preference: if the customer’s preference is “Work,” the bag will appear in an image next to a laptop. If the customer’s preference is “Outdoors,” the bag will appear near a scenic overlook on a hiking trail. 

  1. Create a campaign or flow message
  2. Add an image block
  3. Upload the work-related image to the block
  4. Click the ? icon at the top of the image block settings
  5. Turn the setting on
  6. Add this condition: person|lookup:'Bag Preference' == 'Work' 
  7. Click Save in the show/hide modal
  8. Click Save on the block

This block will show only to people who have selected “Work” as their preference. 

An image block is set to appear only to recipients who have indicated a preference for work bags

Next, add in the travel-related image to a new block under the work-related image. Follow the same steps as before, but this time, use the condition person|lookup:'Bag Preference' == 'Outdoors'

This block will only show to people who have selected “Outdoors” as their preference. 

An image block is set to appear only to recipients who have indicated a preference for outdoor bags

Finally, add in an image to appear for anyone who hasn’t selected either “Work” or “Outdoors.” Use a generic image, and this condition: person|lookup:'Bag Preference' != 'Work' and person|lookup:'Bag Preference' != 'Outdoors'

This block will show to people who have chosen something other than “Work” or “Outdoors,” or have never selected a preference. 

An image block is set to appear only to recipients who have not indicated bag style preference

Once you’ve configured each of the blocks, preview your message using three profiles. These profiles should be subscribers who meet one of each of the image criteria (i.e., Outdoors, Work, and no preference/other preference) to confirm that the correct image displays. 

You can use these steps to show or hide blocks based on any profile or event data in your account. 

Customize your show/hide conditions

Learn how to build custom show/hide conditions using the Conditional logic reference. This resource contains sample conditions, which you can customize using your own profile and event variables. Learn how to identify profile and event variables in your account below. 

Create a show/hide condition with profile data

If you are building a show/hide condition based on a profile property, replace the sample variable from the tables in the Conditional logic reference (e.g., person|lookup:'Favorite Color') with your profile property. Use the format person|lookup:'PROPERTY_NAME' and replace PROPERTY_NAME with the name of your property. 

Alternatively, use the Insert Property menu to insert a profile property to a text block. Then, copy the variable name from within the property. To identify the variable name, remove the curly brackets around the variable, as well as |default:'' at the end (if present), along with any other filters

For example, in the screenshot below, the full property is {{ person|lookup:'Accepts Marketing'|default:'' }}. The variable name is person|lookup:'Accepts Marketing', so select that portion to use in your show/hide condition. 

A sample property in the Klaviyo email editor

Create a show/hide condition with event data

You can use event data to show or hide a block if your message is part of an event-triggered flow. Only data within the trigger event can be used in a show/hide condition. 

In the preview modal, you’ll see sample event data from your most recent event. Scroll through the data to find the variable you want to use, then click that variable. Then, copy the resulting variable tag. 

Note that you don’t need the curly brackets around the variable; you only need the variable text. In the screenshot below, you’ll see the variable tag {{ event|lookup:'Item Count' }}. You’ll only need the text event|lookup:'Item Count' for your show/hide condition. 

A user locates and clicks the event property they'd like to use

Additional resources

x
Was this article helpful?
250 out of 421 found this helpful