スライダー(slick活用)
function.phpへ以下の設定を行う
358行目~377行目のコメントアウトを削除して、各JS・CSSファイルを読み込んで下さい。
slickの構成ファイルはCDNから引っ張ってきてるので、テーマファイル内(自サーバー内)にはありません。
必要に応じて設置し直して下さい。
1
グリッドカラムブロックや、投稿リストブロックを配置する。
親要素の中に共通の子要素が複数個並ぶようなDOMなら、なんでも大丈夫です。
今回は最新ニュースをslickスライダーにしてみます。
その際にClass名を何かしら設定して下さい。
2
my_slider.jsにてslickの宣言設定を行う
2で決めた .my_slider
を13行目に入力するのをお忘れなく!
3
完了
とりあえず、これで動きます。
配置やサイズ、ボタンなどの装飾はcssで行って下さい。
4
使用例
このサンプルページではファイルをwp_contents内で読み込んでます。
通常はheader内で正しく読み込むので試してみて下さい。
補足事項
標準データでは、すぐ使えるようにした上で、無駄な外部ファイルの読み込みリクエストを行わないようにコメントアウトしています。
案件ごとに必要に応じて動かして下さい。
slickの使い方は色んな人が解説しているので、詳しいことはおまかせします。
多分デザイナーさんでも勝手にやってくれます。