Klaviyo Back In Stock Button - Taiga Theme

Klaviyo Back In Stock Button - Taiga Theme

Westy6711
Visitor
1 0 0

Hi there, I am trying to add the Klaviyo Back In stock button to the Taiga theme. (It blows my mind that it is out of the box only compatible with a few themes). I want this option to show when a product variant is out of stock. I want them to be able to input their email, get added to the Klaviyo back in stock flow and also have the option to sign up to emails using the Klaviyo tick box and get added to my main mailing list.

 

I have tried to edit the code for my theme to get this to trigger. I have tried adding it in the theme.liquid and to the product-template.liquid, at different times to test. But it just will not show on the product when a variant is sold out. 

 

The code saves fine, I get zero errors and as far as I can see it 'should' work. But I just cannot get it over the line. All Klaviyo sync and integration is fine, has been set up a long time. I have pasted the code I am using below. (I have removed the public API and added Public_API, and removed my list name and added MY_LIST_ID, but these are both in there during testing).

 

I have tried this with different alternate anchors, to no avail. 

 

I am assuming I am missing something obvious, but I have zero clue what. Can anyone help? I thought this would be really simple. 

 

<script src="https://a.klaviyo.com/media/js/onsite/onsite.js"></script>
<script>
var klaviyo = klaviyo || [];
klaviyo.init({
account: "Public_API",
list: "MY_LIST_ID",
platform: "shopify"
});
klaviyo.enable("backinstock",{
trigger: {
product_page_text: "Notify Me When Available",
product_page_class: "btn",
product_page_text_align: "center",
product_page_margin: "0px",
alternate_anchor: "Sold out",
replace_anchor: true
},
modal: {
headline: "{product_name}",
body_content: "Register to receive a notification when this item comes back in stock.",
email_field_label: "Email",
button_label: "Notify me when available",
subscription_success_label: "You're in! We'll let you know when it's back.",
footer_content: '',
additional_styles: "Avenir Next Rounded STD",
drop_background_color: "#000",
background_color: "#fff",
text_color: "#222",
button_text_color: "#fff",
button_background_color: "#439fdb",
close_button_color: "#ccc",
error_background_color: "#fcd6d7",
error_text_color: "#C72E2F",
success_background_color: "#d3efcd",
success_text_color: "#1B9500"
}
});
</script>

Replies 0 (0)