Product page reformatting

[ellacoker]

Hi there, a couple of things I would love some help with.

1. On desktop, have my product information to the right third of the page and put two images on the left thirds of the page (see screenshot)
2. remove the outline around the quantity and variant selector

thank you in advance!

ella

shopnirjara

PW: ellaella

[Bang_T]

Hi @ellacoker

Hope you are doing well. Here is a quick guide, Hope it help.

Open the theme Customizer > Select Products from the Dropdown

Then click Default product

If you have other templates than Default product, then you will need to do the step below for them too

At this step please click Product information and change the settings in the right column as the image above.

[Dan-From-Ryviu]

@ellacoker

ellaella

Please set those options of Product information for your product template by following this image

Then add this code to Custom CSS of your theme settings.

.page-width:has(.product) { max-width: 100% !important; } 

[oscprofessional]

Hi @ellacoker ,

1. Go to Online Store > Themes > Customize > Product page > Click on Product information > Set Layout in 2 cloumns

2. Go to Online Store > Themes > Actions > Edit Code > base.css Add below code at the bottom of base.css file

.product__info-wrapper .select:after, .product__info-wrapper .quantity:after, .product__info-wrapper .select:hover:after, .product__info-wrapper .quantity:hover:after {
    border: 0;
    outline: 0;
    box-shadow: none;
}

[mageplaza-cs]

Hi @ellacoker

I noticed that you are using the Dawn theme, so you just need to follow the instructions in the screenshot I provided below to achieve the desired result.

*Result:

[ellacoker]

thanks dan - that worked. 2 things though, i want to have the two image format, bus as a carousel, like Full Moon Tube Carob –Indigo Luna Store

I would also like less space between the two images, and for all of the information on the right hand side to keep to one size so it all aligns, if that makes sense? I have tried to explain via the screenshot attached.

Thank you again.

shopnirjara.myshopify.com

PW: ellaella

[Dan-From-Ryviu]

@ellacoker

ellaella

The space between images is good if it does not have this code

[ellacoker]

Hi Dan, do you know how I make it a two column carousel? Thanks in advance.