How can I manually load a dynamic checkout button with JavaScript?

xSketchy0
Shopify Partner
7 0 1

Hey,

I'm working on a theme with a transitions manager called Highway.JS. This means no page reloading, which also means no reloading of the product page which renders the dynamic checkout button. My question is if there's any way to load the dynamic checkout button through JS, so I can include that in my own javascript to render it manually instead of Shopify rendering it itself through a page load.

Thank you!

Replies 4 (4)

haroldao
Shopify Partner
13 0 0

Yes. Use 

Shopify.PaymentButton.init()

 

Always Be Creative.
xSketchy0
Shopify Partner
7 0 1

Thank you!

Haven't tried it out yet, but I'm wondering how you found out?

haroldao
Shopify Partner
13 0 0

I was also looking for a solution (that’s how I found your thread) because I was using BarbaJS, and I finally found by checking the Shopify object in the console 🤓.

Always Be Creative.
xSketchy0
Shopify Partner
7 0 1

Almost a year later and now I finally had some time to check it out! Whenever I run Shopify.PaymentButton.init(), the button renders disabled and there are no event handlers to navigate to the payment screen. Any way to fix this?