Can you display multiple images for a selected product variant on Shopify?

jayh1
Visitor
1 0 0

Hey there, I was wondering if anyone could suggest how to achieve the look as illustrated below. I am looking for a way to have it so:

 

when a variant is selected, it shows multiple images of the new variant, without having to have the pictures attached to the original product. In the cases pictured below, it appears to redirect to a new link for each variant. I cannot find anyway to do this on Shopify alone. As it only allows you to add one image variant and this has to be tied to the original product.

 

I would sincerely appreciate it if anyone good offer some guidance on how I may be able to achieve this.

 

Thank you for your time and have a great day!

 

(Check Below Pics for Examples)

 

 

Screenshot 2023-06-02 at 22.36.44.pngScreenshot 2023-06-02 at 22.37.53.pngScreenshot 2023-06-02 at 22.50.09.pngScreenshot 2023-06-02 at 22.53.33.pngIMG_3680.PNGIMG_3679.PNG

Replies 3 (3)

Moeed
Shopify Partner
3621 916 1141

Hey @jayh1 

To achieve the look you described, where selecting a variant shows multiple images of the new variant without having the pictures attached to the original product in Shopify, you would need to use a third-party app or custom code to extend the functionality of the platform. Here are a few potential approaches:

 

  1. Variant Image Gallery Apps: There are several Shopify apps available that allow you to display variant-specific images. These apps enable you to associate separate images with each variant and display them dynamically when the variant is selected. Examples of such apps include "Variant Image Automator" and "Variant Image Penguin." You can explore these apps in the Shopify App Store and choose one that best fits your needs.

  2. Custom Code: If you have coding experience or can work with a developer, you can implement a custom solution using Shopify's APIs and JavaScript. The idea is to load the variant-specific images dynamically based on the selected variant. You would need to modify the product page template and use JavaScript to update the image gallery based on variant selection. This approach requires custom coding and might involve working with Shopify's Product API and front-end JavaScript frameworks.

  3. Theme Customization: Depending on the theme you're using, it may have built-in support or customization options for displaying variant-specific images. Review the documentation or contact the theme developer to inquire about available features or customization options. Some themes provide flexibility in displaying variant images without the need for additional apps or code modifications.

It's important to consider your technical expertise and the specific requirements of your store before choosing an approach. If you're not comfortable with coding or customization, using a variant image gallery app would likely be the most straightforward solution. If you have coding skills or work with a developer, exploring custom code or theme customization options could provide greater flexibility and control over the design.

 

Remember to thoroughly test any changes you make to ensure the functionality works as intended across different devices and browsers.

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️

Akibhusen
Shopify Partner
715 121 147

@jayh1 ,

 

I have checked the website to which you have added the screenshot. The functionality you are looking to implement in your store is possible. But it's really time-consuming job.

 

I can help you with this. It requires more customization of the theme code.

 

Please share your store URL and which theme you are using for development.

gr_trading
Shopify Partner
1649 139 170

Hi @jayh1 

 

Have built the same APP for the below client and handover the APP to client.

 

https://mymerchandize.com/products/lost-in-reality-david-glass-case-for-samsung-galaxy-m31s

 

Your requirement is exactly the same, just the design change required.

 

Hope this will help...

For any custom development WhatsApp or connect at Email ID: gr.trading15@gmail.com for quick consultation. | Shopify Free codes
To support Buy Me a Coffee