ヘッダー

"ヘッダー記事スライドショー"の設定方法【ヘッダー画像その3】

2021年2月17日

AFFINGERのヘッダーを0から最短、最速で初期設定する!」ではAFFINGERに標準装備されたすべてのヘッダーデザインについて紹介しました。ここではその中の"ヘッダー記事スライドショー"の設定方法をご紹介します。

難易度:易しい・・・設定画面でポチポチするだけ

完成系はこんな感じです。

\ 記事スライドショー(スライド) /

ヘッダー記事スライドショー(スライド)

\ 記事スライドショー(フェードイン・アウト) /

ヘッダー記事スライドショー(フェードイン・アウト)

[PR]AFFINGERで使う画像はCanvaで作るのがおすすめ!
超ラク!超おしゃれ!

画像編集サービス
  • こんなに使えて基本利用料無料!
  • おしゃれなテンプレートが豊富!
  • アプリ版のダウンロードも無料!

Canvaの紹介記事へ

ヘッダー記事スライドショーの設定方法

それでは"ヘッダー記事スライドショー"を設定していきましょう。前提としてアイキャッチ入りの記事を公開していることが条件です。

表示する"カテゴリID"を決める

ヘッダーに表示するカテゴリを決めます(残念ながら記事単位で表示はできないようです)。WordPressの"カテゴリー"ページへ移動します。

【ダッシュボード】→【投稿】→【カテゴリー】

ヘッダーに表示するカテゴリを決めてその"ID"をメモしてください。赤枠で囲った部分が"ID"です。

WordPressカテゴリIDの確認方法

記事スライド機能をオンにする

記事スライドの設定をオンにします。設定場所はこちらです。

【ダッシュボード】→【AFFINGER管理】→【ヘッダー】 > "記事スライドショー設定"

AFFINGER6:記事スライドショー設定画面、主要な設定

まず"ヘッダーに記事をスライドショーで表示する"にチェックを入れましょう。

次に、"表示するカテゴリID"の欄に先ほど確認した"カテゴリID"の数字を入力します。

最後に"Save"ボタンを押して終了です。これで記事スライドショーが設置されているはずです。サイトに行って記事スライドショーが反映されているか確認してください。

表示されない場合:入力した"カテゴリID"が存在していない可能性があります。もう一度"カテゴリー"画面からカテゴリIDを確認してください。

各種設定

最後にお好みでスライドの表示方法を調節しましょう。

AFFINGER6:記事スライドショー設定画面、細かい設定

スライドショーの表示方法

スライドの動き方を決めます。上の完成図を参照してください。

  1. フェードイン・アウト
  2. 右から左
  3. 左から右

スライドショーの表示速度

スライドが変わる時間を調節します。単位はミリ秒です。(5000ミリ秒=5秒)

カテゴリリンクを非表示

カテゴリリンク↓を非表示にします。

記事スラードショーのカテゴリリンク

投稿日を非表示

投稿日↓が非表示になります。

記事スライドショーの投稿日

スライドショーの矢印アイコンを非表示にする

矢印↓が非表示になります。

記事スライドショーの矢印

横並びにする

次に表示される画像が横に待機するようになります。

記事スライドショー:横並びではない状態
横並びではない状態
記事スライドショー:横並びの状態
横並びの状態

\ 詳しくはこちら /


以上、"ヘッダー記事スライドショー"の設定方法でした。次はロゴ部分の設定を行いましょう。

NEXT:ロゴ部分の設定はこちら

AFFINGERを購入する

詳細はこちら

-ヘッダー
-