How to edit Image layout in single product page in woocommerce on wordpress?

Question

I am using a wordpress theme and woocommerce on my e-commerce website, which is currently under development. I would like to know how can I edit the single product page in wordpress in order to change the layout of my images. I can give an example of what I am exactly looking for in my single product display.

For example -> https://www.showpo.com/destination-unknown-top-in-black (Or if you go to any single product page) You can see how 2 images have been displayed side by side.

This is more of a "learn to be curious" rather than where I am looking for just an answer. I know it is possible to change the template via the single-product-page.php, content-single-product.php and single-product folder. The best guess I have is editing the single-product/product-image.php but I am bit clueless on this. Would be great if someone can push me in the right direction.

Thanks

Answer 1

You're right on where you need to edit the image layout.

After looking at the source for the example URL you gave, based on their HTML structure of the images, it looks like they're using Swiper Slider 👌

Now, for how to implement it, happy hacking 🙌