Streaming live at 10am (PST)

[Updated] Shopify Buy Button embed code


#1

Hi everyone! :slight_smile:

It seems like Shopify has updated their Buy Button embed code. I'll be updating our help doc to reflect this, but I just wanted to give you all a quick heads up on how to fix your Webflow dynamic embed to work with the new code.

1. Copy the Buy Button code

2. Find the Product ID in your code

3. Put that product ID in your dynamic collection item

4. Paste the full code in a embed on a dynamic template page

5. Replace the product ID with a dynamic field and add a '\' in the amount

hope this helps :slight_smile:


Shopify integration with and without CMS
Shopify buy button integration - after Shopify code change
5000 character limit stops me from embedding new Shopify buy button
#2

I just did these steps, but it does not work.
No buy button is displayed on my side.


#3

Hey Guys,

I'm running into an issue where the Buy Button will not appear for me. I've tried to follow the example above, but it appears that the embed code I get from Shopify is different from this example (My code includes the product handle as an example).

Any help would be greatly appreciated.

Share link: https://preview.webflow.com/preview/basecoatnailsalon?preview=24e135153b603916fa5e48192a894fe6
Page in question: http://basecoatnailsalon.webflow.io/shop


#4

@PixelGeek I successfully corrected the ID and name fields with dynamic content, but now I'm experiencing issues with the positioning of the buttons.

The problem is that Shopify is generating it's own DIV container with a unique Class name and then placing it outside of the HTML structure that I created in Webflow.

I attempted to control this by wrapping my HTML code block with a DIV container and setting both to position relative, but Shopify is still generating it's own DIV container outside of my pre-defined DIV container. The button positions are not being controlled by a "Position" attribute, they are structurally falling outside of the HTML I defined with Webflow.

Here is a direct link to the buttons in question for your reference: http://james-titus-mckain-illustration.com/shop

Any suggestions?

Thanks,

James


#5