Skip to main content

Make the image depend on two options together

You upload an image for each color and size combination, so the customer sees an image that matches both of their choices.

Before you start

Steps​

Path: Products > Open Product Studio > Options

  1. Click the name of the option whose image changes, such as "Color". Its settings open.
  2. Choose the second option in Image varies by, such as "Size". A count of the ready images out of all the cells shows.
  1. Click Open the image grid. The grid has a row for each color and a column for each size.

  2. On your computer, name each image with the row name, then the column name, such as Gold - Large.png.

  3. Click Upload all images at once, and choose all the images. Product Studio puts each image in the cell that matches its name.

    For a single image, click the β‡ͺ mark in the corner of the cell and choose the image.

  1. Click Close. You go back to the option settings.

  2. Click Review & publish, then Publish now. Until then, nothing changes in your store.

    On a phone: the Review & publish button is at the bottom of the screen.

What your customers see​

The customization goes live in your store within about a minute. The customer chooses the color and the size, and the image of the cell that matches both choices shows.

Good to know​

  • An empty cell shows the choice's own image, if it has one. The grid marks it with the word Base.
  • You can publish with cells missing, because they show only under "Notes β€” won’t block publishing".
  • Check No picture next to a choice that does not show on the product, such as "None". Its cells do not count in the total.

Not showing?​

Next​

Arrange layers: what shows on top of what on the product