user manual table of contents - appjetty€¦ · user manual – advance product designer 5...

USER MANUAL

Magento 1

Advance Product Designer

Version: 1.0.1

Compatibility:

Magento Community Edition1.7.*.* to 1.9.*.*

TABLE OF CONTENTS

Introduction .................................................... 1

Benefits of Advance Product Designer ........... 1

Extension Activation ....................................... 2

How it Works? ................................................ 3

Back End Configuration: ............................. 3

Points to Note: .............................................. 27

Contact Us .................................................... 27

USER MANUAL – Advance Product Designer

www.appjetty.com 1

Introduction The “Advance Product Designer Web-to-print M1 Extension” will assists you to implement “Web-to-print Extension” on your store and can also help you building your own store with “Web-to-print Extension” which in turn will allow your customers to give a personalized touch to your products using text, image, clip arts and effects.

Advance Product Designer provides an online Web-to-print Extension for your Magento E-Commerce store. Just imagine, your Magento store has a charismatic design gizmo which lets your customers, give a personal touch to the products prior to acquisition. You don’t even need to know something backwards and forwards of coding. It merely gets fit into your store and permits your customers to play with the tool. That’s why it makes the shopper blissful, satisfied and convinced with fewer efforts.

“Advance Product Designer” aims at endowing your Magento E-Commerce store with an advanced designing tool. It allows your customers to pour their ideas and customize products of their choice. The products can be T-shirts, Mugs, Covers of Mobile and Laptop, Business card, Greeting Cards, Posters, upholstery and the list is endless!

Benefits of Advance Product Designer

Advance Product Designer is the most complete Magento extension for designing products

Useful for printing vendors who want to sell their products online

Useful for online stores trying to sell customizable products

Responsive & Feature Rich Designer Tool

Support for Multiple Printing Methods

Get Final Orders in Various Order Formats

More than 10000 Free inbuilt Cliparts in Clip Art Library

Directly Share Products to Social Media Platforms and get designs from them as well

Import and Export design templates from one store to another store


www.appjetty.com 2

Extension Activation

Step1: Get an activation key

Copy the activation key from the Order Confirmation Mail. OR Login into your account at website using the e-mail and password that you provided at checkout process. Go to Downloadable Options and copy the activation key for the Advanced Product Designer.

Step2: Activate your extensions

Log into Magento Admin Panel and go to System → Configurations→ Biztech Extensions / Product Designer Activation and enter the activation key in the ''Activation Key'' field for the Product Designer extension then click the “Save Config”


www.appjetty.com 3

How it Works?

Back End Configuration:

Please follow the below steps to configureAdvanced Product Designerextension. After configuring the extension follow below steps to create your first template for the store.

Step 1:General Product Configurations

For configuring basic configurations for Advance Product Designer go to System→ Configurations → Biztech. General Configurations

Enable: Select “Yes” to enable the extension on your store.

Enable “Design button”: Select “Yes” to display “Design it” button the Category page below the

products.

Disable “Add to Cart” button on Category page: Select “Yes” if you would not like to show “Add to

Cart” button below the products on Category page.

Fixed Price to be added for Designed Products: Enter the price you would like to charge to your

customers for designing the products.

Price per Image: Enter the price you would like to charge for each image added by the customers.

Price per Text: Enter the price you would like to charge for each text box added by the customers.

Price per custom uploaded image: Enter the price to be charged extra for any custom image

uploaded by the customer.

Image width, px: Enter the width of the image in pixels.

Image height, px: Enter the height of the image in pixels.

Page Title: Enter the text with which you want to entitle the page.

Download image type: Select the format/file type of the image for download.

How many days after unused designs images need to removed?: Add number of days after unused

design images will be removed.


www.appjetty.com 4

Front end Theme Configuration

From theme configuration admin will be able to set Primary Color, Secondary color and also enable

SVG Support for your product designer.

Category Products Configuration

Enable Category Products: Select “Yes” to enable the extension for Category products.

Set default category: Select the default category for using the extension.


