Hi all,
I am trying to create a new abandoned cart flow in the new editor. I figured out how to link the image with the title, quantity and price. But the title and the image are not linked.
Does anybody know what I am doing wrong?
Thank you in advance!
Best answer by David To
View original
+60
Hello
Welcome to the Klaviyo Community!
I would suggest double checking and making sure you’re using the correct variables as the link to your product title and product image. In my experience, using a {{ item.url }} as a variable is common if you’re using a WooCommerce integration, but not Shopify. Assuming you’re on Shopify - based on the tag you used for this post. Typically, a standard Shopify Checkout Started event won’t actually pass a URL linking back to the individual product. Instead, you’ll typically need to recreate the product URL using something such as {{ organization.url }}products/{{ item.product.handle }}.
Although it’s listed in our How to build dynamic blocks in a flow email Help Center article pertaining to our classic editor, it does provide a great resource on understanding the variables you’ll want to use when linking back to your product page. As highlighted in the Step 8 (Optional): Link to the product page subsection of that article:
| Event Variable | Final Tag | |
| BigCommerce | {{ event.extra.items.0.product.url }} | {{ organization.url }}{{ item.product.url }} |
| Magento 1 | {{ event.extra.line_items.0.product.key }} | {{ organization.url }}{{ item.product.key }} |
| Magento 2 | {{ event.Items.0.Product.FullURL }} | {{ item.Product.FullURL }} |
| Shopify | {{ event.extra.line_items.0.product.handle }} | {{ organization.url }}products/{{ item.product.handle }} |
| WooCommerce | {{ event.extra.Items.0.URL }} | {{ item.URL } |
I hope this helps!
David
Hi
Thank you so much. It worked! only had to add one more / before “products”. Do you also know what to use instead of {{ item.title }} to link the title of the product to the productpage?
Kind regards
Sem
+60
Hey
You mean for your product title? If the previously provided variable works, i don’t see why you wouldn’t be able to use the same one!
David
Hi
Thanks! I've already fixed it :)
Hi
Thank you so much. It worked! only had to add one more / before “products”. Do you also know what to use instead of {{ item.title }} to link the title of the product to the productpage?
Kind regards
Sem
Hey Sem,
Would you mind sharing where exactly you put the forward slash? Here’s a screenshot of my code and the forward slash being put in line 4 before the code “ products/ “
I also want to note that my Organization address in my Klaviyo account is “https://bitstackd.com/” with the extra forward slash at the end. I saw someone on twitter mention this (https://twitter.com/zachmstuck/status/1243578564240424971?lang=en), and said this might be the problem. Having done both those things, it still doesn’t solve the problem for me
Thanks for helping out! I appreciate it!
Usman
<div>
<div style="text-align: center;"><span style="font-family: Inter, Verdana, Geneva, sans-serif; font-size: 16px; color: #1a2238; font-weight: bold;"><img src="{{ organization.url }}/products/{{ item.product.handle }}" alt="" width="250" /></span></div>
<div style="text-align: center;"> </div>
<div style="text-align: center;"><span style="font-family: Inter, Verdana, Geneva, sans-serif; font-size: 16px; color: #1a2238; font-weight: bold;">{{ item.product.title }}</span></div>
<div style="text-align: center;"><span style="font-family: Inter, Verdana, Geneva, sans-serif; font-size: 16px; color: #1a2238;">{% currency_format item.line_price %}</span></div>
<div style="text-align: left;">
<div style="text-align: center;"><span style="font-family: Inter, Verdana, Geneva, sans-serif; font-size: 16px; color: #1a2238;">Quantity: x{{ item.quantity|floatformat:0 }}</span></div>
</div>
</div>
Hi
Thanks for reaching out. When I click on your twitter link I see that they are adding the / in the website url. You can find that in Setup Wizard. In the colum below we use this line:
{{ organization.url }}/products/{{ item.product.handle }}
I see that you are still in the old klaviyo editor. We are using the new template since 2 months and we are loving it!
So it looks like the screenshots below. I hope this will help you out.
+60
Hey
I think
David
Hey
I am using the new editor, but just to grab the screenshot I went into the html editor. I’ve tried both ways (adding a forward slash in my organization name and changing from https:// to https://www.organizationame.com, AND also putting a forward slash as shown by Sem above, but to no avail.
I still cannot link the product images to their respective product pages on my website. If you have any more suggestions, I’d be happy to try out! Btw, is my code wrong by any chance (I know even a missing semi-colon can cause issues, so just curious)!
Thank you again!
Usman
+60
Hey
Sounds like you may have been doing one too many things. The {{ organization.url }} variable will pull in the exact URL as defined under your account’s organization settings. This means that if your website URL under your account’s organization settings already includes a forward slash so it reads something like website.com/, then you wouldn’t need to manually add one into your dynamic table block when creating your hyperlinks.
Another option available to you would be instead of using the {{ organization.url }} variable, you can manually define your website url when creating your hyperlinks. For example, instead of using {{ organization.url }}products/{{ item.product.handle }} as your hyperlink you can use something like YourWebsite.com/products/{{ item.product.handle }}.
If you’ve gone ahead and tried even the manual method, and is still not working, then this means there may be other factors causing your issue. In my experience, the most likely cause is that you may have created/coded the dynamic table block incorrectly. I would also ensure that there isn’t anything going on with your website and product pages. In small cases, I’ve seen that due to some website errors and/or personalized website structures, the default link structure we suggest does not align to what your website is using.
If you’re still having troubles, I would suggest reaching out and speaking with some of our wonderful Support colleagues who can take a closer look at your setup.
David
Enter your username or e-mail address. We'll send you an e-mail with instructions to reset your password.