slickをCDNで使う【お手軽】

slickのファイルをCDNで読み込む

slickを使用するために必要なファイルは、すべてCDNで読み込むことができます

以下でjsDelivrとCloudflare(cdnjs)の2つのCDNを紹介します。

memo
2021年3月時点での最新のバージョン(jQuery3.6.0, slick1.8.1)を掲載しています

slickをjsDelivrのCDNで使う

jsDelivrのCDNです。slickの公式サイトでもjsDelivrのCDNが紹介されています。

<!-- slickのCSS -->
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css">
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css">
<!-- jQuery -->
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>

<!-- slickのJavaScript -->
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>

slickをCloudflare(cdnjs)のCDNで使う

Cloudflareが運営するcdnjsのCDNです。

<!-- slickのCSS -->
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.css">
<!-- jQuery -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

<!-- slickのJavaScript -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js"></script>