Как подключил
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css" />
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="js/main.js">
<title>CreateX</title>
</head>
Структура
<code lang="html">
<div class="team__slide">
<div class="team">
<div class="container">
<div class="team__slider">
<div class="team__image--box">
<div class="team__image">
<img class="team__image--item" src="images/teachers/7.png" alt="">
</div>
<div class="team__socials">
<a class="team__socials--link" href="#">
<img class="team__socials--item" src="images/icons/fb.svg" alt="">
<img class="team__socials--item" src="images/icons/inst.svg" alt="">
<img class="team__socials--item" src="images/icons/li.svg" alt="">
</a>
</div>
<div class="team__info">
<div class="team__name">Dianne Russell</div>
<div class="team__position">Founder and CEO</div>
</div>
</div>
</div>
</div>
</div>
</code>
Как подключил вне тега body
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
js
$(function () {
$('.team__slide').slick({
arrows: false,
slidesToShow: 4,
infinite: true,
draggable: false,
waitForAnimate: false,
responsive:
[
{
breakpoint: 1100,
settings: {
slidesToShow: 3,
},
},
{
breakpoint: 750,
settings: {
slidesToShow: 2,
},
},
{
breakpoint: 550,
settings: {
slidesToShow: 1,
draggable: true,
},
},
]
})
}) 
Простой
Простой
