- Choose "Manage Products" in "Catalog" tab.
- Click on the "Add Product"
2. Choose "Attribute Set" and "Product Type" then click on the "Continue". Make sure the Product Type is set to Simple Product.
3. Click on the "Designer" in Product Information tab.
4. Click on the "Enable" for Product Designer to enable ability to design the product online.
5. Upload thumbnail image, which will appear in the in-designer catalog.
6. Set "Resizable", "Show Ruler", "Hide Editable Area Border", "Names Enabled" .
- If "Resizable" - "yes", the product dimensions can be changed by the user. Applicable to sign-based products.
- To show ruler for product choose "yes" for "Show ruler";
- To hide editable area border choose "yes" for "Hide Editable Area Border", if "no", the printable area border will be rendered.
- To enable ability to add Names and Numbers for products like uniform, choose "yes" for "Names Enabled".
7. If you need to define one image per combination of Color and Printable Location, click on the "Add New Row".
- Choose location from list of available locations for which this color is available and choose color, then upload an image.
8. To start adding new size click on the "Add New Row".
- Enter Size Name (e.g. XL) and Size Value, which will be added to the price if the size is selected (e.g. 5).
9. To start adding Print Area click on "Add New Row". Print Area is a synonym to Location, i.e. an area of a product, which will be presented to user as customizable. Example in case of t-shirt is Front or Back or Sleeve. You can define up to 6 areas if necessary.
- Enter the name of the new print location as it would appear in designer.
- Upload image (background image) and mask (the mask image, that will be applied to the product background image).
- Enter top left X and Y, width and height of editable area (in pixels). You can also use Select Editable Area button to select area visually after main image is uploaded.
- Enter Print Area Width and Print Area Height in real units of a printable area. For example, if you are using inch units and your printable area is A4-size, enter 8.27 and 11.69 respectively.
- Enter Editable Area Range for resizable products. The values should be in the real life units you are using.
10. To start adding colorizable elements (elements of the product that can be colorized, e.g. uniform or multiple panel products.) click on the "Add New Row". Please note that colorizable elements are applicable to SVG product images only prepared according to our guideline.
- Enter Name and Id for the element.
Name would represent a name of colorizable element as it would appear in designer, e.g. "Left Sleeve";
Id should represent a CSS class of an element in SVG template and has format of ".class.fill", e.g. ".body.fill"
- To add color for colorizable element click on "Add Color". You can add multiple colors, which a colorizable element will be limited to. If you'd like to use complete list of imprint colors, leave this list empty.
- Enter Name and Value for color. The Value should represent HEX value of a color, e.g. #FF00DD;
11. To add editable area size (defines preselected possible sizes for user, works only if resizable attribute is true.) click on "Add New Row".
- Enter Label, Width and Height of editable area.
12. Click on the "Save" for saving the product.