Show every option at a glance
A row of thumbnails, one per value of the attribute you choose — color, finish, material — each with the real photo of that combination.
Shoppers can't buy what they can't picture
A drop-down that says “Blue, Red, Green” asks them to guess how each version looks, or to click through every option and wait for the photo to change. Some give up; others order the wrong one and send it back.
The photos already exist — they're assigned to every combination in the catalog. They just aren't shown where the customer is deciding.
The answer, right on the product page
Variants by attribute puts the real photo of every option in one row, one click away.Select with one click
Clicking a thumbnail selects that combination in the product page's own attribute picker, so price, availability and add-to-cart keep working exactly as before.
Reuse what you already have
No photos to upload and nothing to code: the module reuses the images already assigned to your combinations.
Everything it does, under the hood
Four blocks working together.Product page
- Row of square image thumbnails, one per value of the chosen attribute group, each with the real image of its combination.
- One-click selection: the thumbnail selects the matching option in the theme's native attribute picker.
- The variant currently selected is highlighted with an orange frame.
- The option name is used as the thumbnail tooltip and alternative text.
- Shown only on products with two or more values of the chosen attribute.
Settings
- Attribute group: the ID of the attribute group whose values become thumbnails (usually “Color”).
- Image version: any generated product image type, with 60–100 px versions marked as recommended.
- Thumbnail size: 24 to 200 px, validated so it never exceeds the chosen image version.
- Recommended values shown next to each option, with a one-click “mark all” button.
Positioning
- Works out of the box: uses the native displayProductAdditionalInfo hook that standard themes already call.
- Optional exact position right after the attribute picker, with one line explained step by step in the Help tab.
Back office and quality
- Guided Help tab with setup, positioning and frequently asked questions.
- Translated into English, Spanish, French, Italian, Portuguese and German.
- Only adds its own small stylesheet and script — no external requests, no extra database tables.
- Uninstall removes all its settings.
What you gain
Fewer wrong orders, no extra work.Help shoppers choose faster
They see the real photo of every option instead of guessing from a label.
Help them pick right the first time
Seeing the exact color or finish before adding to cart means fewer surprises and fewer returns.
Reuse the photos you already have
Each thumbnail comes from the images already assigned to your combinations.
Set up in minutes
Pick the attribute group, choose the size and save — no developer needed on a standard PrestaShop 9 theme.
Keep the native purchase flow
The module drives the theme's own attribute picker, so prices, stock and cart behaviour stay untouched.
Stay in control
Choose the attribute, image version and thumbnail size, and move the block to the exact position you want.
What your customers gain
See before choosing.See before choosing
The real image of every color or variant, all in one row.
Easy to tap on mobile
Thumbnails up to 200 px, with the option name as tooltip and alternative text.
A clear indication of what's selected
The current variant is always highlighted.
The thumbnails, in every shop
Five screens of the module at work.
Frequently asked questions
Where do the variant thumbnails come from?
From the images you have already assigned to each product combination. There is nothing new to upload, but each combination needs its own image to be shown.
Can I group by color, finish or another attribute?
Yes, by any attribute group you choose: color, finish, material, pattern… You set it in the module configuration; you will find its ID under Catalog > Attributes.
Do I have to edit my theme?
No. It works right after installation, in a position standard themes already use. If you want the thumbnails right below the attribute picker, before «Add to cart», just add one line to your theme’s product template; the module’s help explains it step by step.
Does it change prices, stock or the cart?
No. The thumbnails drive your theme’s native attribute picker, so prices, stock and the cart keep working exactly as before.
Can I choose the thumbnail size?
Yes, between 24 and 200 pixels, and also which PrestaShop image version to use. The module will not let you set a size larger than that version, so images never look blurry.
The variants do not show on the product page. What should I check?
Three things: that the attribute group ID is correct, that the product has more than one combination of that attribute, and that each combination has its own image.
Specifications
PrestaShop1.7 – 9.1
PHP7.1 – 8.4
LanguagesEN ES FR IT PT DE
LicenseAFL-3.0
Let customers see before they choose
Install it on your PrestaShop and give every product page the real photo of each variant, with no code and no extra photos to upload.
Coming soon to Addons
Back to the modules
Need it adapted to your store, or something no module covers? Custom development
Try it in our demo
Nothing to install: a test PrestaShop store with the module up and running. Open the storefront or the back office.
Back office
demops.10cero.es/admin10cero
- Username
- demo@demo.com
- Password
- demodemo
The store is reset periodically and the admin profile is limited to the module configuration.