本日は、仕事をしていた中でなかなか便利だなと思ったプラグインの紹介です。その名も「Smart Slider3」！このプラグインを知っていて、使い方だけ確認したい人は３．に進んでください！
目次
- スライダーとは？
- Smart Slider3とは？
- Smart Slider3設定方法
- まとめ
スライダーとは？
いろんなホームページを見ていると、「何枚かの大きな画像が横にスライドする」トップベージを見たことがあると思います。
この要素は一般的によく「スライダー」と言われます。ホームページを訪れた人にたいして、トップベージに印象づけたいコンテンツが複数あるときによく使われますね。
このスライダーをホームページに実装するには、大きく3つの方法があると思っています！
１．自分でコーディングする。
２．使用しているテーマについている機能を利用する。
３．プラグインで実装する。
1は初心者にはかなり難しいと思いますし、便利なテーマやプラグインがあるのでわざわざやらなくてもいいかなと思います（笑）
2は簡単に実装できることがありますが、自分が使用したいテーマにこの機能が付属してない場合があります。また、機能がついていたとしても、無料テーマだと画像が3枚までなど制限がついていることが多いです。
そこでおすすめの方法は、3の「プラグインを使う」です。プラグインを使用すれば、どんなテーマにでもスライダーを簡単に実装することができます！機能制限付きのものもありますが、これから紹介するプラグインは無料でも機能が十分なので重宝すると思います！
では早速使っていきましょう！
Smart Slider3とは？
スライダーを作成してくれるプラグインです。下の画像のように、右側のボタンを押す、もしくは一定時間たつと、画面外から次の画像が出てきます。今回はトップページのヘッダー画像をスライダーで表示していきたいと思います。このプラグインは英語で諸々書かれていますが、僕が頑張って日本語で解説します。（笑）
Smart Slider3 設定方法
１．新規プロジェクトを作成する。
SmartSlider３を有効化すると、左サイドバーに表示されると思いますので、
「Smart Slider」>「Dashboard」を選択します。
以下のようにダッシュボードが開かれるので、「NEW PROJECT」を選択。
「あんさん、今日は何作りたいん？」
って聞かれますので、左の「新しいプロジェクトを作る」を選びます。
すると、スライダーの基本形を設定する画面に代わります。いったん画像のように設定します。
これでプロジェクトが作成されました。
ここから画像などの選択をしていきます。
２．画像を選ぶ
ではスライダーに表示する画像を設定しましょう！
プロジェクトメニューの「ADD PROJECT」を選択します。
すると、下の画像のような表示に代わります。「Image」を選択します。
すると、メディア一覧画面にとびます。使用したい画像を選びましょう！
選んだあと、こんな風に表示されていればOKです！
３．スライダーを使う。
プロジェクトメニュー画面の、「Shortcode」欄にショートコードがあります。
これをコピーします。
このコードを、スライダーを追加したい固定ページのブロックエディタに記入します。
これで完成！
４．表示確認。
設定した画像です。画像両端の矢印をクリックすると表示が変わりますね！
まとめ
このプラグインはまだまだ機能があります。画像の表示範囲の変更や、画像内に文字を入れたりするなども可能です！詳しい設定方法はまた次回書こうと思います！
みなさまのホームページやイメージがよくなるお手伝いをいたします。
ヘッダー画像、バナー画像、ロゴ、WordPressデザインなどお気軽にご相談ください！
WordPressデザインサービスは以下から承っております。
