How to skip lines in a dynamic table block
You will learn
Learn how to skip rows (e.g., items) in a dynamic table block. The most common use case for this is hiding irrelevant items, like shipping insurance or free gift items, from an abandoned cart email. However, you can follow these steps for any email that uses a dynamic table block.
This process involves directly editing your email’s code. This is only recommended for technically savvy marketers or those who have access to a developer. Our support team cannot help you write custom code beyond the general guidance covered in this documentation. To maintain the security of your data, Klaviyo's support team is not able to open HTML files.
Before you begin
This article covers how to hide items from existing dynamic table blocks. If you have not yet created a working dynamic table block (e.g., the products in an abandoned cart or order confirmation email), learn how to create one from scratch or start with a message in our flow library.
Write your if statements
Before making changes to your template, create 2 code snippets using a text or code editor (somewhere you can copy and paste the snippets from later). Each code snippet will consist of 3 parts:
- An opening if tag,
{% if ... %}, indicating which items should appear in your table block. - Content, like an image tag or text about the product.
- A closing tag,
{% endif %}.
Create the opening if tag
Here are some examples of opening if tags:
Tag | Meaning |
{% if item.price != 0 %} | If the item price (item.price) is anything other than 0. |
{% if item.product.name != "Route Shipping Insurance" %} | If the item name (item.product.name) is anything other than “Route Shipping Insurance.” |
{% if not "T-Shirt" in item.product.title %} | If the item’s title (item.product.title) does not contain “T-Shirt.” |
{% if item.title %} | If the item’s title (item.title) is set (i.e., has any value). |
These tags are case sensitive and must match your data exactly. For example, if the variable for your item’s price is something other than item.price (e.g., item.Price or item.details.line_price), update the code to match your data source.
Create the content for the if statement
For content, follow these steps to use the existing content from your dynamic table block. Write this code snippet in a code or text editor; you’ll add it to your template in the next section.
- Under Cell Content for the table block’s image, click Replace to view the image placeholder.
- Copy the entire code from the Dynamic variable or dynamic URL field. Note that this may be a simple dynamic variable, or it may be a longer code snippet; copy all of it, regardless of length.
- Replace the placeholder in this code snippet with the code you copied from the Dynamic variable or dynamic URL field.
<img src="PLACEHOLDER" style="width: 200px; height: auto;" width="200">If your existing table block has a simple dynamic variable for the image, the resulting content will look something like this:
<img src="{{item.product.variant.images.0.src}}" style="width: 200px; height: auto;" width="200"> If your existing table block contains a longer code snippet, the resulting content might look like this:
<img src="{% if item.product.variant.images.0.src %}{{item.product.variant.images.0.src}}{%else%}{{item.product.images.0.src|missing_product_image}}{%endif%}" style="width: 200px; height: auto;" width="200">
Add your ending tag
Then, put all the content together: your opening if statement, then your content, and finally a closing {% endif %} tag.
Repeat for the text content
Then, repeat this process with the content from the right side of your table block (e.g., the text content). Click </> to open the code editor and copy all of the HTML content, then wrap this content in the same if statement (steps 1 and 3) you used for the image content.
Here’s what everything looks like together:
Code snippet 1 (product image) | Code snippet 2 (product details) |
|
|
And here’s a breakdown of those code snippets:
Code snippet 1 (product image) | Code snippet 2 (product details) |
|
|
When using these code snippets, make sure to use straight quotes (") rather than curly quotes (“) to ensure the code renders correctly.
Once you’ve written both code snippets, continue in the template editor following the steps below.
Skip rows in a dynamic table block
Before editing your dynamic table block, consider saving the original block as universal content in case you need to reference it in future messages. Then unlink the block and edit it separately, so your edits aren’t saved to the universal content block.
- If your email is part of a flow, set it to Draft or Manual so messages don’t send while you edit the flow message.
- Make sure the Cell Content for both columns of the new table block are set to Text.
- Click </> to open the HTML editor for the left side of the table block.
- Copy the product image code snippet you created in the previous section and paste it into the HTML field.
- Click Done in the upper left.
- Navigate to the editor for the right side of the table block.
- Click </> to open the HTML editor for the right side of the table block.
- Copy the product details code snippet you created in the previous section and paste it into the HTML field, replacing all previous content.
- Click Done.
- Preview the email to ensure it appears as expected: the skipped item should not appear, but all other items will appear normally. Make sure to preview with an event that contains the item you’re trying to hide, so you can ensure it is hidden.
Conditional statements and the inline text editor
When you add certain conditional statements to a text block, they may disappear from the inline text editor. The code is still present; it is just hidden. To view and edit conditional statements, open the text block's Source code field.
The following tags are only visible in a text block's Source code field:
- {% for ... %}
- {% endfor %}
- {% if ... %}
- {% elif ... %}
- {% else %}
- {% endif %}
- {% with ... %}
- {% endwith %}
Troubleshooting
No items appear in the preview
- Make sure you are previewing with an event that matches the data source you used (e.g., Started checkout for an abandoned cart message).
- Confirm the Repeat for and Row alias exactly match the Row collection and Row alias from the original block.
The item that should be skipped is still appearing
Check the spelling and capitalization of your if statement. If the product is still appearing, that means it meets the criteria in your if statement, so your if statement is not configured correctly. Learn more about conditional logic in templates.
Outcome
After following these steps, any items that don’t meet the criteria in your if statement will not appear in messages like abandoned cart or order confirmation emails.
Additional resources
- Message personalization reference
Learn how to use Klaviyo’s personalization variables, or tags, to customize the experience for your customers.
- How to import a custom HTML template
Learn how to import a custom HTML template into Klaviyo.