Basic setting AFFINGER

AFFINGER 管理【ヘッダー下 / おすすめ】タブのメニュー設定を完全解説!AFFINGER6

当ページのリンクには広告が含まれています。

34679_affinger6-under-header-recommended-settings-2

こんにちは "osaboo"です。"@osaboo_Bot"

AFFINGER 管理 の「 ヘッダー下 / おすすめ」タブのメニューでできる 詳細設定の内容を初心者さん向けにわかりやすくご紹介します。

AFFINGER 管理の「ヘッダー下 / おすすめ」では、「ヘッダーバナー・サムネイルスライドショー・おすすめ記事一覧」を設定できます。

初心者さん向けに、設定内容がどの箇所に反映されるかをわかりやすく解説します。

この記事では、「ヘッダー下 / おすすめ」のレイアウト設計をスムーズに行うための手助けをします。

こんな方におすすめ!

  • AFFINGER6の初心者さん
  • ヘッダーバナー?
  • サムネイルスライドショー?
  • おすすめ記事一覧?
  • ユーザーの注目を集めるために、ヘッダーの下部におしゃれなアイテムを追加したい

この記事でわかること!

  • AFFINGER 管理:ヘッダー下 / おすすめタブ(ヘッダー下 / おすすめ)の概要
  • ヘッダーバナー
  • サムネイルスライドショー
  • おすすめ記事一覧
  • まとめ

それではご覧ください!

初心者でも安心 コスパ最強の洗練されたWordPressテーマ/

AFFINGER6 購入 ▶︎ 詳しくはこちら

\\『すごいもくじLITE』が付いてくる!限定特典キャンペーン実施中!//

- 少しづつ増え続ける当サイトオリジナル特典付!-

購入方法で迷ったら…こちらで確認【特典付きを購入しよう!】

AFFINGER 管理:ヘッダー下 / おすすめタブ(ヘッダー下 / おすすめ)の概要

この章では、AFFINGER 管理:ヘッダー下 / おすすめタブ(ヘッダー下 / おすすめ)の概要をご紹介します。

『AFFINGER 管理>ヘッダー下 / おすすめ』をクリックします。

AFFINGER 管理:ヘッダーした / おすすめタブ

※ ピンク色の破線部の設定項目を解説します。

※ 本記事の設定では『AFFINGER管理』のメニューを編集します。

ロリポップレンタルサーバーをお使いの方は、ドメインの『WAFの設定』を一時的に無効 にしてください。◀︎『403 Error』が出た場合。

AFFINGER6&ロリポップ!レンタルサーバー『403 Error』が出た時の対処方法!
AFFINGER6&ロリポップ!レンタルサーバー『403 Error』が出た時の対処方法!

ロリポップ!レンタルサーバーを使用してAFFINGER6(ACTION)のヘッダー等の表示系をカスタマイズするとセーブ時に『403 Error』が表示されセーブできない! こんな時はロリポップユーザー専用ページにログインしてWAFの設定を無効にするだけ!

各設定項目で、できることを以下に整理しました。^^/

・ヘッダーバナー

ヘッダーバナーは、TOPページのヘッダー下部に最大4つのカード型リンクを設置できます。また、サイト全体で表示するように設定することもできます。

カード型リンクには、大小2種類のテキストを表示させることができ、PCとスマホ(タブレット含む)で表示・非表示や各種カードデザインも可能です。

・サムネイルスライドショー

サムネイルスライドショーは、ヘッダー画像下のウィジェットエリアに、カテゴリーごとのサムネイル画像をスライドショーで表示できます。

AFFINGERの管理設定により、ウィジェットを使用せずにサムネイル画像のスライドショーを表示することができます。

表示数や表示画面の大きさに応じて、スライド表示数や表示スタイルを調整するなど、細かな設定が可能です。

・おすすめ記事一覧

ユーザーに見せたい任意の記事をランキング形式で表示できます。

表示場所のバリエーションが豊富なため、設置場所の自由度が高いです。

また、ショートコードを使用することで、特定の場所にピンポイントで設置することができます。


AFFINGER 管理:ヘッダー下 / おすすめタブ|全体の表示イメージ
表示イメージ

ヘッダーバナー

この章では、ヘッダーバナーの設定と表示イメージをご紹介します。

ヘッダーバナー

  • ヘッダーバナー1〜4
  • デザイン

設定項目の画面は 以下の通りです。

AFFINGER 管理:ヘッダー下 / おすすめタブ|ヘッダーバナー1〜4|デザイン|全て
設定項目

それでは順番に見ていきましょう。

ヘッダーバナーの表示イメージと設定項目

ヘッダーバナーの設定箇所は4つあり、それぞれの設定と表示条件を自由に設定できます。

設定項目の画面は 以下の通りです。

AFFINGER 管理:ヘッダー下 / おすすめタブ|ヘッダーバナー1〜4
設定項目
yajirusi-sita-80x40

以下のように『画像・テキスト・リンク先URL 』を設定します。参考

AFFINGER 管理:ヘッダー下 / おすすめタブ|ヘッダーバナー1・2|入力詳細
設定項目

以下のサンプル画像では、ヘッダーバナー1〜4にそれぞれ「画像・テキスト・サブテキスト」が設定されています。(赤破線枠部)

AFFINGER 管理:ヘッダー下 / おすすめタブ|ヘッダーバナー|表示イメージ
表示イメージ

