MENU
CLOSE
システム Edit : 2020.07.30 Update : 2024.11.07
WordPressサイトでSlick Sliderの動きがおかしい時に確認する事

WordPressサイトでSlick Sliderの動きがおかしい時に確認する事

先日Wordpressを使ったサイトの中でSlickを使ってスライドを作ったときに、今まで起きたことがない挙動になりました。
Slick自体は機能しているのですが、PCのブラウザで画面を広げたり縮めたりした際に、レスポンシブにならないという事象です。
 

WPで読み込まれているJqueryとあとから読み込んだJqueryがバッティングしていた

結論からいうと私のサイトでは、Jqueryが2つ読みこまれた状態になっており、解決した方法は下記です。
・新たに読み込んだJqueryは削除
・WPでもとからよみこまれていたJqueryを使用
・Slick箇所の$(function(){ … }の書き出しを以下に変更


こちら↓の参考にしたサイトにも記述があるように、そもそもWordpressでJqueryを動かすには一工夫が必要なようですが、
jQueryで動くslick.jsが動作しない理由はflexboxが理由かも……?」 私の場合、Wordpress用の元から読み込まれていたJqueryをオフったり、$をすべてJqueryに置き換えてみてもダメだったので、上記の記述になりました。
   

KOHIMOTO LABO

WebプロダウションKOHIMOTO Inc.が発信を通して成長していくためのラボ🧪 IT企業出身。世界中の人へ発信できるWebサイトを通じて、社会がより良い方向へアップデートしていく為に日々学び、技術を生かしていきます。