www.appjetty.com 5

Download Design from Designer Page Configurations

Download Design from Designer page: Select “Yes” to permit your customers to download their

designs.

Watermark: Browse the image file and upload that you would like to display as watermark when your

customers download their saved designs.

Text for Watermark Image: Please add maximum 8 character text to create watermark png image.If

larger text is added it will not be fully displayed.

My Design Configuration

Show My designs at front end: Select “Yes” to allow your customers to view their saved designs

under “My Designs” tab at front end.


www.appjetty.com 6

View Configuration

Select View: Choose the view for displaying product designer tool on your website. Possible options

are:

o Full View

o Box View

Design Templates Configurations

Enable Design Templates: Choose “Yes” to display the design templates on front end so that your

customers can select the templates.

Set Default Templates Category: Choose default category in which templates will be stored.


www.appjetty.com 7

Clipart Configurations

Set Default Clipart Category:Choose default clipart category on which cliparts will be added.

Set Clip art image limit: Choose “Yes” to bind the no of clip art images added in the design.

Shapes Configurations

Enable shape: Select “Yes” to allow customers to select different shapes for their design.

Set Default Shapes Category: Choose default shape category on which shapes will be added.

Masking Configurations

Enable Masking: Opt for “Yes” option to enable the masking effect on your store.

Set Default Masking Category:Choose default quote category on which masking images will be

added.

Quotes Configurations

Enable Quotes: Choose “Yes” to permit your customers to add quotes in design.

Set Default Quotes Category: Choose default quote category on which quotes will be added.


www.appjetty.com 8

Text Configurations

Enable Google fonts: You can display Google fonts on the front end by choosing “Yes”.

Google font list: This option will be available only if you choose “Yes” in the previous field. You can

select multiple fonts from the font list to be displayed on the front end.

Default font size: Select the font size from “12” to “60” as default.

Default font: Select the default font from the drop down list.

Set text limit: Bind the no of text objects to be added in the design by opting for “Yes”.


www.appjetty.com 9

Custom Image Upload Configuration

Enable Upload Custom image: Select “Yes” to let your customers upload images from their PC.

Show instruction: Choose “Yes” if you would like to display the guidelines for custom image upload.

Instruction text: This option will be available only if you select “Yes” in the above field. You can enter

the text to be displayed as guidelines for your customers regarding image upload.

Set Custom image upload limit: Choose “Yes” if you would like to set the boundary for custom image

upload.

Minimum size of image: Enter the minimum size of image to be uploaded in MB. Image with size less

than the specified size will not be allowed.

Ask for user's confirmation before uploading image: Select “Yes” to display alert message for user’s

confirmation before image upload.


www.appjetty.com 10

Printing Method Configuration

Quantity of color available in "By Color" printing methods:Add quantity of colors which are available

in “By Color” printing methods.

Small area size start (px):Add pixels from where small area size will start.

Small area size end (px) :Add pixels from where small area size will end.

Medium area size start (px):Add pixels from where medium area size will start.

Medium area size end (px):Add pixels from where medium area size will end.

Large area size start (px):Add pixels from where large area size will start.

Large area size end (px) :Add pixels from where large area size will end.

Extra Large area size start (px):Add pixels from whereextra-large area size will start.

Extra Large area size end (px):Add pixels from where extra-large area size will end.


www.appjetty.com 11

Set Color Picker Configurations

Enable Color Picker: Choose “Yes” to enable color picker for color selections.

Set Side Movement

Admin will be able to set Left, Right, Top & Bottom side movement pixels. Based on which sides will

move when clicked on side movement buttons.

Social Media Upload Configuration

Admin will be able to add IDs for social media platforms like Instagram & Facebook to enable social

sharing & social image upload options.


www.appjetty.com 12

Step 2: Clipart Management

Go to Product Designer→ Manage Cliparts. Admin will have list of clipart categories that are in the

store.

Admin can add clipart category and images from here.Admin can click on “Add Clipart” to add a new

category or click on any of the list item to edit it.

