How can I resize product thumbnails on my site?

[jtorres]

I would like to make the product thumbnails smaller.

This is how it currently looks

This is my website link: https://nobox.shop/products/cinta-multiusos-ultra-resistente

Thank you very much for your help on advance!

[Prezentech]

Hi There,

Thank you for reaching out to the Shopify forums!

Let me quickly fix that issue for you.

Please add the below CSS in your base.min.css file:

.t4s-main-area .t4s-product__media-wrapper .t4s-row-cols-4>.t4s-col-item {
    width: 12%;
}

@media and screen (max-width: 768px) {
.t4s-main-area .t4s-product__media-wrapper .t4s-row-cols-4>.t4s-col-item {
    width: 25%;
}
}

Thanks & Regards,
Prezen Tech

[jtorres]

@Prezentech Thank you so much, It worked amazingly!!

Could you give me another code to remove the product variant header:

[Prezentech]

Hi @jtorres

Please add the below CSS:

.t4s-product-form__variants .t4s-color-size__medium .t4s-swatch__title {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 700;
    margin: 0.65em 0 0.5em;
    display: none;
}

It will look like this:

Please do not forget to accept this solution if its working for you

[jtorres]

Hello @Prezentech

Thank you so much, both codes worked perfectly!

I accepted your answer as a solution!

Have a wonderful rest of the day!