Klaviyo 'Notify When Back In Stock' Button - Change Size

[VeryCraftea]

Hi all,

I have added the Klaviyo code for the 'Notify When Back In Stock' button, but the button is a different size to other buttons. I have tried to change it, but can't get it to work

Klaviyo don't support custom themes (I'm using Pipeline) so I don't know what else to do

Any help would be greatly appreciated

Thanks!

Tas

[dmwwebartisan]

@VeryCraftea 

Please share your website URL and password if any. I will check and provide a solution here.

Thanks!

[KetanKumar]

@VeryCraftea 

sorry for this issue 

i have checked your store sorry but i can't see this button can you please show me again?

[VeryCraftea]

Ah sorry. Its an unpublished theme. Here's the link below 

https://5ip1tsqj5ku3j0qu-21023649.shopifypreview.com

(If you go to the above link and click Embroidery Kits from the Shop Crafts button and click any of the products you will see it)

[KetanKumar · Accepted solution]

@VeryCraftea 

Thanks for it

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.
this code apply for after 5 - 6 second

a.btn.klaviyo-bis-trigger {
    width: 100% !important;
    margin: 0 !important;
    margin-top: 10px !important;
    min-height: 54px;
    line-height: 15px;
    font-family: var(---font-stack-accent);
    text-transform: uppercase;
    font-weight: var(---font-weight-accent-bold);
    font-size: calc(13.1392px*var(---font-adjust-accent));
    letter-spacing: 1px;
}

[VeryCraftea]

Fantastic! Thank you so much for your help again! 

[KetanKumar]

@VeryCraftea 

it's my pleasure to help us

[Suigein]

Hi Ketan

Wondering if you might be able to help me with a similar problem with my store (product not yet published but added screenshot to show). We are trying to use the same Klaviyo 'Notify when Back in Stock' button but have 2 issues:

1. Would like the 'Notify When Back in Stock' button to left align so it is located directly underneath the 'Sold Out' button. It is currently aligning to the centre of the element. (We are using Shogun as a page builder in case this has any impact)

2. Ideally would like the 'Sold Out' button to disappear entirely and be replaced with the 'Notify Me When Available' button when stock is sold out. I have set replace_anchor: true (Per Klaviyo's instructions here) but doesn't seem to be working as you can see in the image

Thanks in advance for any help or advice you have!

[KetanKumar]

@Suigein 

sorry for this issue please share store url and product url so i will guide you

[Suigein]

Sorry, Ketan. I have tried to share the link but the theme is unpublished and I think because I am using Shogun does not have the 'Share Preview' option 😞

[KetanKumar]

@Suigein 

oh i see so how can i guide your with out checked code?

[Kamal81]

Hi @KetanKumar 

I have an issue with formating the button on my product page - it should be the same format of "Add to cart" button and I noticed one thing as well, which is the button is showing in the single variant products, how to make it show in any product with multiple variants? Plus, it keeps showing on the product page even if I changed the out of stock variant. Please advise,

 

Cheers,

Kam

[KetanKumar]

@Kamal81 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

[Kamal81]

Thanks @KetanKumar for your reply.

I'm trying it on a testing theme and just I want to send it to your email if possible because that will require some details to be exposed then we can continue discussing it here. Are you ok with that?

The main issue is that the "nofity me" button is showing in the single variant products page and it's not showing in the multi-variant products.

In multi-variant products, the button is not showing and I have to refresh the page to make the button visible

Thanks

Kamal

[KetanKumar]

@Kamal81 

sorry for that issue

but its dynamic code we're doesn't control so can you please contact Klaviyo Support team

[jachilles03]

I am also having an issue with the button.

I am using the custom location for the trigger: <a class="klaviyo-bis-trigger" href="#">Notify Me When Available</a>

But with multi variant products if you land on and in stock product and click and out of stock product the location does not go to the changed location it goes to the default Klaviyo one which is out of place

Has anyone found a solve?

[tanerozel]

Hi @KetanKumar,

I am facing the same problem with Pacific Theme.

https://sisanddot.com/products/fil-kupe

Can you please help me?