Articles on: Design Templates

Image selection (Folder swatch)

This article covers how to enable image-based customization through the Image Folder feature in Customix. This is ideal for clipart-style personalization, such as selecting hairstyle, outfit, or pet images, but it can also be used for any image-based choice (e.g. product color option, badges).


1. Single-level Folder

A single-level folder is a folder that contains only image files directly inside it, no subfolders as below



To add a single-level folder to your template:

  • In the template editor, click the My Images icon in the left sidebar.
  • Hover over the folder you want to add — an Add icon (+) will appear.
  • Click the + icon to add the folder to your design.



Once added, the folder becomes a single selectable option set, where customers can pick one image from all the files inside it (as shown in Image 3).

In the Personalization panel, you can Label, mark it as Required, review the Values (the images pulled from the folder), change the linked Folder Edit display type.



2. Multi-level Folder


A multi-level folder is a folder that contains sub-folders instead of (or in addition to) files. For example, the "Body" folder contains two sub-folders: "Type A" and "Type B", and each sub-folder holds its own image files (as shown in image below).



To add a multi-level folder to your template:

  • In the template editor, click the My Images icon in the left sidebar.
  • Hover over the parent folder (e.g., "Body") and click the Add icon (+).



In the Personalization panel, each sub-folder appears as its own group, where you can configure the Label, review the Values (images pulled from that sub-folder), change the linked Folder, or adjust the display with Edit display type.



Customix automatically handles the nested structure: it creates a two-step selection for customers. First, customers choose a sub-folder (e.g., the body type: Type A or Type B). Then, based on that choice, the app displays only the image options inside that sub-folder, selecting Type A shows Type A's images, and selecting Type B shows Type B's images.


📌 Note: Folder nesting is not limited to one level, Customix supports two, three, or more nested layers and automatically generates the selection steps to match the folder structure you set up in Assets.


3. Set Default Value

The default value is the option that appears pre-selected when a customer first loads the product page. To set or change it:

  • In the Personalization panel, click Edit next to Values.
  • In the Edit values dialog, tick the checkbox next to the option you want as the default.
  • Click Save.


If you don't want any option to be pre-selected, simply click Remove default value in the Personalization panel. The customer will then start with no selection and must actively choose an option themselves.



Updated on: 21/05/2026

Was this article helpful?

Share your feedback

Cancel

Thank you!