Editing image sizes on homepage using debut theme

oldmariner
Tourist
9 0 1

Do any of you know  How I can reduce image sizes... my sites home page I added images via creating a collection page and they are too big... I can do a little in the theme editor but dont want to screw things up.  Any advice for an old guy..??? deepseadreams.com

 

Thanks Keith

0 Likes
LitExtension
Shopify Partner
1200 154 215

Hi @oldmariner

Hope you are doing well. In this case, I need access your site to check js on your site. But you also can hide it via css. 

Please place this code at the end of timber.scss: 

.template-index [data-section-type="featured-products-section"] .grid-link__image {

    display: flex;

    height: 300px !important;

}

 

.template-index [data-section-type="featured-products-section"] .product__img-wrapper.supports-js .product__img {

    object-fit: cover;

}

 

But i suggest you also should change from 3 to 4 items on each row. If you want do that, please add this snippet too: 

@media only screen and (min-width: 769px) {

.template-index [data-section-type="featured-products-section"] .grid-link__image .post-large--one-third {

    width: 25%;

}

}

Please take a look at our screenshot here: https://prnt.sc/112zdco

Hope this helps! 

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes
kuchak
Excursionist
33 1 3

Hi!  I have the opposite problem, I want to enlarge the product images on the home page.  But I can't find the timber section of the code in the debut theme.  I tried adding the code at the bottom theme.scss.liquid but it didnt work

0 Likes