This is an old documentation. Go to the latest Customer's Canvas docs

addSurface Method


  • Adds the given surface (page) to the product.

    // Let us add a back side to the postcard.
        // When we get the product.
        .then(function(product) {
            // If postcard has no back side.
            if (product.surfaces.length < 2) {
                   // Adding the back to the loaded product.
                return product.addSurface(
                        // Defining the template file.
                        printAreas: [{ designFile: "postcard_side2"}]
                    // If the back side is added to the postcard.
                    .then(function(newProduct) {
                        // Replace the loaded product with the new one.
                        product = newProduct;
        // If there was an error while getting the product or adding a back side to the postcard.
        .catch(function (error) {
            console.error("Adding surface failed with exception: ", error);


    • surface: SurfaceTypes | IStateSurface

      A surface (page) to add.

    • Optional position: number

      A position in the surface array where the new surface (page) should be added. The index of the first surface is 0. By default, this method adds pages to the end of the surface array.

    Returns Promise < Product >

    The product instance where the surface (page) was added.