WPD Creating a Configuration pt 1

You are here:
Estimated reading time: 1 min

A configuration is a set of parameters that can be assigned to one or more WooCommerce products, which regulates how they work. Assigning them to a product turns the product into a customizable product.

  1. On your dashboard, click on WPD > Configurations, to access the list of existing configurations.
  2. Click on New Configuration to have access to the page on which you can create configurations. You will see the following:
      • Design from Blank: The Design from blank section can allow you to display or not the button on the product page.
      • Canvas section: The canvas section allows you to apply a custom canvas size to your product. The canvas can be smaller than the expected output files in order to fit inside the website pages but need to be a scaled version of the expected output.
      • Bounding box section: The bounding box section allows you set the bounding boxes parameters if needed. This parameter can be used to define the editable area INSIDE the canvas.
        • X: Box coordinate X on the product.
        • Y: Box coordinate Y on the product.
        • Width: Box width (mandatory for rectangles). Must be inferior to the canvas width.
        • Height: Box height (mandatory for rectangles). Must be inferior to the canvas height.
        • Radius: Box radius (mandatory for circular boxes).
        • Type: Box type (Rectangle or Circle).
        • Border color: Box border color. Leave it empty for transparent borders.
      • Parts section: The parts section allows you to define the products parts.
        • Click on the Add parts button to add your parts.
        • Name: Name of your part
        • Icon: Allows you to define an icon for the parts
        • Bg. (not inc.): allows you to define a background image for the parts. This image won’t be included in the final design.
        • Bg. (inc.): allows you to define a background image for the parts. This image will be included in the final design.
        • Overlay image: allows you to define an overlay image for the parts. This image can be selected to either be included or not in the final design.

        Below is an example of the result expected:
        View from the Dashboard

        Back end, Dashboard view

         

        Front of the shirt

        Site Front view, Front of the shirt

         

        Site Front view, Back of Tshirt

         

 

Was this article helpful?
Dislike 0
Views: 0