onProductSelect
Registers a callback that runs when a user selects a product via the product catalog.

Usage

1
(async () => {
2
const api = await Canva.Partnership.initialize({
3
apiKey: "<partner_api_key>",
4
autoAuthToken: "<auto_auth_token>",
5
container: document.getElementById("container"),
6
});
7
8
const onProductSelect = (opts) => {
9
// the user has selected a product via the catalog
10
console.log(opts);
11
};
12
13
api.showCatalog({
14
onProductSelect,
15
});
16
})();
Copied!
You don't need to directly access the properties in the opts object. You only need to pass them straight into the createDesign method.

Parameters

To understand the meaning of the Volatile column, see the definition of Volatile parameters in the Glossary.
Parameter
Type
Required
Volatile
Description
opts
object
Yes
N/A
Options for configuring the editor.
opts.analyticsCorrelationId
string
Yes
Yes
The ID to track user interactions with a design.
opts.designSource
string
Yes
Yes
opts.partnerProductId
string
Yes
No
The ID of a partner's product. Some examples are "Poster11x17in" and "Banner96x24in". A partner product ID determines the dimensions, the templates, the furniture (if applicable), and the export settings to apply for a design. A partner may provide a partner product ID to Canva beforehand. This may match with a product ID in a partner’s back-end, such as SKU or internal system identifier. If partner doesn’t provide a partner product ID, Canva assigns one for each product.
opts.productId
string
Yes
Yes
The ID of a type of partner's product. Some examples are "posters" and "cards".
opts.productSizeOptionId
string
Yes
Yes
The ID of the partner's product size option.
opts.maxPages
number
Yes
No
The maximum number of pages a user can print.
opts.minPages
number
Yes
No
The minimum number of pages a user can print.
opts.template
string
No
Yes
The ID of a template.
Last modified 1mo ago
Export as PDF
Copy link