The demo pages already include the following code. These steps are only necessary if you are building a page from scratch. Remove these references if you are not using this plugin to improve page load times.
1. Link the CSS right before the head closing tag of your page, where you see the other library scripts. This line should be inserted before main.css
.
<!-- Slick Slider Stylesheet -->
<link rel="stylesheet" href="plugins/slick/slick.min.css"/>
2.Copy the script tag below and paste in the foot of your page. Add this where you see the other library scripts. This line should be inserted after jquery.min.js and before custom.js.
<!-- Slick Slider Js -->
<script type="text/javascript" src="plugins/slick/slick.min.js"></script>
<!-- Slick slider CSS cdn-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.css"/>
<!-- Slick slider js cdn-->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.js"></script>
Basic Usage
The Basic Slick HTML Structure
<div class="your-class">
<div>your content</div>
<div>your content</div>
<div>your content </div>
</div>
The Basic Slick js activation
$(document).ready(function(){
$('.your-class').slick({
setting-name: setting-value
});
});
Consult the Slick Documentation for more details.