You can add it as a “Parent Category” or nest it under any existing parent category.

You have to select the parent category from drop down list if adding a sub category.

Select the status of the clipart category from Enable/Disabled.

Browse and upload the images to be added in the clip art category.

Labels and tags can be added for uploaded images to ease out the search.

Provide the sort order in which you would like to display the images at front end.

You can exclude the images that you don’t want to display at the front end instead of permanently

deleting it.


www.appjetty.com 13

Step 3: Masking Images Management

Go to Product Designer→Manage Masking Images. Admin will have list of masking categories that

are in the store.

Admin can add masking category and images from here. Admin can Click on “Add Masking Image” to

add a new category or click on any of the list item to edit it.

These images are added under categories in the same way as clip art images.


www.appjetty.com 14

Step 4: Shapes Management

Go to Product Designer→Manage Shapes. Admin will have list of masking categories that are in the

store.

Admin can add shape category and images from here. Admin can Click on “Add New Shape” to add a

new category or click on any of the list item to edit it.


www.appjetty.com 15

You can add it either as a “Root Category” or nested as sub category.

Browse and upload the images of shape with label, tags and sort order to display at the front end.

Click on “Save Shape” and you will find it as record added in the grid.


www.appjetty.com 16

Step 5: QuoteManagement

Go to Product Designer→ Manage Quote Categories. Admin can add multiple quote categories from

here. Admin will have list of quote categories.

Admin can add quote category here. Admin can click on “Add New Quote Category” to add a new

category or click on any of the list item to edit it.

Admin can add the title, status and type of the quote category.

After adding quote category admin can add quote to that category. For this go to Product Designer→

Manage Quotes. Admin will have list of quotes here


www.appjetty.com 17

Admin can add new quotefrom here. Admin can click on “Add New Quote” to add a new quote or

click on any of the list item to edit it. Admin will be able to add quote content, choose store views for

the quotes and choose status & category for the quote.


www.appjetty.com 18

Step 6: Fonts Management

Go to Product Designer→ Manage Fonts. Admin can add multiple fonts from here. Admin will have

list of fonts that are already in the system.

Admin can remove / exclude the existing fonts or click on the link for adding the fonts. Admin can also

drag and drop font files to the list.

Step 7: Design Template Category Management

Go to Product Designer→ Manage Design Templates Category. Here admin will have list of design

template categories that are already added for the store.


www.appjetty.com 19

Import / Export Design Templates

Admin will be able to export all the designs to CSV template which can be used in any other product

categories.

For importing the templates, admin will have to add all the images provided with the templates to the

design folder. After that admin will have to Import CSV files by clicking on Browse button.

If there are ten templates and category has three product then the all the ten templates will be

created for all three of the products. All the elements will be added in center of the canvas.

Admin can click on “Add New Design Category” button to add new category or click on any existing

category to edit it.

There will be 2 tabs for Design Categories. In the first tab “Design Templates Information”, admin will

be able to enter the title, status and type of category in “Design Templates Information”.

In the “Design Template Information” admin will also be able to define design area size for the

category templates. Admin will be able to set Canvas Height & Width which can be updated as per the

use in future.

Tick the check boxes against the pre-designed products to add them in the category in “Design

Templates Category” section.

“Design Templates” admin will have list of design templates that are associated with the category.


www.appjetty.com 20

Step 8: Image Side Management

Go to Product Designer→ Manage Image Side. Here admin will have list of image sides added for the

store.

Click on “Add Image Side” button to add a new image side or click on any image side to edit it.

Enter the name of the image side i.e. front, back, right, left, etc. and set the status “Enabled”.

The sides added here will reflect in the product edit view and on the front end dynamically.


www.appjetty.com 21

Step 9: Creating Simple & Configurable Products as per the default magento Flow

Creating Simple Product

Go to Products → Catalog. Open any simple product in edit view, for which you would like to enable

the extension.

In the Basic Settings ->Product Details Tab, make sure “Enable Product Designer” toggle button is on.

