To set this up on your site, you'll needA Shopify account and a few items for sale. Once you've done that, you'll be ready for Step 2.
In this example, I am creating a collection called Products, with these fields:
Price (Number Field)
Brief Description (Rich Text Field)
Long Description (Rich Text Field)
Thumbnail Image (Image)
*Product ID (Plain Text Field)
*Product Component (Plain Text Field)
The Product ID and Product Component act as “unique identifiers” for your Shopify products, ensuring that Webflow retrieves the right product for each item in the collection. I'll show you how to find the Product ID and Product Component in a later step.
1. Go to the Buy Button tab and click on “Create a Buy Button”
2. Select the product you want to sell on Webflow
3. Generate the Shopify integration code
4. Copy the Product Component into the Shopify integration code
5. Paste the Product Component into the corresponding field
6. Copy the Product ID into the Shopify integration code
7. Paste the Product ID into the corresponding field
1. Add an Embed component to your collection page or list (place it where you want the buy button to be)
2. Replace the Product Component and Product ID in your Embed with your Collection fields to link each buy button to a separate product. To do this, simply highlight the values of the Product Component (it appears twice!) and Product ID, then click + Add Field to replace the content with your own values.
Your Dynamic Embed is set up, all you have to do is wait for the first sales.
