After you add custom properties to the commerceItem item type, you need to provide a way for a shopper to specify the values of these properties and to split individual line items into multiple line items for customization. To provide these capabilities, you replace the Cart Summary widget on your shopping cart page with a custom widget that implements these options.

This section describes a custom widget that you could create to add these capabilities to your storefront. It assumes that you have previously created the monogram custom property shown in the Add custom properties to the commerceItem item type item type section. Note that the code in this example is for illustrative purposes only; it is not intended to be production-ready, and may not adequately handle all possible use cases or implement the exact behavior you want. In addition, you may need to customize other widgets that display order data to handle split line items and custom properties.

Also, keep in mind that when you create a dynamic property for order line items, the property is added to all line items. You may not want to expose the property in all cases. For example, your store may offer monogramming only for certain items; for other items, you do not want a personalization option to appear. You may need some additional logic in your custom widget to conditionally expose or hide personalization options, depending on the item. For example, you could expose personalization options only for certain custom product types.