Color swatches as product options in Ecwid API

What's new

Product options will soon have "Color swatches" options. And now these are available with Ecwid API.

Changes in API

• New value for the options[] -> type field: SWATCHES. It allows product option to work as a color swatch.

• New field for option object in the options[]: useImageAsSwatchSelector. It only works with SWATCHES options.

• New fields for the option[] -> choices object: hexCodes and imageId. They allow you to define storefront display options for the swatch: swatches can either be displayed as colored circles or open a specified product image when clicked. This behavior is controlled by the useImageAsSwatchSelector field. If it's true, swatches open specific product image when clicked. If false, then the swatches are represented as colored circles using provided hexCodes) instead of the radio buttons.

"Update product" request example

The following request updates product options to a single "Color" option with "Red" and "Dark Green" choices (red color costs $10 extra):

PUT /api/v3/STOREID/products/PRODUCTID HTTP/1.1
Host: app.ecwid.com
Content-Type: application/json
Authorization: Bearer secret_token
Content-Length: 644

{
    "options": [
        {
            "type": "SWATCHES",
            "name": "Color",
            "required": true,
            "useImageAsSwatchSelector": false,
            "choices": [
                {
                    "text": "Red",
                    "priceModifierType": "ABSOLUTE",
                    "priceModifier": 10,
                    "hexCodes": [
                        "#FFA500"
                    ]
                },
                {
                    "text": "Dark Green",
                    "hexCodes": [
                        "#06402B"
                    ]
                }
            ]
        }
    ]
}

Documentation links

Find swatches and related new fields in product options.

Update product