Hi Alex, thanks for all the great tip & tricks you’ve been providing us all with. I look forward to enjoying your “Webflow to Shopify full export” tutorial.
Meanwhile, just wanted to ask you one thing on this subject. How would you go about creating variable products using Webflow CMS?
I mean, let’s say we have the following standard scenario:
Product (e.g. XYZ)
Collection: (e.g. Fall / Winter 2016)
Color: White
Size: Small
etc.
On Webflow’s CMS I’d just create the following collection pages:
COLLECTIONS
(e.g. Fall / Winter 2016; Spring / Summer 2016, etc.)
PRODUCTS
A collection of all the single products on sale.
The Products collection would then contain a single reference field which I’d use to reference each single product back to a given Collection (e.g. Product XYZ from Fall / Winter 2016 Collection ).
Assuming the above is correct (or maybe it is not - if so please let me know), how should I go about adding the “Color” and “Sizes” fields to the Product collection?
I’m under the impression the best would be for me to create further two collections as follows:
COLORS
SIZES
Then I’d go back to my PRODUCTS COLLECTION and reference each product back to these two newly created collections using the following fields (i.e. on the single Product page within the Product Collection):
Color
Type of field: Single Reference (assuming shoes XYZ would only have one main color)
Size
Type of field: Multi-Reference (assuming shoes XYZ would come in 4 different sizes)
If your product variants are simple things like size then you can think about using the category field. This way you don’t have to create a new collection.
For your images you can create a image field in the products collection to upload product images.
On using the “Category” field for sizes, what field within a Collection page are you exactly referring to? I can see “Plain Text, Rich Text, Image …, Switch, etc.” but no such “Category” field…
Also, how would you add ALL sizes (e.g. Small, Medium, etc.) within that “Category” field when creating single Product pages?
Now we are left with one - very last - question answered: I did as you suggested and created a Size field using the Option field. I then went on adding four sizes to the list to select from.
As expected, when you then create a, say, single product page within that collection you can only choose ONE size at a time… while most of the time I’d obviously need to select all of them.
If you have one product that comes in multiple sizes and want to display all available sizes on one product page then using a collection to create all of the sizes it your best bet.
In the products collection you would use a multi-reference field the connects the size collection to the products collection. The multi-reference field allows you to choose multiple sizes from the size collection.
On the product page you would use a dynamic list to display the sizes on the page. You would then use the filter settings to only show sizes that are connected to the product.