HOW TO CHANGE THE SIZE OF PRODUCT IMAGE ON FEATURED COLLECTION DAWN THEME?

MAFER22
Tourist
6 0 4

Hi, the images on the featured collection look so big. I want to change the size .

Replies 4 (4)

Cotten
Visitor
1 0 1

I agree! I'd like to know that as well

made4Uo
Shopify Partner
3833 716 1167

Hi @MAFER22 and @Cotten 

 

You can do the following to size the images.

 

1. From you Admin page, go to Online store > Themes > Customize
2. Click the Featured Collection in your left hand side. This should open a panel on your right hand side
3. Click the Custom CSS and place the code below. See image 

.collection .card__inner {
    width: 50%;
    margin: auto;
}

 

made4Uo_1-1686355731678.png

 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free
mikebutcher
Visitor
1 0 0

Hi Made4Uo,

This solution worked great. Ideally I'd like the product description underneath to line up with the new image size. Is there some extra code I can add in to make this happen?

Thanks,

made4Uo
Shopify Partner
3833 716 1167

Hi @mikebutcher 

 

Yes, you will need to add the {{ product.description }} code. I am assuming you have the latest theme. Please follow the instructions below.

 

1. From your Admin page, go to Online Store > Themes > Select the theme you want to edit > Click the three dots > Edit code

2. Open the card_product.liquid under the Snippet folder

3. Look for the word "card__information" somewhere line 146. Then add the code below. See image for reference. 

NOTE: The code below only applies to featured collection section. If you want it to apply to all product card, just paste the code {{ card_product.description }} 

{% if section.id contains "featured" %}
 {{ card_product.description }}
{% endif %}

Be mindful in using this, since some product have a long description

 

made4Uo_0-1717058347285.png

 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free