ママフリーランスwebデザイナーが
『webデザインについて』
情報発信するブログ

WordPressでslickスライダーの下に開く余白はプラグインSmushが原因でした!!

スライダーslickの余白

スライダーのjQueryプラグイン、slickの下にできる謎の余白についてです!

この記事を書いている人

Marie

Marie

  • フリーランスwebデザイナー&講師
  • 2児ママ
  • 制作会社・インハウスデザイナーを経験し独立
  • オンラインwebデザイン教室ちいウェブ運営
  • 仕事の合間の息抜きに植物を育てています♡
もっと詳しくみる

ちなみにslickとは、超簡単にスライダーを実装できるjQueryのプラグインです。

(このプラグインは、WordPressのプラグインという意味ではありません。)

レスポンシブにも対応していて、簡単に使えるのでお気に入りです。

このサイトでも、slickを使用してトップページにスライドを作成していますが、ある時から、スライドとドットの間に余白ができてしまいました。

これ何だろうなーって思っていて、原因が分からなかったんです。困った女性

スライド部分(li)は、高さを持っていないのですが、その上にできるdiv要素slick-trackが急に高さを持っていました。

原因が分からなかった時は、WordPressプラグインの干渉を疑いますので、怪しいプラグインを1つ1つ停止して、改善されるか見てみます。

画像系のプラグインだと思ったので、画像に関するプラグインを停止してみて、改善されるか見てみると、原因が「Smush」であると分かりました。

Smushは画像を最適化してくれるプラグインです。

とりあえずSmushを無効化しました。

Smushの何が干渉しているかまでは突き止めていません。

追加で情報があればまた追記させていただきますね。わたし

コメントする

CAPTCHA


  • >
  • webデザイン
  • >
  • WordPress
  • >
  • WordPressでslickスライダーの下に開く余白はプラグインSmushが原因でした!!

関連記事

ページトップへ