Variant images
Connect images to your product variant boxes
Pala Alto includes a feature to help you easily display images for variant options on product pages. Customers can see a visual image of the variant options.
Introducted in Palo Alto 5.9
This feature can be ideal for showing images for variant types like size, type, style, and can even be used for colors:
Palo Alto will use the image that's associated to the variant type in your product setup:
Important: Currently, only one variant type is supported. The feature will only work with one variant type selected in the theme's default content (language file). For example, if you use the feature for "Size", then images will only be shown for any products that contain a "Size" variant. For other variants, the standard swatch or boxed variants will be displayed.
How to use
If you already have images associated with your products, there are two primary steps for activating this feature in Palo Alto:
Choose a variant type for the feature.
Toggle the feature on or off.
Step 1 - Choose the variant type
If your store sells artwork or furniture, you might choose a variant type like "Style" or "Size." Or if you sell phone cases, you might choose to show images for "Model" or "Color."
Once you've decided on a variant type, you can add the variant name to your theme's default content (language file). The default in Palo Alto is "Size" so you can skip this step if that's your choice.
Default Theme Content
In the Theme Customizer, click on the three dots (ellipsis) at the top. In the dropdown, choose: "Edit default theme content"
In the Default Theme Content Editor (also known as Language Editor), click on the Products tab:
Scroll to the bottom and find "Variant option image":
Here, you can change the value from "Size" to your choice. In our example, we'll use "Color":
Save the change after making your change.
If you use "Color" for the variant type, swatches will still be shown on the product card and collection grid.
Step 2 - Toggle the feature
In the Theme Customizer, use the Theme Settings -> Product form
Check the box for "Show variant image" to turn the feature on.
Now, all products with your chosen variant type will show images of variants. Ensure that all your products have variant images associated with them.
Save your Theme Customizer changes.
Last updated
