Visible descriptions
Describe each colour’s photo under the gallery.
Commerce / widget · Elementor module
Variation Image Alt Text Widget Plugin for Elementor
Show the alt text of the image for the WooCommerce variation a shopper picks, such as Merino scarf navy, to describe it or check it while editing.
Included in All AccessClassic Elementor widgetFrom $29 USD / year
Complementor / Variation image alternative textProduct preview
Text, style and layout controls inside Elementor
01 / Interactive demonstration
See it
These are the actual published outputs of the widget for a sample variable product in the lab shop; on a product page the text follows the shopper’s choice.
02 / Inside WordPress
Variation image alt text controls in Elementor
Product chooses the current product, a selected variable product or one fixed variation, and whether to show the main image’s alt text before a choice. Display sets a prefix, a text for images without alt text, whether to hide the line from screen readers and an optional icon. The Style tab covers typography, colours, background, border, radius, spacing, alignment, prefix and text colours, italics and the icon.
03 / Website use cases
Where to use variation image alternative text
Every variation image needs alternative text for screen readers and search, but it is easy to miss one, and WooCommerce never shows it on the page. Variation image alt text shows the alt text of the photo for the option the shopper picks, as a visible description, and tells you in the editor when an image has none.
Accessibility checks
See in the editor which variation images still need alt text.
Catalogue reviews
Check alt text reads well as you click through options.
04 / Installation and setup
How to show variation image alt text in Elementor
Start with Complementor installed and your license connected. Enable this module in the WordPress library, then configure it in Elementor.
Install Complementor, connect your license and enable Variation image alt text in the Complementor library.
Add alt text to the product and variation images in the Media Library.
Add the widget to a single product template, or to a page with the product’s add-to-cart form.
In Product, choose Current product, a selected product or one fixed variation.
Turn on Hide from screen readers when it sits next to the image, then pick an option to check the text changes.
05 / Content and style controls
Customize variation image alternative text in Elementor
Configure the settings available for this module to suit the page you are building.
Follows the shopper’s choice in the product’s add-to-cart form.
The main image’s alt text before a choice, or nothing.
Variations without their own image use the main image’s alt text, as WooCommerce’s gallery does.
Text for images without alt text, or nothing, with an editor note to add it.
Hide from screen readers, so a description beside the image is not read twice.
Prefix and text colours, italics, background, border and radius.
Optional icon such as an image sign.
06 / Choose the right approach
Variation image alternative text and Elementor alternatives
Compare the existing Elementor workflow with this Complementor module before choosing your setup.
Variation image caption
Shows the image’s caption, written for everyone, rather than its alt text.
Media Library
Where alt text is written; it does not show which variation uses each image.
07 / Requirements and compatibility
Variation image alternative text compatibility with Elementor
- Requires Elementor and WooCommerce.
- Variable products and their published variations only.
- Shows public products and their published images only.
Complementor uses classic Elementor APIs. Atomic-native controls are not implemented. Check your theme, cache and integrations on a staging site before release.
08 / Common setup problems
Troubleshoot variation image alternative text
Check these settings if the published page behaves differently from the editor.
Why does nothing show for one option?
Its image has no alt text. Add it in the Media Library, or set a text for images without alt text.
Will screen readers read it twice?
They can when it sits next to the image. Turn on Hide from screen readers there.
Why does the text not change when I pick an option?
The widget follows the add-to-cart form of the same product on the page. Add the form alongside it.
Why does an option show the main image’s alt text?
It has no image of its own, so WooCommerce shows the main image.
Variation image alternative text plugin questions
Does it need Elementor Pro?
No. It works with the free version of Elementor and WooCommerce.
Where is alt text set?
In the Media Library, on each image’s Alternative Text field.
Does it change the image’s alt text?
No. It only reads it.
Can I hide it on the live site and use it only while editing?
Use Elementor’s responsive visibility or leave it on a draft template; the editor note shows images without alt text.
Does it work with simple products?
No. It is for variable products and their variations.
10 / Annual All Access subscription
Get variation image alternative text with Complementor
This module is included with all 1007 current Complementor solutions. Choose your production website allowance; every plan includes the same modules.
One website
$29USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $29 USD each year.
A few websites
$49USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $49 USD each year.
More websites
$99USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $99 USD each year.
Applicable taxes extra. Annual subscriptions renew automatically unless canceled in your customer account. Elementor Pro is required for Exclude current post. Read the terms and 14-day technical-issue refund policy.