DAWN theme - Image resize on product page

Solved
Superhaq
Excursionist
29 1 13

Hi, I have just switched to the dawn theme, however the images on the product pages are absolutely huge. Is there any way to resize them? Thanks

Replies 39 (39)
HamishDavisonIC
Explorer
52 6 42

You're welcome

If you need any more help I'm creating a video series so just leave another question and I'll solve it for you

Hamish

Pauline_Millwar
Tourist
10 0 7

Hi Hamish,

Thank you so much for posting the resolution to this.  We found changing the section below (shown on your screen print) changed the width of the description text, so we changed all of the 4 percentages to 50% and the whole page looks so much better

Can you help with the product zoom? When you click on an image, it takes up the whole page. Is there anyway of reducing this?

Many thanks

Superhaq
Excursionist
29 1 13

Im trying to have the text in the description fill the full width of the page rather than a column on the right hand size. Is this something you can assist with?

Okhrana
New Member
1 0 1

Im trying to have the text in the description fill the full width of the page rather than a column on the right hand size.
Is this something you can assist with?

This is what i need to!!
Somebody got a solution?

HamishDavisonIC
Explorer
52 6 42

I'm sure there is!

If you submit a post here on the forum I will take a look at it when I finish work

Thanks

Hamish

HamishDavisonIC
Explorer
52 6 42

"Thank you so much for posting the resolution to this.  We found changing the section below (shown on your screen print) changed the width of the description text, so we changed all of the 4 percentages to 50% and the whole page looks so much better"

 

Have you tried this?

Superhaq
Excursionist
29 1 13

Yes that worked to resize the images, however my question is in regard to the product description

Raghav_shopi
Tourist
7 0 5

Hi.

The solution worked. Thanks @HamishDavisonIC @Superhaq !!

 

@media screen and (min-width: 990px) {
.product:not(.product--no-media):not(.featured-product) .product__media-wrapper {
max-width: 44%;
width: calc(44% - 1rem / 2);
}

.product:not(.product--no-media):not(.featured-product) .product__info-wrapper {
padding-left: 8rem;
max-width: 50%;
width: calc(50% - 1rem / 2);
}
}

 

Also, I changed the next part to 50% 50% to widen the product description. Increased the padding on the left to 8 rem to increase the gap between the Images and Text.

 

 

Raghav_shopi
Tourist
7 0 5

@HamishDavisonIC 

 

1. How can we change the grid layout of the Images to a carousel layout?

HamishDavisonIC
Explorer
52 6 42

Hey I believe this would be front-end, so you just delete the columns and instead put a carousel. If this isn't correct I'll look into it when I get home