Products defined with minimum configuration




Notes
- Physical products require dimensions for shipping calculations
- See the product definition documentation
Products that are delivered digitally




Notes
- Digital products do not require dimensions
- Orders containing only digital products do not require shipping details
- See the digital attribute documentation
Products with variants selected by attributes (color, size etc)




Notes
- Product variants resolve to a single product
- See the product variants documentation
Products with restricted quantities or alternate increment steps




Notes
- Used to enforce a minimum and/or maximum quantity per order
- Steps allow for a non-standard increment/decrement amount (e.g. counting by 2 or 5)
- See the quantity attribute documentation
Products that can be customized at the point of purchase




Notes
- Available field types are Select, Radio, Checkbox, Text, Textarea, Number
- See the fields attribute documentation
Products where selections made by the customer adjust the price




Notes
- Configurable fields can adjust the price of the product
- See the fields attribute documentation
- See the delta pricing example documentation
Products can be priced in multiple currencies
Notes
- The available currencies are configured within the Admin
- See the price attribute documentation
Products where the price is calculated by a fractional unit




Notes
- Allows for the purchase of items by any non-integer values (e.g. weight or length)
- See the fields attribute documentation
- See the fractional example documentation
Products that support bulk pricing for higher volume purchases




Notes
- The unit price of the item is determined based on the product quantity
- See the product price documentation
Create alternate price lists to provide wholesale prices




Notes
- Use the promo code wholesale to activate wholesale pricing for these products
- Wholesale pricing can also be applied automatically to approved accounts
- See the price attribute documentation
Advanced targeting rules, discount codes, % and fixed discounts, buy X get Y discounts




Notes
- Buy the Phone to get 10% off other productsand a free pair of Wireless Headphones (max 6)
- Buy the Fitness Band with code FITNESSFIRST for 5% off other products and 1/2 price Covers (max 4)
- The Phone order discount supersedes the Fitness Band one
- Products discounted by the WHOLESALE code do not receive further discounts
See how easy Commerce is to work with.
Add to cart
See the Pen static.tools/commerce - Add To Cart Example by Matthew White (@statictools) on CodePen.
Basic product tile
See the Pen static.tools/commerce - Tile Example by Matthew White (@statictools) on CodePen.
In-page product configuration
See the Pen static.tools/commerce - Product Configuration Example by Matthew White (@statictools) on CodePen.
Custom Cart UI - Vanilla JavaScript
See the Pen static.tools/commerce - Vanilla JavaScript E-Commerce Example by Matthew White (@statictools) on CodePen.
Custom Cart UI - React
See the Pen static.tools/commerce - React E-Commerce Example by Matthew White (@statictools) on CodePen.
Custom Cart UI - Vue
See the Pen Vue by Matthew White (@statictools) on CodePen.