「スライダー」の使用例【Snow Monkey Blocks】

スライダーの見本
こちらのスライダーは非推奨となっております。非推奨のスライダーは体感的に、複数設置すると表示速度が遅くります(2022/03/20現在)

スライダーブロックは、その名の通り画像をスライドさせるブロックです。

トップページにスライダーを追加したい人や、商品紹介をスライドで見せたいときにおすすめです。

初めてWordPressを触った人も最初に作ってみたいのはスライダーではないでしょうか。

魅力的な画像を美しいスライダーとして表示します。

仕様

設定項目は沢山あります。

幅の設定

マウスを動かしながら、クリックできる場所を探してください。

幅広は標準の幅です。

トップページに最適! 全幅が選択できます。
トップページ画像にする場合は1920px幅にしています。

ドットインジケータを表示する

ドットの表示です。
白がOFF、青がONです。

オシャレですね。スライドが何枚あるか直感的に分かります。

前/次の矢印

矢印ボタンの表示、非表示を設定できます。
設置することで、スライダーだと認識できます。
ボタンを押すことで、次のスライド画像にスライドします。

スライドアニメーション速度

100ミリ秒は1秒です。

自動再生の間隔

自動再生されるまでの時間です。
こちらの単位は(秒)です。

フェードを有効にする

じわ~っと切り替わるやつです。
お客様の要望は多いです。フェードという言葉で通じないことが多いです。

スライダーの方向を右から左に変更

通常は左から右にスライドする機能を、右から左に変更します。

表示するスライド数/スクロールするスライド数

「スライダー」の使用例

例:正方形でスライドさせてみた

設定:スライドアニメーション700ミリ秒、ドットインジケータON,前/次の矢印ONフェードOFF

例:全幅(画像サイズ1920px×500px)、フェード、自動再生3秒

ポイント:写真サイズを合わせる

参考サイトご紹介

この記事を書いた人

山崎 大祐

大阪出身。千葉県松戸市在住。2児の父です。WordPressの構築を60サイト超えました。営業経験を生かしたSEMを得意としております。(企画/デザイン/構築/運営)
すきなもの「赤色・キューブ・コンクリート」