Products and variants

3 minutes to read

Customer's Canvas contains a Product Information Management (PIM) module that helps to compose many product variants for a single product in your e-commerce store based on different product properties like size, paper stock, fold, orientation, etc.

At the moment, the product variants can only be created manually in a Customer's Canvas account. For detailed instructions, refer to our help center.

Defining product options

The first step in creating product variants is to define specific product properties that affect its appearance and price. These can be such properties as size or orientation. For example, let's consider a business card. In our store, this product may depend on two options: Size with the 3.5 x 2 and 3 x 2 values and Orientation with the Horizontal and Vertical values.

To retrieve the defined options, you can use the Storefront Products API to get options for a single product (Products_GetProductOptions) as well as for all options defined in a tenant (Products_GetAllProductOptions).

Composing product variants

Customer's Canvas generates a set of variants for every combination of product properties. In our example, the following product variants will appear:

3.5 x 2 / Vertical
3.5 x 2 / Horizontal
3 x 2 / Vertical
3 x 2 / Horizontal

The endpoint Products_GetProductLink allows you to obtain this set of variants.

Connecting designs

The main idea of generating many product variants is to provide separate design and mockup files for every set of unique product properties. You can provide designs for a product variant as well as for a regular product in your e-commerce store.

Using PIM, you connect a design to variants through the file manager by adding properties to the design.

To get a list of designs connected to variants, use the endpoint Products_GetProductVariantDesigns.

Connecting mockups

The PIM module introduces a new type of mockup - thumbnail - that displays a product on a storefront. The editor mockup and preview mockup are also supported here. When connecting mockups, you can define one PSD file for all three of the cases.

Using PIM, you also connect mockups to variants through the file manager by adding properties to the mockup.

To get a list of mockups connected to variants, use the endpoint Products_GetProductVariantMockups.

Creating links

Product links connect PIM products with storefront products. For example, for business cards, you can add the product link Regular Business Card, which includes all the values and all the options. You can also add a new product link called Vertical Business Card, where only vertical options will be available.

To retrieve the defined links, you can use the endpoint Products_GetProductLinks. To get a link by ID, use ProductReferences_GetProductLink.

Defining SKUs

A stock keeping unit (SKU) is a special product identifier that allows product variants to appear in a cart as a separate line item. Before specifying an SKU, you need to decide which options affect the price and assign one SKU for every set of such options.

In our example, the Orientation option doesn't affect the price, whereas the Size option does. In your store, add this Size option with its value and fill in the SKU for each variant.

Note that options in an e-commerce store aren't connected with the product options in your Customer's Canvas account, and you must define the same SKU in the PIM module. In our example, they may look as follows:

Size	Orientation	SKU
3.5 x 2	Vertical	001
3.5 x 2	Horizontal	001
3 x 2	Vertical	002
3 x 2	Horizontal	002

To get an SKU defined for the variants, you can call endpoints Products_GetProductVariants, Products_GetProductVariantDesigns, or Products_GetProductVariantMockups. These endpoints correspondingly return a storefrontProductVariantId field representing an SKU in ProductVariantDto ProductVariantDesignDto ProductVariantMockupDto.