Changing product card width within product block carousel

Store Design
, ,
1

Hi I have a product block section that is essentially a slided slick carousel. Currently it is set so that it displays two product cards at the time on mobile and the product card custom width is calculated automatically. I want to change this so that it displays 1.5 products at the time and indicates to user that he needs to swipe to see more products. I want to do this only for mobile.

This is how the carousel looks now:

SIVA2020_0-1692260967261.png
SIVA2020_0-1692260967261.png2876×1436 448 KB

What do I need to change in the code to accomplish this? I was looking at the following code but I was struggling to make it work:

SIVA2020_1-1692261038479.png
SIVA2020_1-1692261038479.png2282×1516 566 KB

Any help? My preview link is: https://cskm2aneafljjnov-26608304175.shopifypreview.com

2

Hi,

We need to change the option in the slider setting on js code

3

@SIVA2020

Have to change js code for width.

4

Where can I do that?

5

Where can I do this?

6

Hi, I guess you must change js of your theme code to do that, not change HTML or CSS code.

7

Thanks, where do I do that?

8

You can try to find and edit script related to your product slider in theme.js

9

I found this code but when I change numbers for SlidesToShow, it still doesn’t change anything. Any help?

SIVA2020_0-1692263692789.png
SIVA2020_0-1692263692789.png2002×766 82.2 KB