THE THORでカルーセルスライダーを設定したけど表示されない
- THE THORのカルーセルスライダーとは
- THE THORのカルーセルスライダーの設定方法
- THE THORのカルーセルスライダーが表示されない対処法
- THE THORでカルーセルスライダーを設定する時の注意点
✔ 記事の信頼性
今回は、THE THOR(ザ・トール)でカルーセルスライダーを設定する方法と、うまく表示されない時の対処法についてご紹介します。
THE THORのカルーセルスライダーとは?
THE THOR(ザ・トール)のカルーセルスライダーとは、TOPページのこの部分です。
カルーセルスライダーは記事が自動で横にスライドするため、動くおしゃれなサイトにできます。
メインビジュアルの下に設定できるので、読んでほしい記事だけをピックアップして設定することも可能です。
他のテーマで設定すると少し面倒ですが、THE THOR(ザ・トール)であれば簡単なボタンだけでカルーセルスライダーを設定できちゃいます。
THE THOR(ザ・トール)でカルーセルスライダーを設置するだけで、プロ感が一気に高まりますよ。
✔ カルーセルスライダーの設定手順
- 外観→カスタマイズ
- TOPページ設定
- カルーセルスライダー
- 非表示→表示するに切り替え
これでOKです。
それでは、個別に設定していきましょう。
THE THORのカルーセルスライダーの設定方法
THE THOR(ザ・トール)のカルーセルスライダーの設定方法をご紹介します。
カルーセルスライダーの詳細設定は4つあります。
✔ 詳細設定
- 画像の比率を決める
- 記事を指定する
- 表示件数を指定する
- 表示条件を絞る
それでは、個別に設定していきましょう。
THE THORのカルーセルスライダー設定①:画像の比率を決める
THE THORのカルーセルスライダー設定①:画像の比率を決めましょう。
カルーセルスライダーの画像は全部で3種類あります。
- 16:9
- 4:3
- 1:1
自分のブログのアイキャッチ画像のタテヨコ比率に合わせてカルーセルスライダーを設定しましょう。
✔ 16:9
✔ 4:3
✔ 1:1
THE THORのカルーセルスライダーで画像比率を変える手順はこちら。
- 外観→カスタマイズ
- TOPページ設定
- カルーセルスライダー設定
- 画像アスペクト比を選択
デフォルトで「16:9」が設定されているので、もし変えたければ「画像アスペクト比」で選ぶことができますよ。
THE THORのカルーセルスライダー設定②:記事を指定する
THE THORのカルーセルスライダー設定②:記事を指定しましょう。
THE THORのカルーセルスライダーは、デフォルトだとランダムで記事が表示されます。
とはいえ、読んでほしい記事だけを指定することができるため、その手順を解説します。
✔ カルーセルスライダーで記事を指定する手順
- 記事のIDを確認する
- カルーセルスライダーを表示
- IDを入力する
記事のIDは、サイドバーの「投稿一覧」から確認できます。
「指定するIDを入力する」に、先程のIDを入力しましょう。
IDとIDの間に「カンマ( , )」を入れることで、複数の記事を指定することができます。
THE THORのカルーセルスライダーは、メインビジュアルのすぐ下に設置されるため、あなたが特に読んでほしい記事を指定するのがベストです。
THE THORのカルーセルスライダー設定③:表示件数を指定する
THE THORのカルーセルスライダー設定③:表示件数を指定しましょう。
カルーセルスライダーのスライドを、5~10記事(※)まで指定することができます。
✔ カルーセルスライダーで表示件数を指定する手順
- カルーセルスライダーを表示
- 表示件数を指定
こんな感じで簡単に設定できるので、表示させたい記事数を入力すればOKです。
とはいえ、カルーセルスライダーをじっくり見る人はあまりいないので、5記事くらいがちょうど良いかなと思います。
THE THORのカルーセルスライダー設定④:表示条件を絞る
THE THORのカルーセルスライダー設定④:表示条件を絞りましょう。
表示条件とはこんな感じ。
- 無し
- 指定した投稿を表示
- 指定した投稿以外を表示
- 指定したカテゴリを表示
- 指定したカテゴリ以外を表示
デフォルトでは「無し」になっていて、ぶっちゃけそんなに使わないかなと思う機能です。
例えば、表示させたくない記事が少しあって、それ以外は全て表示させたいという場合には、「指定した記事以外を表示」が使えますね。
個人的には、そこまで必要ないかなと思う部分です。
THE THORのカルーセルスライダーが表示されないときの対処法
THE THORのカルーセルスライダーが表示されないときの対処法を解説します。
正しく設定をしたのにも関わらず、うまく表示されないといった現象が起こるようです。
THE THORのカルーセルスライダーが表示されないのは、相性の悪いプラグインが影響を与えるようです。
✔ THE THORと相性の悪いプラグイン
- TinyMCE Advansed
- JetPack
- SiteGuard WP Plugin
これらはTHE THORには必要のないプラグインなので、もし入っている場合は使用を停止しましょう。
また、こちらのプラグインが悪さをする場合もあります。
もしこのプラグインを入れていて、カルーセルスライダーが表示されない場合は1度停止してみてください。
とはいえ、先ほども言いましたが、カルーセルスライダーはサイトの表示速度を遅くしてしまう原因にもなるので、無理して設定する必要はないかなと思います。
THE THORのカルーセルスライダーを設定する時の注意点
THE THOR(ザ・トール)でカルーセルスライダーを設定する時に、注意点があります。
それは、「サイトスピードが遅くなる可能性がある」ことです。
TOPページでスライドショーのような動きが出る分、表示速度はどうしても遅くなります。
とはいえ、カルーセルスライダーはカッコ良いサイトができるので、設定前と後でサイトスピートを比べてみて、影響がなければ設定してもOKです。
カルーセルスライダーに限らず、容量の大きい画像や動画もサイトスピードを遅らせる原因になるため、設定する際は注意しましょう。
THE THORのカルーセルスライダーの設定方法:まとめ
THE THOR(ザ・トール)でカルーセルスライダーの設定方法について解説しました。
おさらいします。
✔ カルーセルスライダーの基本設定
- 外観→カスタマイズ
- TOPページ設定
- カルーセルスライダー
- 非表示→表示するに切り替え
✔ カルーセルスライダーの詳細設定
- 画像の比率を決める
- 記事を指定する
- 表示件数を指定する
- 表示条件を絞る
簡単ですよね。
カルーセルスライダーは、おしゃれでプロ感を演出できる設定です。
THE THOR(ザ・トール)であれば、簡単に設定できちゃうのでめちゃくちゃ便利なんですよね。