WordPressで画像をスライダー表示するプラグインは、WP Slider Pluginを使用していますが、画像がズレて表示される不具合が発生しました。

WP Slider Pluginの正常サンプル

上記がWP Slider Pluginのサンプルです。

このプラグインは、ヘッダー画像にも使用できますし、個別のページにも画像スライダーが使用できるため、非常に使い勝手の良いプラグインです。
しかも、スマホにも対応していますので、おすすめのプラグインです。

WP Slider Pluginの画像がずれて表示されるサンプル

上記の画像がWP Slider Pluginで画像がずれて表示される様子です。

この現象で1時間強、はまってしまいました。

WP Slider Pluginの画像がずれて表示される原因と対策

WP Slider Pluginの画像がずれて表示される原因は、以下のCSSでした。

ul {
    margin-left: 40px;
}

40px分右にずれていたわけです。

対策は、以下のコードをテーマのCSSへ追加しました。

ul.slides{
	margin: 0;
}

これで、無事 画像がずれることなく表示されるはずです。