Support for Custom-created or personalized products

[cquinders]

Description

I’m building a shop with Craft Commerce v2 where customers will be able to customize/personalize parts of clothes based on a predefined set of options.

Let me illustrate my product setting with a pullover: a pullover consists of individual “body”, “sleeves” and “cuffs” products in this shop. Customers are able to customize their pullover by choosing their combination of 17 “body” designs, 17 “sleeves” designs and 6 “cuffs” designs (each design in various sizes).

Since the different patterns/parts that create a piece of clothing are preproduced, I would set them up as individual products (i.e.: “pullover body”, “pullover sleeves”, “pullover cuffs”) with variants for colors, sizes, etc. and stock management.

Now it would be great if I could create some sort of “composite product” that would be configured with a variant selection field for “body”, “sleeves“ and ”cuffs”. Each of these variant selection fields would have their own set of rules for which products/variants are selectable in this field.

Woo Commerce does have a similar plugin for example: Have a look at Composite Products Plugin for further reference and more use cases.

I think “composite products” would be a nice addition to Craft Commerce and boost its flexibility even further and make it the perfect fit for selling customized/personalized products.

[lukeholder]

Great Idea.

[oadslug]

I second this.

As a stop gap measure we are currently using hidden line item 'options' field(s) to manage this with groupId and parentId. As the primary product is customized, additional purchasable lineItems are added to the order. And when displaying the order, lineItems are grouped by groupID, so it feels like a single item to the user. Additional tags are used (i.e. 'js-match-qty') to keep quantities in synch via js, etc. Although a bit complex, works very well.

{# Generate a unique lineitem group id to keep items together -#}
{% set lineItemGroupId = cart.lineItems|length + 1 %}

{# primary variant -#}
<input type="hidden" name="purchasables[0][id]" value="{{ variant.id }}">
<input type="hidden" name="purchasables[0][note]" value="">
<input type="hidden" name="purchasables[0][qty]" value="1" class="js-match-qty">
<input type="hidden" name="purchasables[0][options][groupId]" value="{{ lineItemGroupId }}">

{# imprinting variant -#}
{% if imprintingVariant is defined and imprintingVariant|length %}
    <input type="hidden" name="purchasables[1][id]" value="{{ imprintingVariant.id }}">
    <input type="hidden" name="purchasables[1][note]" value="">
    <input type="hidden" name="purchasables[1][qty]" value="1" class="js-match-qty">

    {# properties -#}
    <input type="hidden" name="purchasables[1][options][parentId]" value="{{ lineItemGroupId }}">
    <input type="hidden" name="purchasables[1][options][useParentQty]" value="1">

    {# save option on parent -#}
    <input type="hidden" name="purchasables[0][options][imprintingSku]" value="{{ imprintingVariant.sku }}">

{% endif %}

[maxwellhibbert]

@oadslug any chance you could share a basic working demo?

[lukeholder]

Related #260