Resize designs with Magic Resize

This feature is in a closed, invite-only beta.

Canva has a Magic Resize feature that intelligently resizes a user’s design during the proofing process. By enabling this feature, partners can upsell or cross-sell products to their customers.

This page explains how to enable the Magic Resize feature.

Step 1: Provide Canva with a list of products and dimensions

You can’t enable the Magic Resize feature via the API. You need to create a support ticket and request that Canva enables the feature.

To file a request:

  1. Navigate to the Canva Helpdesk.

  2. Select Integration support.

  3. Fill out the required fields.

  4. Provide a list of products that should support Magic Resize and the dimensions that each product can support. Products can support multiple sets of dimensions.

Step 2: Use the onMultiArtworkCreate callback

Pass the onMultiArtworkCreate callback into the createDesign and editDesign methods:

(async () => {
const onMultiArtworkCreate = (opts) => {
console.log(opts);
};
const onProductSelect = (opts) => {
api.createDesign({
...opts,
onMultiArtworkCreate,
});
};
api.showCatalog({
onProductSelect,
});
})();

During the proofing process, users can select one or more products with the configured dimensions.

After the proofing process, Canva:

  1. Generates a separate artwork for the following:

    • The product that the user originally selected when creating the design.

    • Each additional product with the resized design that the user selected in the proofing process.

  2. Passes information about these artworks into the onMultiArtworkCreate callback.

You can access the information about these artworks via the opts.artworks parameter:

const onMultiArtworkCreate = (opts) => {
opts.artworks.forEach((artwork) => {
console.log(artwork);
});
};

Canva doesn’t impose any restrictions on how an integration uses this information, but some common use-cases include:

  • Showing the customer a preview of the artworks in different sizes.

  • Allowing the customer to edit one of the resized designs.

Notes

  • If you try to use the onMultiArtworkCreate and onArtworkCreate callbacks at the same time, an error appears in the JavaScript Console.

  • If you use the onArtworkCreate callback while the Magic Resize feature is enabled, a warning appears in the JavaScript Console and Canva only generates an artwork for the user’s design in its original dimensions.