How to add Slick slider in Magento 2 Custom theme

Follow these easy step for adding Slick slider in Magento 2 Custom theme

1.) Download the Slick library

2.) Include css files in theme .copy slick.less and slick-theme.less to the /web/css/source folder. Also add both files to /web/css/source/_extend.less.

@import "slick.less";

@import "slick-theme.less";

3.) update the theme's requirejs-config.js file.

theme_path/requirejs-config.js

var config = {
 paths: {
     slick: 'js/slick.min'
 },
 shim: {
     slick: {
         deps: ['jquery']
     }
   }
};

4.) After these steps, clear the cache and perform a static content deployment.

Now you can use the slider in any phtml file by initializing the slider

    
1st Product
    
2nd Product
    
3rd Product
    
4th Product
    
5th Product
    
6th Product
    
7th Product
    
8th Product

Please contact us for Magento 2 theme customizations and Magento 2 frontend development Contact .