本日はWordPress（ワードプレス ）初級編、Topページに投稿済みブログ記事をスライドショー形式で設定する方法を解説します。
方法は様々ありますが私はせっかくの有料テーマ AFFINGER5を使っていますので、AFFINGER5の機能を使って設定する方法を記載します。
まずはじめにWordPress（ワードプレス）初心者の私がいきなり有料テーマ AFFINGER5を選んだのか、こちらの記事で触れています。
-
-
ワードプレス初心者向け守破離ブログ「テーマを決めてオリジナルサイトの基礎を作ろう！」
多趣味なPANDA多趣味なPANDAが彩る地球へようこそ！ GAFAで働く一般のsalarymanが、知識0から日々勉強しoutputの場を自ら手がけるblogです。 この記事について ...
続きを見る
✔︎ Topページに投稿済みブログ記事をスライドショー設定しサイトをデザインする方法
✔︎ 見て欲しいブログ記事をTopページ上部に固定するのでインパクトのある露出ができる！
サイトデザインを考えていくと、実装したいイメージがたくさん湧いてくると思います。今日は絶対に目にしたことがある「サイトTopページにインパクトのある画像がスライドショー形式でいくつも掲載されている」動きのあるページを作る為の基本編、スライドショーの設定について解説していきます。
初級編 投稿済みブログ記事をスライドショー形式で設定しよう！
早速ですがブログ記事のスライドショー形式でサイトの掲載するための設定方法を説明していきます。
ちなみに今の私のサイトTopはこんな感じです！
実は以下の記事でヘッダー画像の設定方法を解説したばかりなのですが、やっぱり満足のいくデザインではなかったので改良しちゃいます！
-
-
ワードプレス初心者向け守破離ブログ「サイトTopに画像を設定し自分だけのデザインを作り込もう！」
本日はWordPress（ワードプレス ）初級編、Topページに画像を挿入してHPのような素敵なデザインにする作業方法を解説します。 この記事について ✔︎ 超初級編 ✔︎ ...
続きを見る
設定した画像はイメージ通りで大好きな雰囲気なのですが、おすすめ記事としてスライドショーをヘッダー部分に設定したい理由は、
１）大きなインパクトある画像を用いて自分が訴求したい分野を複数表現したい
２）画像に文字入れ（タイトルですね）＆ リンクをつけて別ページに飛ばしたい
これだけだとヘッダー画像をスライドショー設定しリンクつける工夫をすれば実現可能なようですが、
３）おすすめ投稿スライドショー設定のデザインが好みにビシッとハマり、かつ今後も自由に差替えを検討していきたい
これが今回、ヘッダー画像設定をやめ投稿済みブログ記事をスライドショー形式で複数枚の画像を用いてTopページに掲載するという選択を決めた理由です。
投稿済みブログ記事をスライドショー設定し動きのあるデザインを実装する方法
私のサイトを参考に、キャプチャを使ってご説明していきます。所要時間は数分！やってみましょう。
事前に準備するもの
必要なものはサイトTopページに掲載したいブログ記事を選定しておくだけ！
投稿済みおすすめブログのスライドショー設定
それではササっといきます！
今回私は3つの投稿記事をスライドショー設定することにしました。
スライドショー形式でTopページに掲載するブログ記事のカテゴリーIDを確認する
投稿一覧からカテゴリIDをチェックしましょう。
そうです。スライドショー設定にはカテゴリーIDを指定して引っ張ってきます。つまり指定カテゴリに該当するIDのブログは全て掲載されますので、Topページにスライドショー掲載したい投稿記事のカテゴリーIDは工夫してつけてあげて下さい。
AFFINGER5管理 > ヘッダーで設定
この画面で簡単に設定が可能なんです！
記事スライドショーの設定
ヘッダー管理の中にある記事スライドショーの設定にて、「ヘッダーに記事をスライドショーで表示するに✔️しましょう。
スライドショー表示させたい記事のカテゴリーIDを入力
冒頭でお伝えした通り今回私は3つの記事を表示させます。カテゴリーIDを確認したところ「19,20,21」のIDが確認できました。
表示順位は記事作成美が新しいものから優先されるようです。ここはちょっと残念！（調べたらきっと表示順のカスタマイズもできるはず・・）
さらに今回記事の投稿日は表示させたくないので、「投稿日を非表示」にチェックを入れます。
また、スライドショーの切り替えスピードももちろん自由に設定可能です。スライドショーの表示速度に数字を入れて設定してみて下さい。数字は小さい方が切り替えスピードが速くなります。
たったこれだけで完成！！
これで完成です♩どうですか？メイン画像一枚を設定していた時よりもさらにリッチなデザインになったと思いませんか？
キャプチャは2パターンの静止画ですが、スライドショーなので自動で今回設定した3つのおすすめブログ記事が大きく表示されるようになりました。
私はこのスライドショーをクリックしてもらって、ぜひ見て欲しいブログ記事に飛べるように設定をしました。
まとめ
今回はサイトTopページに投稿済みおすすめブログ記事をスライドショー形式で表示させる方法を、AFFINGER5の機能を使って実装して見ました。
✔︎ AFFINGER5のデフォルト機能でらくらく設定
✔︎ 作業時間はほんの数分
✔︎ なによりも自分が好きなサイトデザインに仕上がるので楽しい！
改めて参考までに、今回利用した有料テーマ さらに様々な機能が完備されプロからの利用実績が豊富な「WING（AFFINGER5」ぜひチェック！！
WordPress初心者の私は、本格的に継続するためのモチベーションのため。そして、絶対に後悔しないテーマ選びのために本当に多くの情報を総合的に判断して選び抜いたテーマです。
初心者向けにテーマ選びとAFFINGER5の初期設定について書いた記事もぜひチェックしてみて下さい！
-
-
ワードプレス初心者向け守破離ブログ「テーマを決めてオリジナルサイトの基礎を作ろう！」
多趣味なPANDA多趣味なPANDAが彩る地球へようこそ！ GAFAで働く一般のsalarymanが、知識0から日々勉強しoutputの場を自ら手がけるblogです。 この記事について ...
続きを見る
本日は以上です。ありがとうございました！