Klaviyo's Back in Stock feature is great—until it isn't. If you’ve ever struggled with the “Join the Waitlist” button not replacing your sold-out button, or the popup button looking totally off-brand, you’re not alone.
In this post, I’ll walk you through a tested, copy-paste setup that fixes the most common issues and makes your Back in Stock (BIS) feature work beautifully on Shopify—including matching your store's design.
Paste the code below into your Shopify theme. Place it just above the </body>
tag in theme.liquid
.
<script src="https://a.klaviyo.com/media/js/onsite/onsite.js"></script>
<script>
var klaviyo = klaviyo || [];
klaviyo.init({
account: "YOUR_PUBLIC_API_KEY", // ✅ Replace with your Klaviyo public API key
platform: "shopify",
list: "YOUR_LIST_ID" // ✅ Replace with your Klaviyo list ID
});
klaviyo.enable("backinstock", {
trigger: {
product_page_text: "JOIN THE WAITLIST", // ✅ Change this text if needed
product_page_class: "button", // ✅ Replace with your theme's active button class (used when product is in stock)
product_page_text_align: "center",
product_page_margin: "0px",
replace_anchor: true
},
modal: {
headline: "{product_name}",
body_content: "We'll email you as soon as this item comes back in stock.",
email_field_label: "Email",
button_label: "JOIN THE WAITLIST",
subscription_success_label: "You're in! We'll email you when it's back.",
footer_content: '',
font_family: '"Avenir Next", sans-serif;', // ✅ Update to match your store font
drop_background_color: "#000",
background_color: "#fff",
text_color: "#222",
button_text_color: "#fff",
button_background_color: "#F45024", // ✅ Update to your theme's button color
close_button_color: "#ccc",
error_background_color: "#fcd6d7",
error_text_color: "#C72E2F",
success_background_color: "#F45024", // ✅ Update to match success state brand color
success_text_color: "#fff",
additional_styles: ".btn-success { border-radius: 100px !important; font-family: inherit !important; }" // ✅ Customize button shape and font
}
});
</script>
body_content
, button_label
, and subscription_success_label
button_background_color
, success_background_color
).klaviyo-bis-trigger
class.btn-success
via additional_styles
additional_styles
to round the modal buttonI work with Shopify brands every week to set up email flows and implement custom Klaviyo features like this one. Join me at The Social Sales Girls where I coach and teach email marketing strategies.