AFFINGER6(アフィンガー6)では設定をするだけで簡単にサムネイルスライドショーを表示させることが出来ます。
ヘッダー画像エリアに表示できる"画像スライドショー"・"記事スライドショー"とは違ってこの"サムネイルスライドショー"はヘッダー画像下ウィジェットエリア(ヘッダー画像エリアの下)に表示されます。
\サムネイルスライドショーを設置した画像/
![サムネイルスライドショーの画像](https://carefree-find.com/wp-content/uploads/2023/03/20230317_211932.gif)
スライドショーを表示させるための設定項目
ダッシュボードより"サムネイルスライドショー"まで移動します。設定は主に5つです。
- 表示場所
- カテゴリIDの選択
- デバイス毎の表示数
- ループさせる記事最大値
- 記事表示の優先順位
![サムネイルスライドショーの設定画面](https://carefree-find.com/wp-content/uploads/2023/03/10fe247e05fe51ae065d4af2e93d9ac8-1.webp)
サムネイルスライドショーの有効化と表示させる場所
![サムネイルスライドショー表示の場所設定](https://carefree-find.com/wp-content/uploads/2023/03/eb3a789c9db5004b79b72bf94745ac1f.webp)
表示は"フロントページ"と"全ページ"の2択になっていてどちらかを選択(チェック)することで有効化されます。
フロントページとはいわゆるTOPページのことで、全ページとは全ての記事に、ということになります。どこにも表示したくない場合は"無効"を選択しておきましょう。
カテゴリIDを選択する
![サムネイルスライドショーカテゴリID設定](https://carefree-find.com/wp-content/uploads/2023/03/c3aec62d3a8062872a85856d06f4cbdc-1.webp)
サムネイルスライドショーの記事はカテゴリID単位で設定します。表示させたい記事が複数あってそれぞれ違うカテゴリに属する場合はID番号を半角「カンマ」で区切ってください。
全てのIDを対象にしたい場合はデフォルト(空白)のままにしておきます。
デバイス毎の記事表示枚数を設定
![デバイス毎の表示設定](https://carefree-find.com/wp-content/uploads/2023/03/76b8a26869366010c8840cb539b0edef.webp)
3つの数字を半角「カンマ」区切りで入力します。数字は、左 >中 >右 になるように5~1で設定します。
上記画像の「5,3,1」の場合の表示枚数は、PC(960px以上)=5記事、タブレット(959~600px)=3記事、スマホ(599px以下)=1記事ということになります。
取得記事数の最大値の設定
![取得記事数の設定画像](https://carefree-find.com/wp-content/uploads/2023/03/120618e642fe452bb76d25b2ec582e97.webp)
取得記事数とはスライドさせる記事枚数の上限のことです。例えばデバイスがPCで表示枚数が「5,3,1」、取得記事数に「8」を入力した場合、優先された順番で5記事を表示しながら8記事表示後にループになります。
記事表示の優先順位を決める
![優先順位の設定画像](https://carefree-find.com/wp-content/uploads/2023/03/7ae4f4866d93a9eee70bf5da006e9fe3.webp)
記事表示の優先順位は基準にするものを次の「ID・投稿日・更新日・ランダム」から決めて、それを昇順(古い順)にするか降順(新しい順)にするかを設定します。
例えば、"投稿日"と"降順"を選んだ場合は、「投稿日の新しいものから順番に」スライドすることになります。
その他設定
![サムネイルスライドショー設定項目画面②](https://carefree-find.com/wp-content/uploads/2023/03/fa07280b53487b7ee2fe08113283a7f2.webp)
ここでの設定はスライドショーを表示させるための必須項目ではありません。お好みに合わして設定しましょう。
\画像 + テキスト/
![画像とテキストを表示したサムネイル](https://carefree-find.com/wp-content/uploads/2023/03/91f731dc65db1ed59a6ee16562d37914-1.webp)
\画像を角丸にする/
![丸角にしたサムネイル](https://carefree-find.com/wp-content/uploads/2023/03/8be5f79654028c19289462d7b3884522-1.webp)
\画像のみ/
![画像のみを表示したサムネイル](https://carefree-find.com/wp-content/uploads/2023/03/29de49d4452f9a72e21d1e9b63c0377e.webp)
\画像に影を付ける/
![影を付けたサムネイル](https://carefree-find.com/wp-content/uploads/2023/03/3f2c7667e980419e7f8595e47e8464a0.webp)
以上、サムネイルスライドショーの設定方法でした。