slick導入方法(子テーマ反映)

1、下記URLから右上の「get it now」よりダウンロード

https://kenwheeler.github.io/slick/

2、ダウンロードしたZIPファイルを解凍し、その中の「slick」フォルダーをそのままアップロード

→子テーマの直下に配置

3、子テーマのheader.php内のhead部分に下記を記載。



<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<!-- slick -->
<link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_directory_uri(); ?>/slick/slick.css" media="screen" />
<link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_directory_uri(); ?>/slick/slick-theme.css" media="screen" />
<script src="<?php echo get_stylesheet_directory_uri(); ?>/slick/slick.min.js"></script>

※親テーマの場合は、stylesheetをtemplateに変更する。



<!-- slick -->
<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/slick/slick.css" media="screen" />
<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/slick/slick-theme.css" media="screen" />
<script src="<?php echo get_template_directory_uri(); ?>/slick/slick.min.js"></script>

5、子テーマのfooter.php内の</body>直前に記載。


<!-- slick js -->
<script src=""<?php echo get_stylesheet_directory_uri(); ?>/slick/slick.min.js""></script>
<!-- /slick js -->