Move to the Images tab; upload high resolution images for all the sides to get better output. If you

will upload low resolution images here, then the output will be of low quality.

You need to set the design area for each side.

Click on the Edit Option on “Product Image” and “Create Design Area” pop up will show upon the

click. Edit the design area and click on “Save and Exit”.


www.appjetty.com 22

Creating Configurable Product

Go to Catalog→ Manage Products. Open any configurable product in edit view, for which you would

like to enable the extension.

In the General tab, make sure “Enable Product Designer” attribute is set to “Yes”.

Move to the Images tab; upload images for all the sides. These images will have no role in the front

end. No need to upload images for all the associated products.

Select the option for configurable attribute. For e.g.: if the configurable attribute is “Color” and you

select “Green” then the product will be displayed in green color first at the front end.

Set design area for all the sides by clicking on “Edit Design Area” link.


www.appjetty.com 23

In the Associated Products Tab, click any product in the edit view and it will open a new window.

In the Images tab, just select the sides. No need to select the design area.

Step 9: Creating Template for the Products

In the Products list click on “Make Design” link associated with the product. The design interface will

be displayed same as the front end. Click on “Save” button after you finish the design.

In the “Design Templates” section, enable the template category under which you want the product’s

template design to be displayed. It is mandatory.

Go to Product Designer→ Manage Design Templates. Admin can view the sample designs altogether

in a grid.

Admin can edit the design by clicking on any of the product in the grid.

The main purpose is that admin can showcase design samples which in turn helps the customer to

buy or capture design ideas.


www.appjetty.com 24

Step 10: Printing Method Management

Go to Product Designer ->Manage Printing Method. Here you’ll get the list of added printing

methods. You can edit existing printing method or can also add a new printing method.

To add a new printing method click on Add Printing Method. Here you can add following field:

o Printing Name : Name of the printing method

o Printing Code : Code for the printing method

o Printing Description : Description for the printing method

o Minimum Quantity : Add minimum quantity for which the method will be enabled

o Store View: Choose the store for which printing method will be enabled.

o Method Type: Add how the method price will be counted. It can be:

By Color Quantity

By Area Range

o Select Customer Group: Choose the customer group for which the method will be enabled.

You can add this printing method to any of the configurable product by going to product details and

choosing the printing method.

For any printing method you can choose area of customization for printing methods which use Area

Range as Method type and number of colors which use Color Quantity as Method type.


www.appjetty.com 25

You can also add various color rang and color quantity from the admin panel by going to color

management and Area Size Management respectively.


www.appjetty.com 26

Step 11: Printing Color Management

Go to Product Designer ->Manage Printable Color. Here you’ll get the list of colors which are enabled

for the store.

Admin can click on “Add Printable Color” or click on any color from the list to edit it. To add a new

color click on Add Printable Color. You can add color name, choose store where color will be enabled.

You can add color code directly or can add color code by choosing the color code from color picker.


www.appjetty.com 27

Points to Note:

You have to set Image Side first and save the product, after which only you can set design area for the product.

To get best output of your customer design upload high resolution images for all the sides of Product.

Masking Image must be of SVG Type.

Output image can be SVG only if the layered image (clipart / uploaded image) is SVG.

Contact Us We simplify your business, offer unique business solution in digital web and IT landscapes.

Customization: If you would like to customize or discuss about additional feature for MageMob Cart, please write to

[email protected]

Tickets

Raise tickets for your specific question!

Send an email to [email protected] you

can login to your account @

www.appjetty.com and click on My Support

Tickets on your account dashboard, to get

answers to your specific questions.

Live Chat

Get instant support with our Live Chat.

Visit our product page at:

https://www.appjetty.com/magento-

product-designer.htmand click on the Live

Chat button for instant support.

mailto:[email protected]

mailto:[email protected]

http://www.appjetty.com/

https://www.appjetty.com/magento-product-designer.htm

https://www.appjetty.com/magento-product-designer.htm

user manual table of contents - appjetty€¦ · user manual – advance product designer 5...

Documents