FROM CACHE - en_header
Return management just got easier! We’ve launched Customer Self-Serve Returns to all Shopify merchants. Click here to learn more!

How to resize correctly images in slider section

Solved
SHIBdev
Shopify Partner
334 24 92

Hi there community! Im rebuilding some section inside my homepage. I want to show image inside slider resizing correctly.

you can see full image here, in a blog section. 

slidereditv1.jpg

And here is how it shows in my slider homepage desktop view (i got the same problem at mobile view)

slidereditv1desk.jpg

 I can share preview url by pm. Any file needed just tell me please! in advance thanks anyone who helps me 🙂

Accepted Solution (1)

Accepted Solutions
LitCommerce
Astronaut
2856 681 661

This is an accepted solution.

Hi @SHIBdev,

Please follow these steps:
- Step 1: Go to Online store > Themes > Actions > Edit code.
- Step 2: Go to Assets > theme.scss.liquid and paste this at the bottom of the file:

.featured-articles-slider .article-block__image{
	padding-bottom: 130% !important;
}

Hope it helps!

LitCommerce - The Most Simple & Affordable Multi-channel Selling Tool.
Effortlessly sell on biggest marketplaces like Amazon, Etsy, eBay, Facebook etc with bulk listing tool, real-time sync & smart order management. Use LitCommerce free for 1-year now!

View solution in original post

Replies 5 (5)
SHIBdev
Shopify Partner
334 24 92
SHIBdev
Shopify Partner
334 24 92

anyone is able to help me?? 😔

SHIBdev
Shopify Partner
334 24 92

i made some changes and i found some way to get it resize correctly, but now i want to remove some space between them, making images fit max-width content. 

slidersectionv1.jpg

 

here is url preview to see it, its on desktop view at homepage.

https://0w5mi614mvv0ejj7-53196980409.shopifypreview.com 

In advance thanks for everything!

LitCommerce
Astronaut
2856 681 661

This is an accepted solution.

Hi @SHIBdev,

Please follow these steps:
- Step 1: Go to Online store > Themes > Actions > Edit code.
- Step 2: Go to Assets > theme.scss.liquid and paste this at the bottom of the file:

.featured-articles-slider .article-block__image{
	padding-bottom: 130% !important;
}

Hope it helps!

LitCommerce - The Most Simple & Affordable Multi-channel Selling Tool.
Effortlessly sell on biggest marketplaces like Amazon, Etsy, eBay, Facebook etc with bulk listing tool, real-time sync & smart order management. Use LitCommerce free for 1-year now!
SHIBdev
Shopify Partner
334 24 92

@LitCommerce Thanks so much! Sir it works really well, exactly what i mean..! appreciate that ! have a good day 🙂