applyProductTheme Method

Callable

• applyProductTheme(theme: string | IProductThemeConfig ) : Promise < void >

• Applies a color theme to the product. For details, see the Product Themes topic.

  example

  // Define a color theme.
  var productTheme = {
      "violet": {
          "C01": "rgb(102,45,145)",
          "C02": "rgb(150,67,214)",
          "C03": "rgb(190,107,255)",
          "C04": "rgb(32,18,77)"
      }
  };
  
  // Enable the violet theme.
  CustomersCanvas.IframeApi.loadEditor(iframe, productDefinition,
      { productThemes: productTheme, defaultProductTheme: "violet" })
      // If the editor has been successfully loaded.
      .then(function (editor) {
          // Change the color theme.
          editor.applyProductTheme({
              "C01": "rgb(241,160,175)",
              "C02": "rgb(255,200,214)",
              "C03": "rgb(255,255,255)",
              "C04": "rgb(224,102,102)"
          });
      })
      // If there was an error thrown when loading the editor.
      .catch(function (error) {
          console.error("The editor failed to load with an exception: ", error);
      });
  

  Parameters

  • theme: string | IProductThemeConfig

    A name of a color theme defined for the current product or through the clientConfig.json file.

  Returns Promise < void >