how can i resize the secondary images on a product?

[themoonlitholo]

hello my friends, im just wondering how to resize the other images i include on a product so they arent so small, is there a way to resize them? ive attached a photo showing the images im talking about! any info or help would be appreciated!

https://themoonlitholo.com/

pass: Pleasehelp

[BiDeal-Discount]

Hi @themoonlitholo

you can make it bigger by this Custom CSS:

@media screen and (min-width: 576px) {
    .product-gallery--media-thumbnail img {
        height: 150px;
    }
}

result will be:

[Samita-Danny]

Hi, @themoonlitholo
i’m Danny from Samita

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.css file

4. Fil and change

@media screen and (min-width: 576px) {
  .product-gallery--media-thumbnail img {
    height: 120px;
  }
}

[Kyle_liu]

Hi @themoonlitholo

In theme.css file

height: 120px; 120 can be adjusted to your desired value, and the larger the value, the larger the image

@media screen and (min-width: 576px) {
  .product-gallery--media-thumbnail img {
    height: 120px;
  }
}

[Bundler-Manuel]

Hello there @themoonlitholo You should try the following steps

Open Online Store > Theme > Edit Code

2. Find and open the theme.css (or base.css, custom.css) file

3. Paste the code snippet below at the bottom of the file and hit save

.imgWrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    /* You can change this value to fit your preference */
    height: 550px;
    overflow: hidden;
    background: black;
}

.imgWrapper img {
  width: auto; 
  height: 100%; 
  object-fit: cover;
}

Let me know if this works for you!

[Sparklingtools]

Hi!

It seems that you have already resolved it! Am I right?