こんにちはジローです。
今回は久しぶりに『AFFINGER5』の設定方法についての記事になります。
内容としては、
・記事スライドショーの設定方法
・簡単なカスタマイズ
になります。
特に今回は、ヘッダー画像上に設定するのではなく、
当サイトのようにヘッダー画像下に設定する方法を紹介いたします！
是非参考にしてみてください（＾_＾）
Contents
記事スライドショーの設定方法
冒頭にも書いた通り、
今回はヘッダー画像下へ記事スライドショーを設定する手順となります。(画像赤枠部分)
手順① 下記のコードをコピー
[frontonly][st-catgroup cat="" page="10" order="desc" orderby="id" child="on" slide="on" slides_to_show="3,3,2" slide_date="" slide_more="" fullsize_type="text"][/frontonly]
手順② ウィジェット編集画面でカスタムHTMLを準備
ダッシュボードより、『外観』→ 『ウィジェット』でウィジェット編集画面を開く。
その後『ヘッダー画像エリア下のウィジェット』に『カスタムHTML』を追加
＊「画面左の利用できるウィジェット」から『カスタムHTML』を左クリックしながら持ってきてください。
手順③ 『カスタムHTML』内にコピーしたコードを貼り付け
先ほど『ヘッダー画像エリア下のウィジェット』内に持ってきた『カスタムHTML』にコードを貼り付け
→ その後、『完了』を押して設定終了になります
以上の手順でヘッダー下に記事スライドショーが作成されたかと思います。
是非ご自身のブログで確認してみてください（＾ω＾）
簡単なカスタム方法
今回ご紹介した『記事スライドショー』の設定について
コード内の一部を変えることでスライドショーの見た目をカスタマイズすることができます（＾ω＾）
中でもよく使用する引数についてまとめてみましたので、
是非自分の好みの見た目に変えてみてください！
st-catgroup cat=""：表示する記事のカテゴリ指定
→ ””内に表示させたいカテゴリIDを入力することで指定できます。((例 "1,2"
page="" ：表示する記事数
→ ””内に表示させてい記事数を入力してください
order=""：表示させる記事の条件
→ ”desc”なら新しい順、”asc”であれば古い順
slide=""：スライドさせるかどうか
→ ”on”"off"から選択
slide_date=""：日付を表示させるかどうか
→ ”on”"off"から選択
slide_more=""：スライドショー下に表示させる文字を変更できる
→ ””内に好みの言葉を入れる
fullsize_type=""：表示させる情報を選択
→ ”text”は「画像＋テキスト」”card”は「画像のみ」””は全て表示
また、手順解説内で記載したコードには入れていませんでしたが
slide_center=""：モバイル端末での表示をさせるかどうか
→ ”on”"off"から選択
こちらも使いたい方は多くいるかと思いますので記載しておきます（＾ω＾）
まとめ
今回は、AFFINGER5にて記事スライドショーをヘッダー画像下に設定する方法をご紹介いたしました。
簡単に設定できますので
是非皆様も自分の好みに設定してみてください( ˘ω˘ )
ここまで読んでいただき誠にありがとうございました！