ヘッダーバナー:補足

  • ヘッダーバナーにテキストまたはサブテキストが入力されている場合、画面全体に均等に表示されるため、表示数によってバナーの見え方が変わります。横幅は均等にレスポンシブに調整され、高さは100pxで表示されます。
  • ヘッダーバナーにテキストとサブテキストの両方を入力しないものがある場合、画像の縦横比が優先され、その画像のある行の表示サイズが変わります。(画像全体が表示されます)

※ テキストを入力しない場合は、特にバナー用の画像サイズを合わせるようにしましょう。

デザイン(バナーの表示デザイン)

デザインでは、バナーの表示スタイルを設定できます。

設定項目の画面は 以下の通りです。

AFFINGER 管理:ヘッダー下 / おすすめタブ|デザイン(バナーの表示デザイン)
設定項目

デザインの変更イメージは以下のようになります。

AFFINGER 管理:ヘッダー下 / おすすめタブ|ヘッダーバナー|デフォルト|表示イメージ
表示イメージ
AFFINGER 管理:ヘッダー下 / おすすめタブ|ヘッダーバナー|テキストのある背景画像をぼかす|表示イメージ
表示イメージ
AFFINGER 管理:ヘッダー下 / おすすめタブ|ヘッダーバナー|テキストのある背景画像を暗くする|表示イメージ
表示イメージ
AFFINGER 管理:ヘッダー下 / おすすめタブ|ヘッダーバナー|角丸にする|表示イメージ
表示イメージ

サムネイルスライドショー

この章では、サムネイルスライドショーの設定と表示イメージをご紹介します。

設定項目の画面は 以下の通りです。

AFFINGER 管理:ヘッダー下 / おすすめタブ|サムネイルスライドショー
設定項目

以下のサンプル画像は、上記の設定項目の設定で表示しています。

AFFINGER 管理:ヘッダー下 / おすすめタブ|サムネイルスライドショー|表示イメージ
表示イメージ

おすすめ記事一覧

この章では、おすすめ記事一覧の設定と表示イメージをご紹介します。

設定項目の画面は 以下の通りです。

AFFINGER 管理:ヘッダー下 / おすすめタブ|おすすめ記事一覧
設定項目

おすすめ記事一覧:補足

  • おすすめ記事一覧の表示パターンは、各ページのメインエリアとサイドバーの2つです。
  • 全体カラー設定で色を設定している場合、それがタイトルや背景色に反映されます。
    『カスタマイザー>オプション(その他)>おすすめ記事』で各種色設定が可能です。

以下のサンプル画像は、メインエリアとサイドバーを同時に表示しています。

AFFINGER 管理:ヘッダー下 / おすすめタブ|おすすめ記事一覧|表示イメージ
表示イメージ

初心者でも安心 コスパ最強の洗練されたWordPressテーマ/

AFFINGER6 購入 ▶︎ 詳しくはこちら

\\『すごいもくじLITE』が付いてくる!限定特典キャンペーン実施中!//

- 少しづつ増え続ける当サイトオリジナル特典付!-

購入方法で迷ったら…こちらで確認【特典付きを購入しよう!】

まとめ!AFFINGER 管理【ヘッダー下 / おすすめ】タブのメニュー設定を完全解説!AFFINGER6

AFFINGER6の管理画面で行う『ヘッダー下 / おすすめタブ:ヘッダー下 / おすすめ』の各設定項目について初心者さん向けにご紹介しました。 WordPressテーマ AFFINGER6専用の拡張機能を有効に使うために、お役に立てば嬉しいです。

「最後まで、ご観覧いただきありがとうございました。」
また、次の記事で…お会いしましょう。\^^/

WordPressテーマ

ACTION / AFFINGER6
コスパ最強のWordPressテーマ

action-affinger6-ex-1a

AFFINGER

WordPressテーマ

シンプル美と機能性両立を両立させた、圧巻のWordPressテーマ

SWELL

AFFINGER6_おすすめ記事!

26239_affinger6-swell-comparison-4a 1

WordPressテーマ「AFFINGER6とSWELL」を徹底比較。現役で両方使っている筆者が「こんな人におすすめ」を解説。テーマ選びで重要視するポイントやブロックエディターとクラシックエディターに関する注意点等、中立の立ち位置でご紹介。

19298_affinger6-honest-review-2a 2

AFFINGER6とAFFINGER6EXの両方を使って3年目の本音レビューをご紹介。初心者が使った場合のメリットとデメリットを徹底解説。有料テーマをはじめて使う初心者の不安を解決!ブログ収益を加速させるオリジナル特典をご用意しました。

3969_affinger6-how-to-buy-2 3

WordPressテーマACTION(AFFINGER6)のおすすめ購入方法を初心者目線でご紹介。また購入後のダウンロードからインストールまでの手順を全画像付きで丁寧に解説。初心者が迷子にならない為の公式サイトの検索手順と注意事項もご紹介します。

15446_AFFINGER6-how-to-use-tag-ma-1 4

AFFINGERタグ管理マネージャー4 ver4.1.1が2022/9/21にアップデートされ大幅に使いやすくなりました!表示機能も強化されグッと見やすなったリンク計測の表示など、アップデートの手順から広告用タグの作り方まで一気にご紹介します。

-Basic setting AFFINGER
-,