The Product Options Personalizer is a powerful custom product designer tool that simplifies product personalization and enhances the overall customization experience, helping boost conversions on your store.

It supports both on-page personalization and pop-up personalization, giving you flexibility in how customers interact with product customization.

This tool is ideal for web-to-print businesses, allowing customers to create personalized products like t-shirts, mugs, phone cases, and more using intuitive design features

Key Features

• Add text, images, cliparts, patterns, shapes, and product colors, including your own custom assets
• Offer on-page and popup personalization for a flexible user experience
• Display customization options based on conditional logic (show/hide options)
• Design products with multiple sides, safe-area indicators, and ready-to-use print templates
• Generate print-ready files in PNG, JPG/JPEG, SVG, and PDF formats
• Set custom pricing for text, images, cliparts, and patterns with tiered pricing rules
• Enable bulk ordering with size & color variants and layout personalization
• Remove image backgrounds directly within the designer tool
• Fully responsive design experience across desktop, tablet, and mobile devices

This guideline will walk you through the process of installing the app, adding products, creating templates, and configuring conditional options.

Steps:

1. Install the APP : Go to the Shopify App Store → Search for Product Options Personalizer → Click on Install → You will be redirected to your Shopify store → Click Install App to complete the installation

2. Select a Plan : ** After installing the app → Open the app from your Shopify admin → Go to the **Plan section → Select the plan that best fits your requirements → Click Approve/Confirm to activate the plan

3. Enable Theme Block : Go to Online Store → Themes → Click Customize on your active theme → Navigate to the product page template → Click Add Block → Select Product Options Personalizer → Place it in the desired position → Click Save

6. Selection of Product: Click on the Add product button ➜ select the product ➜ Click on the Add button

7. Create or Select Template : Templates define how customers customize products.

• Click Create New Template OR
• Select an existing template

**Template Guide: https://setubridge.crisp.help/en-in/article/template-setup-guide-product-options-personalizer-11o8s8u/

Template Includes:

• Product views (front, back, side)
• Text elements
• Image uploads
• Clipart
• Design areas

8. Add Elements: Create a template → Add customization elements → click to ADD → Customers can personalize those products on the storefront.

• Text – Add a Text Element to allow customers to personalize the product with their own text (such as names or messages). You can configure label, default text, font style, font size, alignment, colors, and character limits.

• Multiline Text – Add a Multiline Text Element to allow customers to enter longer messages (such as notes or detailed instructions). You can configure label, default text, font settings, alignment, colors, and character limits.

• Image Upload – Add an Image Upload Element to allow customers to upload their own image or logo for product personalization. You can configure settings like label, cart label, default image, and maximum width/height to control the image size on the canvas.

• Clipart / Image Choice – Add a Clipart Element to allow customers to choose graphics or icons from a predefined clipart library. You can configure settings like label, default image, image sets, and maximum width/height to control how the clipart appears on the canvas.

• Canvas Controls: These options allow interaction with the label on the canvas. Depending on which options are enabled, customers can move, resize, rotate, or delete the label. If all controls are disabled, the label will remain visible but cannot be modified.

• Dropdown – Allows customers to select one option from a list (e.g., size, material, or style). It keeps the interface clean when you have multiple choices.

• Button – Displays options as clickable buttons. Customers can quickly select an option with a more visual and interactive experience.

• Checkbox – Allows customers to select multiple options (e.g., add-ons like gift wrap, accessories, or extra features).

All three elements use Option Sets, where you can define:

• List of choices
• Default selection
• Optional pricing for each option

• Additional Settings – Text, Image Upload & Clipart

The following settings are available for Text, Image Upload, and Clipart elements:

• Required Field – Enable to make this field mandatory before customers can add the product to cart.

• Additional Charge – Enable to add an extra cost for this element. Enter the amount in the Price field (use 0 for no charge).

• No Preview – No Preview – Enable this option to hide the element from appearing on the design canvas. For a better understanding, please refer to this [guideline](No Preview – Enable this option to hide the element from appearing on the design canvas. For a better understanding, please refer to this guideline.).

• Use for design only (not editable) – Enable to make the element visible on the canvas but prevent customers from modifying it.

9. Configure Product Side & Background: Template Editor → Click ⋮ (three-dot menu) next to Front → Select Edit Side → Enter Side Name → Choose Background Type (Product Images or Blank Canvas) → Select or upload Background Image using Change Image / Choose from Media → Click Save.

• Blank Canvas : Blank Canvas creates an empty design area without a product image. You can set the canvas width and height (pixels) and choose a background color to define the design space where customers can add text, images, or clipart.

• Product Images: Product Images use the product’s existing images as the canvas background. This helps customers see how their text, images, or clipart will appear directly on the product. You can change the background image, select one from the media library, or choose from the product’s available images to display on the canvas.

10. Configure and Save the Product : Add the required elements → Drag and resize them within the design area → Configure their settings from the Element Settings panel on the right → Click Preview to check how the customization will appear → Click Save to finalize the template. Once saved, the template will be ready to use for product personalization on the storefront.

Result:

12. On-Page Personalization : Customers customize directly on product page

**Popup Personalization : ** Customization opens in popup

Additional Sections:

13. Assets Management : The Assets section allows you to manage all resources used in templates such as fonts, colors, images, and option sets.

Go to Assets → Select asset type (Font / Color / Image / Option) → Click Upload / Create (e.g., Upload Font or Create Font Set) → Configure details → Click Save

Available Asset Types

• Font → Upload and manage custom fonts for text elements
• Color → Create and manage color options for customization
• Image → Upload images or cliparts for design usage
• Option → Create option sets for dropdowns, buttons, and checkboxes

14. Settings Configuration : The Settings section allows you to control app behavior, personalization layout, button customization, and validation messages.

• Enable / Disable App : Go to Settings → Toggle Enable/Disable App → Click Save Changes
• Personalization Layout : Go to Settings → Select On-Page / Popup → Click Save Changes . Choose how personalization appears on the storefront: On-Page → Personalizer is displayed directly on the product page.  Popup → Personalizer opens in a popup when customer clicks customize

Go to Settings → Select On-Page / Popup → Click Save Changes

• Hide Add to Cart Button : Go to Settings → Enable Hide Add to Cart & Buy Now Buttons → Customers must use personalizer → Click Save

Translation Settings : Customize labels and validation messages:

Go to Settings → Edit fields like Add to Cart Button Label, Text Field Validation Message, Multiline Text Validation Message, Image Upload Validation Message → Click Save Changes

File Size Limit : Set upload limits for customer images → Go to Settings → Set Minimum & Maximum File Size (MB) → Click Save Changes

Customize "Customize Button" **: Control appearance of personalization button → Go to **Settings → Edit Button Text, Background Color / Hover Color, Text Color / Hover Color, Width, Border Radius, Font Size → Preview changes → Click Save Changes

** **

You have now successfully learned how to install and set up the Product Options Personalizer app, create templates, add customization elements, and configure settings for your store.

By using these features, you can provide a seamless and interactive product customization experience for your customers, helping improve engagement and increase conversions.

Need Help?

f you need help setting up translations or want assistance tailoring them for your store, feel free to contact our support team at **support@setubridgeapps.com **or on

explainsWhatsApp: +91 8511963839. We’re happy to help 😊

Feedback:

Updated on: 08/04/2026