Changing the size of Collection list thumbnail on the homepage venture theme

Solved
nfrancis
Tourist
11 0 0

hello guys, 

Please can any one tell me how i can reduce the size of collection list thumbnail on my homepage especially on mobile. Currently it shows one thumbnail at a time i would prefer that it displays 2 collection one row, kindly find below what I intend to achieve.

thanks.

i want to have something like this

https://ibb.co/0Qw6bzc

 

 

 

 

0 Likes
dmwwebartisan
Shopify Partner
4477 1004 1285

Hey

Please share your url & password.

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
nfrancis
Tourist
11 0 0

www.yankistor.com

@Sending@123

0 Likes
nfrancis
Tourist
11 0 0

faithiswhoibe

if the previous password doesnt work then try this thanks

0 Likes
dmwwebartisan
Shopify Partner
4477 1004 1285

Hi

add code assets/theme.scss.liquid bottom of the file

@media only screen and (max-width: 749px) {
.grid__item {width: 50% !important;}

.featured-card--contain .featured-card__image-container {height: 224px !important;}

.featured-card { padding: 0 0px;}

}


Hope this will work for you.


Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
dmwwebartisan
Shopify Partner
4477 1004 1285

Hey 

 

i edit my previous solution please try this 

 

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
nfrancis
Tourist
11 0 0

Its worked but it has also distorted some other parts of the homepage.

the alignments on the "Who we are"  Our Collection and some excess spaces on the collection thumbnail itself

 

thats how i pasted it

0 Likes
dmwwebartisan
Shopify Partner
4477 1004 1285

Hi

please remove previous css and add this css class

add code assets/theme.scss.liquid bottom of the file

@media only screen and (max-width: 749px) {
#shopify-section-featured-collections .grid__item {width: 50% !important;}

.featured-card--contain .featured-card__image-container {height: 224px !important;}

.featured-card { padding: 0 0px;}

}


Hope this will work for you.


Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
nfrancis
Tourist
11 0 0

thank you. the initial problem has been solved but then it has created a gap as cycled below can that space be removed.

0 Likes
dmwwebartisan
Shopify Partner
4477 1004 1285

This is an accepted solution.

Hi

add code assets/theme.scss.liquid bottom of the file

 

.product-card__image-wrapper {display: block;}

Hope this will work for you.


Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes