Can someone help set up Klaviyo Back in Stock alert button to match add to cart button?

Store Design
, ,

Topic summary

A user needed help styling a Klaviyo Back in Stock alert button to match their Add to Cart button on the District theme. Specifically, they wanted the alert button to have a white background with blue outline and blue text, matching the existing Add to Cart styling.

Solution provided:

  • Edit the theme.liquid file
  • Add custom CSS code below the <head> tag
  • Initial code caused the button to appear on all variants, including those with inventory
  • A revised code snippet fixed the issue, displaying the styled button only for sold-out variants

Outcome: The problem was resolved successfully with the corrected code implementation.

Summarized with AI on November 9. AI used: claude-sonnet-4-5-20250929.
1

I’m using the District Theme - and currently we have a Back in Stock alert setup so when an item is out of stock - the Add to Cart button turns into a Klayvio Back in Stock Alert.

Can anyone help me figure out which code to edit to make this occur, the klaviyo directions don’t have support for this theme.

Picture 1 is when Inventory is available, picture 2 is when inventory is not available - it is a working button, I just want it to match the Add to Cart, or even like.. a white button with a blue outline, and then text in blue.

thanks in advance!

When Inventory is available
When Inventory is available513×464 11.9 KB

When inventory is sold out
When inventory is sold out538×440 13.2 KB

2

Hey @jameyporter ,

Can you share the link to your store please? Thanks!

3

www.twocrowcollective.com

4

Hey @jameyporter ,

Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1716436632860.jpeg
ThePrimeWeb_0-1716436632860.jpeg1253×933 87.9 KB

5

While this did work for those variants that were sold out - it added that same button to all variants even ones that have inventory

jameyporter_0-1716479905819.png
jameyporter_0-1716479905819.png1349×703 133 KB

6

Replace the code with this one @jameyporter ,
7

That worked! Thank you @ThePrimeWeb !