onProductSelect

Registers a callback that runs when a user selects a product via the product catalog.
(async () => {
const api = await Canva.Partnership.initialize({
apiKey: "<partner_api_key>",
autoAuthToken: "<auto_auth_token>",
container: document.getElementById("container"),
});
const onProductSelect = (opts) => {
// the user has selected a product via the catalog
console.log(opts);
};
api.showCatalog({
onProductSelect,
});
})();
javascript
ParameterTypeRequiredVolatileDescription
optsobjectYesN/AOptions for configuring the editor.
opts.analyticsCorrelationIdstringYesYesThe ID to track user interactions with a design.
opts.designSourcestringYesYesWhether a design is created via a product catalog or by directly launching the Canva editor.
opts.partnerProductIdstringYesNoThe 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.productIdstringYesYesThe ID of a type of partner's product. Some examples are "posters" and "cards".
opts.productSizeOptionIdstringYesYesThe ID of the partner's product size option.
opts.maxPagesnumberYesNoThe maximum number of pages a user can print. The default value is 2.
opts.minPagesnumberYesNoThe minimum number of pages a user can print. The default value is 1.
opts.templatestringNoYesThe ID of a template.