The createDesign
method accepts different parameters depending on whether or not a design is created via a product catalog.
Create a design via the catalog-to-editor path
The catalog-to-editor path lets an integration create a design via a product catalog.
Usage
(async () => {const api = await Canva.Partnership.initialize({apiKey: "<partner_api_key>",autoAuthToken: "<auto_auth_token>",container: document.getElementById("container"),});const onBackClick = () => {// the user has clicked the "Back" button in the editor's headerconsole.log("You clicked the 'Back' button!");};const onArtworkCreate = (opts) => {// the user has finished proofing their designconsole.log(opts);};const onProductSelect = (opts) => {api.createDesign({...opts,onBackClick,onArtworkCreate,});};api.showCatalog({onProductSelect,});})();
javascript
Parameters
Create a design via the direct-to-editor path
The direct-to-editor path lets an integration create a design by directly launching the Canva editor.
Usage
(async () => {const api = await Canva.Partnership.initialize({apiKey: "<partner_api_key>",autoAuthToken: "<auto_auth_token>",});const onBackClick = () => {// the user has clicked the "Back" button in the editor's headerconsole.log("You clicked the 'Back' button!");};const onArtworkCreate = (opts) => {console.log(opts);};api.createDesign({partnerProductId: "Poster11x17",designSource: "direct",onBackClick,onArtworkCreate,});})();
javascript