Variable products in WooCommerce can have separate product images per variation. In this article, you will see how to set this on to change the product image per variation in WooCommerce. Also, how to add custom product fields with images to work similarly (both for simple and variable products).
Contents
- Product image & gallery in WooCommerce
- Images for variable products & product image on variation change
- Custom product fields with images
- Product image - summary
- WooCommerce custom fields for variations for better variable products
- WooCommerce variable product (comprehensive guide and free plugins)
- How to export WooCommerce products with variations?
- How to allow customers to upload files with the File Upload field on the WooCommerce product page
- Color swatches for WooCommerce products with a free plugin
Product image & gallery in WooCommerce
Setting product cover and adding images to the product gallery is possible when adding and editing a product.
You may choose an existing media or upload a new one.
It will appear below the product image (the place can depend on the theme).
This works the same for all product types.
Images for variable products & product image on variation change
But there is also a way to add an extra image for variable products in WooCommerce.
For each variation, you may set the additional image, for example, green lemons.
The variation image will appear after selecting one with the extra image. If one/ some variations don’t have images, the product image will go back to the product’s main cover.
Custom product fields with images
There is also a way to enhance WooCommerce products with custom fields, for example:
It works for both simple and variable products, and there are a lot of field types (also in the free version of the plugin).
There are also fields that can change the product image when selected like in the variation example above. With some exceptions:
- you may add several fields with images
- they do not require changing the product type to a variable product
- you may easily rearrange custom product fields
- there are additional fields that may build advanced and customizable products
- it’s possible to assign specific fields per product
Let’s have a look at the example settings.
And how the product image will change based on the selection.
The custom fields with images
Let’s see the list of custom product fields that support setting additional images that appear as the product image on change.
- Select
- Radio
- Radio with images (and with colors)
- Image (it will show the image next to other custom fields - doesn't change the product image)
Additional product image as a custom field
Some field types have advanced settings (maximum image width and hiding field labels).
Flexible Product Fields improve the WooCommerce products with options (custom fields).
Product image - summary
In this article, I covered how to add product images and galleries in WooCommerce. Also, how to set the variation image change for variable products and with custom product fields.
You may download or find more information in the WordPress repository.
Flexible Product Fields WooCommerce
Create a product wizard to sell engravings, gift wrapping, gift messages, business cards, stamps and optionally charge for it (fixed or percentage).
💾 Active Installations: 10,000+ | WordPress Rating:
