Multiple previews

Last updated: April 28, 2026

With the Add Preview feature, you can create multiple previews for a single template.

Each preview works independently, allowing you to:

  • Change backgrounds

  • Adjust positioning and scale

  • Show or hide elements

  • Create different visual experiences from the same template

 

Important

Currently, this feature is available for Shopify stores only and applies exclusively to Templates.

 

How to set up multiple previews in the template

  1. Open the Customily App
  2. Go to the Templates tab
    Template.png
  3. Click to edit the desired template
    Edit template.png
  4. Navigate to Step 2 of the template setup
  5. You will see the canvas displaying the Default Preview. You can rename this preview if needed.
  6. Click the “+” (Add Preview) button to create a new preview
    Default preview.png
  7. Once added, you can choose to show or hide specific elements depending on the selected preview
    Back preview.png

Multiple Preview Use Cases

Add lifestyle and/or design zoom previews

Multiple previews are ideal when you want to display the same design in different visual contexts.

Step 1: Design Setup

The template includes the main design.

Step 2: Preview Setup

Create multiple previews to showcase different visual presentations:

  • Preview 1: Plain Product Mockup

    Shows the product on a clean background (standard product view).

  • Preview 2: Lifestyle Mockup

    Displays the same product applied to a lifestyle image (e.g., model wearing the t-shirt).

  • Preview 3: Design Zoom

    Focuses solely on the artwork.

test2.gif

Separate the front & back previews

For products that include multiple print files (for example, front and back designs), here’s how previews can be built:

Step 1: Design Setup

  • Step 1 can include multiple files (e.g., Front File and Back File).

Step 2: Preview Setup

  • Step 2 allows you to create multiple previews depending on how you want to display those files.

You can configure previews in different ways:

Single-file previews

Each preview shows only one file (while hiding the others).

Example:

  • Preview 1: Front design only
  • Preview 2: Back design only
test1.gif

Summary preview

A single preview showing all files together (the traditional setup we typically use).

Combination approach

You can mix both strategies.

Example:

  • Preview 1: Front only
  • Preview 2: Back only
  • Preview 3: Combined front + back summary
test3.gif

This flexibility allows you to control exactly how customers visualize multi-file products.

Important

All personalization details for every file must remain visible in the Option Set at all times.

Do not condition personalization options to appear or disappear based on the selected preview. If options are hidden depending on the preview selection, required customization details may be missing when the product is added to the cart.