change product images on product page

Store Design

Topic summary

A user wants to modify their product page layout to display only 2 images at the top, rather than the default arrangement.

Solution provided:

  • Navigate to Theme Editor → Product Information Section
  • Change “Desktop Layout” setting to “2 Columns”
  • Add custom CSS to the Product Information Section’s Custom CSS field:
    • Force column layout with flex-direction: column
    • Set media wrapper to full width by removing max-width constraints

The discussion includes a visual reference image showing the desired layout and provides password-protected store access for context. The solution appears straightforward and actionable, though no confirmation of implementation success has been posted yet.

Summarized with AI on October 27. AI used: claude-sonnet-4-5-20250929.
1

Hi everyone,

I want to change the product images like the image below:

uncutgemsnl_0-1750407275682.png
uncutgemsnl_0-1750407275682.png1017×824 108 KB

Only 2 images on top of the product page

The website is: https://uncutgemsnl.myshopify.com/

pw: shaupu

Thanks in advance.

2

Hi @uncutgemsnl ,

First thing you wan to do is go to the Theme Editor → Click Product Information Section → Set “Desktop Layout” to “2 Columns”.

Then you can add CSS to the section Product Information Section → Custom CSS → Paste in this:

.product--columns {
flex-direction: column !important
}

.product__media-wrapper {
width: 100% !important;
max-width: unset !important
}