Skip to content
Demo Support
  1. Docs
  2. Product
  3. Option main image

Option main image

How to link photos to product option values so the gallery on the product page changes when a customer chooses a color or variant in the Trust template for OpenCart 3.

2 min read

A customer picks a color — and the gallery on the product page immediately shows photos of exactly that color. The module links product photos to the values of its options: color, variant, configuration.

Choosing a color on the product page

How it works

  1. Enable the module

    Open Octemplates → Change photo when choosing an option, turn on “Module status” and save.

    Module settings

    Once enabled, on the “Image” tab of every product a list of its option values appears next to each photo.

  2. Add a product option

    In Catalog → Products open a product and on the “Option” tab add an option with values — for example, “Color” with “White”, “Blue”, “Yellow”.

  3. On the “Image” tab, next to each additional photo tick the option values it should be shown with — for example, “Color > Yellow” — and save the product.

    Linking photos to option values in the product editor

Switch options only. Photo replacement works for options shown as switches (radio) — in the template they appear as color tiles or buttons. For selects and checkboxes the gallery doesn’t change.

What the customer sees

  • When a customer picks an option value, the gallery updates: only the photos linked to that value are shown.
  • One photo can be linked to several values, and to values of different options — for example, to both color and memory size.
  • If no photo is linked to the selected values, the main product photo is shown.

Tip. Prepare 3–5 photos from different angles for each color and link them to the matching value. Then customers see exactly the product they choose, and you get fewer “what does it look like in yellow” questions.

Turning off

A disabled module removes photo replacement from the product page and the per-image option choice from the product editor. Saved links aren’t deleted: after you enable the module again everything works as before.