AFFINGER6：ヘッダーのカスタマイズまとめ【初心者向け】

この記事ではAFFINGER6で可能なヘッダーカスタマイズを初心者向けに解説しています。

AFFINGER6のヘッダーカスタマイズは「AFFINGER管理」→「ヘッダー」画面にて行います。

AFFINGER管理：ヘッダー設定で出来ること

AFFINGER管理のヘッダーでは次のような設定をすることができます。

①：サイト名とキャッチフレーズを上下反対にする

②：TOPページのh1タグをサイト名に変更する

③： トップページのみサイト名（ロゴ）及びキャッチフレーズを非表示

④：PCヘッダーの高さ

⑤： ヘッダー（headerエリア）を表示しない

⑥：ヘッダーを分割しない

⑦：ヘッダーにサイト名（またはロゴ）を表示しない

⑧：ヘッダー（及びフッター）にキャッチフレーズを表示しない

⑨：ヘッダー右ウィジェットをフッターに表示しない

⑩：電話番号を追加する

各項目にチェックを入れて保存することでヘッダーのカスタマイズをすることができます。

それぞれ、どんなことが出来るのかをを詳しく解説していきます。

スマホ（タブレット含む）のみの項目は割愛しています。

①　サイト名とキャッチフレーズを上下反対にする

ヘッダーのサイト名とキャッチフレーズの表示を上下反対にすることができます。

デフォルトではキャッチフレーズが最上部、サイト名がその下に表示されています。

こんな感じでサイト名とキャッチフレーズが上下反対になります。

②　TOPページのh1タグをサイト名に変更する

デフォルトでは「キャッチフレーズ」がｈ１タグに設定されています。

このｈ１タグをサイト名に変更する設定です。

③　トップページのみサイト名（ロゴ）及びキャッチフレーズを非表示

トップページのサイト名とキャッチフレーズを非表示にすることができます。

サイト名とキャッチフレーズを非表示にするとこんな感じです。

④：PCヘッダーの高さ

ヘッダーの高さを設定できます。

ヘッダーの高さを「200」ピクセルに設定するとこんな感じです。

⑤　ヘッダー（headerエリア）を表示しない

ヘッダーエリアを表示させない設定です。

その下の「フロントページを除く」を設定すると、トップページ以外のヘッダーを非表示にします。

ヘッダーを非表示にするとこんな感じです。

⑥　ヘッダーを分割しない

ヘッダーの電話番号やウィジェット表示部分が非表示になります。

ヘッダー右ウィジェットの表示部分は下画像の部分になります。

「ヘッダーを分割しない」にチェックを入れて保存した後に「ヘッダーエリアをセンタリング」の項目にチェックを入れ設定することができます。

「ヘッダーエリアをセンタリング」を設定するとサイト名とキャッチフレーズが中央に表示されます。

「ヘッダーエリアをセンタリング」を設定するとこんな感じです。

⑦　ヘッダーにサイト名（またはロゴ）を表示しない

ヘッダーのサイト名を非表示にできます。

ヘッダーのサイト名を非表示にするとこんな感じです。

⑧　ヘッダー（及びフッター）にキャッチフレーズを表示しない

ヘッダーのキャッチフレーズを非表示にできます。

ヘッダーのキャッチフレーズを非表示にするとこんな感じです。

⑨　ヘッダー右ウィジェットをフッターに表示しない

ヘッダー右ウィジェットをフッターに表示しない設定です。

⑩　電話番号を追加する

ヘッダーに電話番号を追加することができます。

ヘッダーに電話番号を表示するとこんな感じです。

ヘッダー画像を表示させる方法

下のようなヘッダー画像を表示させる方法です。

ヘッダー画像は「外観」→「カスタマイズ」→「ヘッダー画像」で表示させることができます。

「新規画像を追加」にて表示させたい画像をアップロードします。

アップロードした画像は切り抜きで調整はできますが、２２００×５００ピクセル程度の画像が推奨されています。

画像をアップロードしたら「公開」をクリックして保存すればOKです。

以上がAFFINGER管理で可能なヘッダーの設定になります。

ブログの記事を書くのにAIライティングツールを利用すると効率を上げることができます。

現在は多くのAIライティングツールがあります。

そのほとんどが無料お試しでの利用が可能です。

お試し期間が限定のツールもありますが、中には機能制限はありますがずっと無料で利用できるツールもあります。

無料お試しがずっと可能なAIライティングツールをまとめてみたので、是非試してみてください。

\\ 無料お試し利用がずっと可能なAIライティングツール//

AFFINGER6：記事一覧

• AFFINGER6で出来ること【まとめ】-AFFINGER6を徹底解説
• （通常版）AFFINGER6と（上位版）AFFINGER6 EXの違い【まとめ】
• AFFINGER6を実際に利用したガチ評価-２年以上愛用して感じたメリットとデメリット
• AFFINGER6は初心者が購入しても大丈夫？-初心者にお勧めの理由

AFFINGER6の購入とインストール方法

• AFFINGER6の購入方法と購入プランの選び方
• AFFINGER6（アフィンガー6）のインストール方法-初心者でも安心！購入プランから徹底解説！
• AFFINGER６（アフィンガー６）EX版の購入とアップグレードの方法

AFFINGER6の設定関係

• AFFINGER6導入後にまず何をしたらいいの？-初心者にお勧めの初期設定４項目
• AFFINGER6（アフィンガー６）にお勧めのプラグイン【初心者向け】
• AFFINGER６のアップデート方法（２パターンを解説）
• AFFINGER６（アフィンガー６）でGoogleアナリティクスを導入する方法
• AFFINGER6：Googleサーチコンソールへの登録方法
• AFFINGER6のステマ規制対策-広告表記を表示させる方法

AFFINGER6の使い方

• AFFINGER6の使い方【まとめ】-初心者向けガイド-

AFFINGER6のデザインカスタマイズ

• AFFINGER6のカスタマイズ方法-初心者向けガイド-