Add automatic slider / carousel

Product / Card Automatic Carousel / Slider for Most of Shopify Theme

How to see the code

1. Please log in/create an account first. This is to ensure that all purchases are connected to an account and can be viewed on different devices.

2. Purchase the code using the "purchase box" on the specific page of the desired code.

3. After the purchase, please refresh the page.

One Time Purchase!

$49.99
$49.99
Only
Please refresh page after a purchase

Please note that the code may not be compatible with any currently installed apps.

Compatibility: All Shopify themes (Style might vary)

I was able to write an autoplay slider / carousel using scroll. This works with most of Shopify themes (work best in Dawn and Debut theme). 

In this tutorial, we are creating a slider or carousel for a card or product card. I did provide an option to choose between the two. I also included an autoplay option, of course. You can choose from 3 to 7 products per slide, or 3 - 5 cards per slide.

I also added an options for dots and number counter. Yes, the counters work.

Check DEMO store here💻. Password: made4uo

 To start:

1. Go to Admin Shopify store > Themes > Actions > Edit Code
2. In Section folder, create a new section, and name it "universal-carousel", then paste the code below.

<

3. We need the file that contains the javascript. Under the asset folder, open the "theme.js" or "global.js" file and paste the code below.

<

That is it. Let me know if you have questions (",)

Updated 3/18/22: You can add multiple of this section in one page. 

Copied!
Voltar para o blogue

1 comentário

Thanks for great video. How can I set minimum card number to 1 ?

Tom

Deixe um comentário