このスライダーを使うときの注意事項
- すべてのスライダーに同じ文言を設定してください。
文字数が多いスライドと少ないスライドが混在すると、表示がくずれることがあります。特定の画面幅で正常に表示されても、画面幅が変わると正常に表示されない可能性があります。 - 同じデザインで扱いやすいスライダーを別途用意してあります。
PC・タブレット・モバイルで画像を出し分ける必要がない場合は、カバーブロックを使った こちらのデモサイト のスライダーをおすすめします。 - デモ用に PC 用だけスライダーアイテムの背景画像を設定してあります。
本番サイトで使うときにはタブレット用・モバイル用も用意して設定してください。
補足情報
以下の2つのスライダーはまったく同じものです。
- https://wsp-demo09.hp1.work/slider-item-background-round/
- https://wsp-demo09.hp1.work/slider-item-background-square/
スライダーブロックに 追加 CSS クラス offset-slider-1b
を追加すると、デザインが以下のように変わります。
- 文字の背景のグラデーションが 白 から キーカラーに変わり、文字色が白になる。
- 画像がピン角になる。
このサイトは、WordPress スターターパックで作成しました。