Product thumbnail size product page dawn theme

Store Design
,
1

Hello wizards,

Im trying to enlarge the product thumbnail on the product pages to fill the entire screen (red boxes).
Cant figure out how. www.sundaymass.store

please see attached

Screenshot 2025-04-12 at 12.31.37 am.png
Screenshot 2025-04-12 at 12.31.37 am.png1020×1532 163 KB

1 Like
2

Hi @massmonster .

Here’s how to achieve that:

  1. Go to “Online Store”
  2. Three dots → Edit Code
  3. Find the base.css file
  4. Add the following code at the bottom of the file
  5. Save and refresh the target store page
@media screen and (max-width: 749px) {
    .product__media-list .product__media-item {
        width: 100% !important;
        margin-left: 0px !important;
    }
}

If done correctly, the result should be like this:

Screenshot_3.png
Screenshot_3.png428×685 210 KB

I hope this helps!

If you don’t want to edit the theme code directly, you can use a code injection app like the one in my signature.

1 Like
3

thank you mate, thats fixed that issue and the product page is almost perfect,

only issue is theres still a bit of padding between the pagination arrows and the bottom of the image…
theres also padding between the pagniation arrows and the product title

please advise

4

There’s padding above and below the pagination arrows, indeed. Could you describe what you want to do with it? You can’t remove it completely as it will be difficult to notice/click the arrows.

5

Ive managed to move the pagination so that its ontop of the thumbnails. the spacing is good.

however, there is now a new issue… for a product with 2 photos the pagination will show 1/3.. for a product with 5 photos paginaiton shows 1/6…

very strange. any ideas?

6

hey me again

turns out this only worked on the main product page, ive got a seperate product page template for my other items, how do i update that aswell?

https://sundaymass.store/products/deus-vult-lever-belt