Variant Image Penguin
You want to provide many product images but do not want to overload your product page? This app allows for your product page to only show images of the selected variant, which enhances the focus and cleanliness of your product page dramatically. Instead of one image per variant, you will now be able to assign multiple images to a single variant.
It’s super easy: Go over to the Shopify App store and install! Your current variant setup will remain in place, so you don’t lose any image assignments. Once installed, hop over to your product and make sure you have uploaded all the images for all the variants. Then select the top left menu “Group Images”, and drop the images to their variants! That’s it, now you’re good to go!
Not all templates are compatible with the app from scratch. The customizing needed won’t take more than 5 minutes, and if you like we do it for you. If your Images are not disappearing it's most likely that you got the selector setting wrong. Hop over to the documentation to see how to identify the right one!
If this happens it means, that you got the selector right, by the image-id is missing on your images. Our app needs the ids to know which images to show. Hop Over to the documentation to see how to add the id to your images.
We support up to three options for assigning images to variants! See how to handle images for more than one option in the support article.
The order of images is determined by the images in the shopify product screen. The vip app" doesn't have any influence, because the images are still rendered by your theme, not by our app.
The switching of the main image is not handled by our app, but by your theme. Make sure you have assigned the default variant images in the shopify product screen for this to work.
Shopify allows our app only to run once the entire page is loaded, so we can only filter once all images are available.There is a workaround available, over at the documentation section.
The VIP will only work for Shopify themes where product thumbnails are used. Usually, thumbnails are rendered into the site in the “product.liquid” file (or product-template section). Look for the element surrounding all thumbnails (the first shared parent)
You can get an detailed description here