Repeating block w. Custom code

So I’m an email designer/developer I can perfectly code my own emails without the build-in drag & drop editor from Klaviyo.

However I still have a webshop where I want to use the data from Klaviyo and Shopify, specifically the feature where it can Repeat a block, similar to running through an array. I need it for an Order confirmation mail to loop through the products the user have chosen.

I can’t figure out the right snippet to wrap my code in to repeat my products.

This is my code i need wrapped:

<tr>
                                       <td align="left" width="120">
                                          <a href="#" target="_blank"><img src="{{ item.product.images.0.src }}" width="120" style="display: block; border: 0; width: 120px;"/></a>
                                       </td>
                                       <td align="left">
                                          <table width="100%" cellspacing="0" celppadding="0" border="0" dir="ltr">
                                             <tr>
                                                <td align="left" dir="rtl" class="break">
                                                   <table width="100%" cellspacing="0" cellpadding="0" border="0" >
                                                      <tr>
                                                         <td align="left" class="break-product" style="font-size: 16px; font-family:'gt-america-medium', Arial, Helvetica, sans-serif; line-height: 24px; color: #505340;">
                                                            <a href="#" target="_blank" style="color:#505340; text-decoration: none;">{{ item.product.title }}</a>
                                                         </td>
                                                      </tr>
                                                      <tr>
                                                         <td height="20" style="font-size: 1px; line-height: 1px; height: 20px;">&nbsp;</td>
                                                      </tr>
                                                      <tr>
                                                         <td align="left" style="font-size: 12px; font-family:'gt-pressura-regular', Arial, Helvetica, sans-serif; color: #505340;">
                                                            Size: 140ml
                                                         </td>
                                                      </tr>
                                                   </table>
                                                </td>
                                                <td align="left" width="190" dir="rtl" class="break">
                                                   <table width="100%" cellspacing="0" celppadding="0" border="0" valign="middle" dir="ltr">
                                                      <tr>
                                                         <td align="center" dir="ltr" class="break-product" style="border-top: 1px solid #505340; border-bottom: 1px solid #505340; padding: 10px 0px; font-size: 16px; font-family:'gt-pressura-regular', Arial, Helvetica, sans-serif; line-height: 24px; color: #505340;">
                                                            QTY {{ item.quantity }}
                                                         </td>
                                                         <td align="right" dir="ltr" class="break-product" style="font-size: 16px; font-family:'gt-america-medium', Arial, Helvetica, sans-serif; line-height: 24px; color: #505340; padding: 5px 25px 5px 0px;">
                                                            DKK {{ item.price }}
                                                         </td>
                                                      </tr>
                                                   </table>
                                                </td>
                                             </tr>
                                          </table>
                                       </td>
                                    </tr>

Is there a friendly soul out there who knows how to handle this?

Page 1 / 1

Hello @Filske,

Thanks for sharing your question with the Klaviyo Community!

Klaviyo’s block repeat function is just a simplified way of implementing conditions through Klaviyo’s drag-and-drop editor. For example, you can use a for loop to iterate through and display the product titles to accomplish the same outcome of Klaviyo’s repeat function: {% for item in event.extra.line_items %} {{ item.product.title }} {% endfor %}

You can use any sort of condition you would want based on how you are building your email.

I hope this helps!

David

Hello @Filske,

Thanks for sharing your question with the Klaviyo Community!

You can use any sort of condition you would want based on how you are building your email.

I hope this helps!

David

Hi @david.to thank you for commenting on this thread:)
I read the documentation through and what I didn’t understand is how to do this outside of the drag-and-drop editor. In this tutorial they’re sort of creating their own variables as I understand it. This example you’ve sent me here would that work straight in the code out of the box if I didn’t create it in the drag-and-drop editor?(hope my question makes sense)

Hey @Filske,

The variables highlighted within the Repeating a Block Based on Dynamic Data article I hyperlinked in my previous comment are not self-created; but are rather referenced based on the event/metric that is meant to trigger the flow which your email is housed in. The use of a For Loop built using HTML would in essence be the exact same functionality as Klaviyo’s repeat block function. Therefore, Klaviyo’s repeat block function is replaceable with using a For Loop to enact the same functions in a custom coded HTML template.

The HTML code example provided is a working code so long as the variables being defined align with your store’s and the flow’s setup.

For further assistance in troubleshooting an HTML template, I would recommend reaching out and finding a Klaviyo partner who can provide a custom solution to for you.

Have a great day!

David

Is there a way to check if this is the last iteration? I am asking because for building dynamic carts you have to put a “,” between those numbers except for the last one

Hi @Hana89,

Thanks for your question!

Do you mean to ask if the code the original user posted is the last iteration? However, I do think it’s worth noting the documentation that David shared above as an option for implementing this. The code shared in our documentation is a working code, so you would need to ensure the variables the example code and your code have are the same or plug and play depending on your store and the flow’s setup.

If you’re having trouble w the custom coding, I know one of our awesome Klaviyo partners would love to provide help setting this up!

-Taylor

Hi,

I’m having the same issue, I’m trying to pull the products images in a loop but can’t seem to find a way to write the correct code for it. Every code I find specifies the product image in particular but in a loop it needs to be generic so it dynamically pulls the images in order.

Here’s a link to the flow i’m working on, you’ll see the placeholder images i’m adding but I don’t know how to show the correct images in order.

https://www.klaviyo.com/flow/message/Sm58vD/content/edit

Reply

Sign up

Use your Klaviyo credentials

Log in to the Community

Use your Klaviyo credentials

Scanning file for viruses.

This file cannot be downloaded