THE THORにカルーセルスライダーを設置して、トップページの雰囲気を変えたり見栄え良くするために、「今すぐ設置方法を知りたい！」と考えていませんか？
わたしは動きがあってなんとなくかっこいいから、はじめの頃から設置していましたが、どうやら設置しておいて正解だったみたいです！
というのも、このカルーセルスライダーをうまく使えば、読んでもらいたい過去の記事を意図的に見せたり、回遊率の面で非常に役立つ機能となるのです。
そんな素敵なカルーセルスライダーの設置方法、知りたいですよね？そんなあなたへ、この記事を読むことで、設置完了〜カスタマイズまで、スムーズにその手順を知ることができますよ。
というわけで今回は、THE THORのカルーセルスライダー設置方法〜カスタマイズまで、ていねいに解説していきますね。
THE THORのカルーセルスライダーをくわしく！
THE THORのカルーセルスライダーとは、一体なんなのか？よくわからない方のために、ここでは簡単に説明していきますね。
まず「カルーセル」とは、画像などのコンテンツをループしてスライド表示させる手法のことを指し、「スライダー」や「スライドショー」と呼ばれることもあります。
カルーセルスライダーは限られたエリアで、いくつもの画像を読者にアピールするために使われ、読者はページを変えたりスクロールをしなくても、複数の情報を見ることができます。
なお、THE THORのカルーセルスライダーは、TOPページのメインビジュアル下に設置されます↓
- ファーストビューでたくさんの情報を表示することができる
- 縦スクロールを減らし、コンテンツを横列に並べてコンパクトに表示できる
THE THORのカルーセルスライダー設置方法
THE THORのカルーセルスライダーについて理解した上で、さっそく設置方法を解説していきますね。
【THE THOR】カルーセルスライダーの設置手順5ステップ
①WordPressのダッシュボードから「外観」→「 カスタマイズ」へ進みます。
②「TOPページ設定[THE]」→「カルーセルスライダー設定」をクリック。
③「カルーセルスライダーを表示するか選択」を「表示」に変更しましょう。
④「表示条件を選択」を好みのものにしてください。
私は「無し(default)」にしてますが、この設定にするとランダムに記事が表示されますよ！
⑤最後に「公開」ボタンをクリックしておきましょう。
「THE THOR無料サポート」受付中！質問、疑問etc…どんな些細なことでもOK！お問い合わせはこちらからお気軽にどうぞ！
THE THORのカルーセルスライダーをカスタマイズ
THE THORのカルーセルスライダーの設置が済んだら、細かいカスタマイズ項目も用意されていますので、あなた好みに設定してみましょう。
- 表示したい記事をID指定する
- 記事の表示件数を変更する
- 画像アスペクト比を変更する
ではそれぞれ解説していきますね。
①表示したい記事をID指定する
先ほど少し触れましたが、表示条件で「無し(default)」のままであれば、投稿した記事はランダムで表示されますが、それ以外を選択した場合は、「指定するID」を設定できます。
上画面の入力箇所に、投稿かカテゴリのIDを指定して入力しますが、複数ある場合は、「,」で区切って入力していきます。
まず投稿のIDですが、管理画面から「投稿」→「投稿一覧」へ進みましょう。
すると、各記事の右側にIDが記載されているのが確認できます。
次にカテゴリーのIDを確認するには、管理画面の「投稿」→「カテゴリー」を選択しましょう。
カテゴリーのIDは、下画像の赤枠部分で確認できます。
②記事の表示件数を変更する
次に、カルーセルスライダーに表示する記事件数を設定していきますが、カルーセルスライダー設定画面から「表示件数を指定」の項目を変更してください。
試しに下画像のように、「10」を選択すると表示されてる記事は5件ですが、実際にスライドショーされる記事件数は10件となります。
画像のすぐ下の点が10個になっていることで確認できますね。
③画像アスペクト比を変更する
アスペクト比をかんたんに一言で説明すると、縦と横の長さの比率のことをいいます。
例えば、パソコン画面の一般的なアスペクト比率は4：3ですが、16：9ならワイドのようなイメージですね。
設定できるアスペクト比は以下の3パターンになりますが、迷うようならデフォルトの「16：9」でほぼ問題ないでしょう
【16：9(default)】
【4 : 3】
【1 : 1】
「画像アスペクト比を選択」から好みで選択しましょう。
一番下に「アイキャッチ上のカテゴリを非表示にする」という項目もあるよ！
全ての設定を終えたら、「公開」ボタンを押して確認してくださいね。
まとめ
お疲れ様でした！ここまで、THE THORのカルーセルスライダー設置方法〜カスタマイズまで、ていねいに解説してきました。
デザイン面での見た目も良く、カルーセルスライダーがあるだけで、ブログのレベルが上がったような気分も味わえますし、実際にそのような見栄え効果もあるでしょう。
解説してきた通り、設置方法もほとんどクリック操作でかんたんですから、是非設定してみてくださいね。
今回の記事でなにかわからないことはありませんでしたか？質問や相談、感想や雑談などなんでも受け付けているので、どうぞお気軽にメールくださいね↓
