Slick Slider
Sun Mar 03 2024 11:14:02 GMT+0000 (Coordinated Universal Time)
Saved by
@omnixima
#jquery
// Slick Script
function site_styles() {
wp_register_style('slick', 'https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css', array(), false, 'all');
wp_enqueue_style('slick');
wp_register_style('slick-theme', 'https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css', array(), false, 'all');
wp_enqueue_style('slick-theme');
}
add_action('wp_enqueue_scripts', 'site_styles');
// Slick Script
add_action('wp_body_open', function() { ?>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<?php });
***
<script type="text/javascript">
jQuery('.history-timeline').slick({
dots: true,
infinite: false,
speed: 300,
slidesToShow: 3,
slidesToScroll: 3,
responsive: [
{
breakpoint: 1024,
settings: {
slidesToShow: 2,
slidesToScroll: 2
}
},
{
breakpoint: 767,
settings: {
slidesToShow: 1,
slidesToScroll: 1
}
}
// You can unslick at a given breakpoint now by adding:
// settings: "unslick"
// instead of a settings object
]
});
</script>
content_copyCOPY
https://kenwheeler.github.io/slick/
Comments