Model C - Product displayed by model and storage combination
Learn how to set up a sample product data model to display the model-storage combinations of an electronic product.
After completing this page, you should be able to:
- Configure the product data model for a product listing with all its model-storage combination sets.
Our third product data model needs to meet the following requirements:
- Product listing page: display the Product by model-storage combination sets.
- Search result: display the Product by model-storage combination sets.
- Product detail page: display the color variants for each model-storage combination set.
This approach lets us display each model and color combination on the Category landing page and Search results pages.
Set up Product data model in Composable Commerce
To fulfill the requirements of setting up our product data model in Composable Commerce, we need to configure the following settings and understand the resulting impact:
- Number of Products: 13
- Number of URLs: 13
- Number of Product Variants per Product: 4 to 5
- Price display: Because the prices are same for each Product variant, we can display only one price on the Product card.
Product Type JSON
The Product Type JSON object is shown here. You can use this JSON object in your own Project to create the same Product Type.
{"name": "iphone-c","description": "iphone-c","classifier": "Complex","attributes": [{"name": "color","label": {"en-AU": "color","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": true,"type": {"name": "enum","values": [{"key": "ultramarine","label": "Ultramarine"},{"key": "teal","label": "Teal"},{"key": "pink","label": "Pink"},{"key": "white","label": "White"},{"key": "black","label": "Black"},{"key": "black-titanium","label": "Black Titanium"},{"key": "white-titanium","label": "White Titanium"},{"key": "natural-titanium","label": "Natural Titanium"},{"key": "desert-titanium","label": "Desert Titanium"}]},"attributeConstraint": "CombinationUnique","isSearchable": true,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "storage","label": {"en-AU": "storage","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": true,"type": {"name": "number"},"attributeConstraint": "SameForAll","isSearchable": true,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "display","label": {"en-AU": "Display Size","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": true,"type": {"name": "enum","values": [{"key": "6.1","label": "6.1"},{"key": "6.3","label": "6.3"},{"key": "6.7","label": "6.7"},{"key": "6.9","label": "6.9"}]},"attributeConstraint": "SameForAll","isSearchable": true,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "display-type","label": {"en-AU": "Display Type","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "enum","values": [{"key": "super-retina-xdr","label": "Super Retina XDR"}]},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "promotion","label": {"en-AU": "ProMotion technology","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "boolean"},"attributeConstraint": "SameForAll","isSearchable": true,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "always-on-display","label": {"en-AU": "Always-On Display","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "boolean"},"attributeConstraint": "SameForAll","isSearchable": true,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "processor","label": {"en-AU": "Processor","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "enum","values": [{"key": "a18","label": "A18"},{"key": "a18-pro","label": "A18 Pro"}]},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "gpu-cores","label": {"en-AU": "GPU Cores","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "number"},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "camera-control","label": {"en-AU": "Camera Control","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "boolean"},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "camera-system","label": {"en-AU": "Camera System","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "enum","values": [{"key": "advanced-dual","label": "Advanced dual"},{"key": "pro","label": "Pro"}]},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "main-camera","label": {"en-AU": "Main Camera","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "enum","values": [{"key": "48mp-fusion","label": "48MP Fusion"}]},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "telephoto","label": {"en-AU": "Telephoto","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "number"},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "megapixels","label": {"en-AU": "Megapixels","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "number"},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "emergency-sos","label": {"en-AU": "Emergency SOS","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "boolean"},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "emergency-satellite-sos","label": {"en-AU": "Emergency Satellite SOS","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "boolean"},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "video-playback","label": {"en-AU": "Video Playback","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "text"},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "usb-version","label": {"en-AU": "USB Version","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "enum","values": [{"key": "2","label": "2"},{"key": "3","label": "3"}]},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "cellular","label": {"en-AU": "Cellular","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "enum","values": [{"key": "5g","label": "5G"}]},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "model","label": {"en-AU": "Model","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "enum","values": [{"key": "base","label": "Base"},{"key": "plus","label": "Plus"},{"key": "pro","label": "Pro"},{"key": "max","label": "Max"}]},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"},{"name": "mobile-product-ref","label": {"en-AU": "mobile-product-ref","en-NZ": "","zh": ""},"inputTip": {"en-AU": "","en-NZ": "","zh": ""},"isRequired": false,"type": {"name": "set","elementType": {"name": "reference","referenceTypeId": "product"}},"attributeConstraint": "SameForAll","isSearchable": false,"inputHint": "SingleLine","displayGroup": "Other"}],"key": "iphone-c"}
iPhone 16 Product JSON example
Here's the JSON of the Product that we need to create in our module: iPhone 16 Product JSON. Now let’s check out the size of the iPhone Max product. We have chosen iPhone Max because it has more variants than the iPhone Base and iPhone Pro for this configuration.
- Total: 22.0 KB
- Per Projection (Staged and Current): 10.7 KB each
- Variants: 8.36 KB
- Attributes: 3.4 KB
- Assets: 3.3 KB
- Prices: 1.37 KB
Differences between Model B and Model C Product Types
The difference between the iphone-b and iphone-c Composable Commerce Product Types is the value of attributeConstraint for the storage attribute as shown here:
| Feature | iphone-b | iphone-c |
|---|---|---|
| Storage | attributeConstraint: "CombinationUnique" | attributeConstraint: "SameForAll" |