I’m a digital artist building a site to feature my daily art, and I’d like to implement a slightly unusual checkout process, but I’m not sure what the best approach is. I have about 12 product types that I support, ranging from T-shirts to Mugs to Blankets, and I can produce each of these products using any of my digital art designs. I post a new art design daily, and I’d like to set-up the Webflow CMS in such a way that I don’t have to manually build each of the 12 products for each design. I’d rather have the 12 generic products defined and capture the end user’s design choice when they add the product to their cart. However, a drop down list of every piece of artwork for a user to select from will quickly get unwieldy.
So my hope is that I can construct the CMS and build a site where users page through individual art designs, and each design has a generic product selector below it where users can add products featuring the design to their cart. I don’t want to take them to a product gallery of mockups using the design, I want them to simply select the product type they’d like, select any sub-variations like Size, and click Add to Cart. I can do all the work of adapting the design to the requested product and fulfilling the order, I’ve built that end of my workflow already. In Webflow, I have a Products collection built in the CMS, and I’ve begun populating an Artworks collection, but I can’t quite figure out how to integrate the two collections into a functioning “add to cart” system the way I’d like.
This is a conceptual mockup of my ideal front page, to help illustrate my goal. The critical part of the mockup that this question is about is the line under the artwork description that reads “Order ‘Firework’ as [a t-shirt] - Add to Cart”. The “[a t-shirt]” is meant to be a drop down that selects between product types like “a t-shirt”, “a mug”, or “a tapestry”. I’m not particular about the visual layout, but the functionality of quickly selecting between products while looking at a particular piece of art is the feature I’m focused on. I’d like the Add to Cart button to understand which artwork is being displayed, and include that as part of the order details. That way when someone orders a shirt, I know which design they wanted me to put on it.
I realized today that I could create a product database locally, maintain it with my own code, and upload a CSV to refresh my products listings every day when I upload new art. That’s a workable solution, but it still leaves me creating hundreds or thousands of product definitions. Is there a cleaner way to accomplish this goal where I can utilize a small number of generic products?
I guess another way to think about it would be that each Artwork could be a product, with about a dozen “Type” variants (Shirt, Mug, Blanket…), and each Type has 1 or 2 sub-variants (Size, Style). Is there a way to construct the CMS to make it easy to modify or add new products in a scheme like this? The “Size” options for a Shirt aren’t the same as the “Size” options for a blanket, can I account for this? (No one wants to order a “Queen” size Shirt, or a “Mens XL” blanket.)
I don’t need someone to build the site for me, or at least, that’s not what I’m hoping for here. I’d just like a high level overview of the best way to approach building this feature. I’m happy to do the work of implementation on my own, I just want to be pointed in the right direction before I start.
Super Streamlined Question:
If I have 12 Product Types, and 10 Designs, can I construct a CMS + Ecommerce solution to allow users to order any Product Type featuring any Design, without building 1200 product definitions? If so, is that solution flexible enough to support a new Design being added on a daily basis?
Thanks for your help!
Project URL: https://complicated-reality.webflow.io/
Read Only link: https://preview.webflow.com/preview/complicated-reality?utm_source=complicated-reality&preview=783dbcbf68740be63a5999fd913866e3&mode=preview