How can I resize and change color of images in my featured collection?

[AnnaB2]

Hi! Please help, how can I adjust the size of the images in my featured collection? I want to make it smaller. How can I change the background image color to white in the featured collection?

Website: https://8d6283-3.myshopify.com/

[David_SHT]

Hi @AnnaB2 ,

This is David at SalesHunterThemes.

Thank you for your question.

You can try to follow these steps:

Go to Online Store → Themes → Actions → Edit code.

Go Assets folder → base.css file.

Add this following code at the bottom of page.

#Slider-template--20739511222581__featured_collection .card__media .media img {
    max-width: 65%!important;
    margin: auto!important;
    display: block!important;
    position: unset!important;
    object-fit: contain!important;
}

Here are the results:

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

David | SalesHunterThemes team

[AnnaB2]

Thank you @David_SHT , it really helps but how can I change the background color of those images to white?

[ZenoPageBuilder]

Hello @AnnaB2

In Shopify Admin, you can go to Edit theme code, open file base.css and add this code at the bottom

slider-mobile-gutter {
    max-width: 96rem !important;
}

slider-mobile-gutter .card__media {
    background-color: white;
}

The result

Hope it helps!

[David_SHT]

Glad it helped you, @AnnaB2

if you want change background image to white you can try to follow these steps:

Go to Online Store → Themes → Actions → Edit code.

Go Assets folder → base.css file.

Add this following code at the bottom of page.

#Slider-template--20739511222581__featured_collection .card .card__inner .card__media {
 background: #fff;
}

and here is the result:

Hope this can help.