# Product Customization

## Introduction

Product customization is an extension that helps you to sell products on your website that can be customised as per your customer’s needs. The user will be able to order this customised items from Fynd website.  It offers options like color, text, and graphics, showing real-time previews, etc. This enhances the shopping experience and enables businesses to offer unique, personalized items.

Recent updates introduced a new sidebar design and reorganized menu items. As a result, screenshots in this documentation may not exactly match the current UI. Rest assured, the extension configuration screens and settings inside the extension remain unchanged.

## Steps to Use Product Customisation Extension

1. Go to Extensions in Fynd Commerce.


1. Click Product Customisation extension.


1. Select the desired sales channel. Here, we have selected ‘Whitesplash’.


1. On the features page, you get two options-


* Add Product Customisation
* Customisation Management


### Add Product Customisation

![QG4](https://cdn.pixelbin.io/v2/doc/original/product_customization/Screenshot_2023-08-08_at_1_30_09_PM.png)

center
em
Figure 1: Selecting Add Product Customisation option
br
### All Products

You can review and pick products for customer customization. For each chosen product, you have two choices: select a template or manually customize the product.

![QG4](https://cdn.pixelbin.io/v2/doc/original/product_customization/Screenshot_2023-08-08_at_6_15_37_PM.png)

center
em
Figure 2: Selecting All Products option
br
* ***Choose Template***-You can pick a template from your list and use it.


![QG4](https://cdn.pixelbin.io/v2/doc/original/product_customization/Screenshot_2023-08-08_at_6_19_55_PM.png)

center
em
Figure 3: Choosing the template
br
* ***Customise Manually***- When you choose this option, you can personally customize and set up the template.


![QG4](https://cdn.pixelbin.io/v2/doc/original/__playground/Screenshot_2023-08-08_at_1_28_10_PM.png)

center
em
Figure 4: Customizing the features manually
br
Building upon the example provided above, the fields that have been configured consist of:

* ***Customization Name***: Provide a name for your template.
* ***Text***: Enter a fitting product name.
* ***Number***: Input the product number.
* ***Upload Sample Pic***: Attach a sample picture of the product.
* ***Select Image***: Choose an appropriate product image.
* ***Select Image Grid***: Pick a personalization image from the available grid or gallery.


### Bulk Update

The bulk update option lets you apply templates to multiple products simultaneously.

***Steps***

1. Download the sample XLSX file and open it.
2. Include the product UID's and save the file.
3. Upload the saved XLSX file using the 'Choose File' option.


![QG4](https://cdn.pixelbin.io/v2/doc/original/__playground/Screenshot_2023-08-09_at_11_07_36_AM.png)

center
em
Figure 5: Steps for bulk update option
br
1. The system will validate the uploaded product UID's and provide a summary of valid records.
2. Click 'Customize' to pick or create a template.
3. Once chosen, the template will be applied to all product IDs in the file.
4. The list of uploaded xlsx will be available under product customisation history.


### Customisation Management

#### Steps to create and configure new template

1. Click Customisation Management option


![QG4](https://cdn.pixelbin.io/v2/doc/original/__playground/Screenshot_2023-08-08_at_1_30_37_PM_(1).png)

center
em
Figure 6: Clicking customisation management option
br
1. Click ‘’Create New’‘ option and fill the required details.


![QG4](https://cdn.pixelbin.io/v2/doc/original/__playground/Screenshot_2023-08-08_at_6_55_39_PM.png)

center
em
Figure 7: Clicking create new option
br
1. Enter the details of the required fields.


![QG4](https://cdn.pixelbin.io/v2/doc/original/__playground/Screenshot_2023-08-08_at_1_28_10_PM-UDQ_yaQng9.png)

center
em
Figure 8: Entering the required details
br
Building upon the example provided above, the fields that have been configured consists:

* ***Customization Name***: Provide a name for your template.
* ***Text***: Enter a fitting product name.
* ***Number***: Input the product number.
* ***Upload Sample Pic***: Attach a sample picture of the product.
* ***Select Image***: Choose an appropriate product image.
* ***Select Image Grid***: Pick a personalization image from the available grid or gallery.


After completing all the required details, the resulting output is displayed in the sales channel.

![QG4](https://cdn.pixelbin.io/v2/doc/original/__playground/Screenshot_2023-08-08_at_1_33_29_PM.png)

center
em
Figure 9: Final output in the sales channel
br
On the cart page, it will appear as follows:

![QG4](https://cdn.pixelbin.io/v2/doc/original/__playground/Screenshot_2023-08-09_at_12_17_34_PM.png)

center
em
Figure 10: Final output on the cart page
br
The customization option on the orders listing will appear as shown below:

![QG4](https://cdn.pixelbin.io/v2/doc/original/__playground/Screenshot_2023-08-09_at_10_53_22_AM.png)

center
em
Figure 11: Final output on the orders listing page
br
### Steps to add the extension in the theme

1. Add product customisation to the extension slot on the product description page.


![QG4](https://cdn.pixelbin.io/v2/doc/original/__playground/Screenshot_2023-08-09_at_12_22_06_PM.png)

center
em
Figure 12: Adding Product customisation to the extension slot
br
1. On the cart page, place the "View Customisation" option in the "Below Item Price" extension slot.


![QG4](https://cdn.pixelbin.io/v2/doc/original/__playground/Screenshot_2023-08-09_at_12_17_10_PM.png)

center
em
Figure 13: Placing the View Customisation on cart page
br
1. On the Orders listing page, position the "View Customisation" option in the "Above Buy Again" section.


![QG4](https://cdn.pixelbin.io/v2/doc/original/__playground/Screenshot_2023-08-09_at_12_18_41_PM.png)

center
em
Figure 14: Placing the  View Customisation on orders listing page 
br