The thing you sell, with what all its versions share (title, description, photos, vendor), while each version the customer can buy is a variant with its own price, SKU and stock.
In Shopify, a product is the item as the customer thinks of it: “Linen shirt”. It holds what every version of it has in common:
- the title and the description;
- the media: photos, videos, 3D models;
- the vendor, the product type, the category and the tags;
- its options, such as Color and Size, and the variants they make;
- its status (Active, Draft or Archived) and the sales channels it is published to.
What the customer actually buys is not the product but one of its variants: the Sand shirt in size M. That is where the price, the SKU, the stock and the weight live. A product without options still has one variant, which Shopify keeps out of sight and calls “Default Title”.
In Webflow terms
In Webflow, a product page is a CMS item. In Shopify, a product is a record with variants, stock and prices that change every day. With Smootify the two meet: the Shopify product is synced to an item of your Products collection, which gives Webflow its page, its slug and its SEO fields, and on the page Smootify loads the live product from Shopify, so prices and stock are always the current ones.
In Smootify
smootify-product holds one product, and every element inside it reads that product: product="title", smootify-price, the pickers, the add-to-cart form. On the template page of the Products collection, its data-id is bound to the Shopify ID field.
More in The product page and CMS collections and sync.