AFFINGER6はカスタマイズ項目が豊富ですが、その分「設定しても反映されない」というケースも少なくありません。
特にPCヘッダーの横列メニュー文字色は、設定場所を間違えると全く変わらず、「あれ?反映されない…」と悩む人が多いポイントです。
この記事では、実際に検証して分かった正しい設定箇所と、CSSで強制変更する方法を紹介します。
よくある勘違い
PCヘッダーの横列メニュー文字色は、次のような設定では反映されません。
- 「スマホミドル/横列」 で色を変えてもPC表示には反映されない
- 「PCヘッダーメニューの文字色」 を変更しても反映されない
実際にPCヘッダーの横列メニューに反映されるのは、「電話番号とヘッダーリンク」の文字色設定だけです。
ここを変更しない限り、横列メニューの色は変わりません。
解決方法(手順)
- 外観 → カスタマイズ を開く
- ヘッダーナビゲーション → パソコン を選択
- 「電話番号とヘッダーリンク」の文字色 を設定
- 公開 をクリック
- 通常ページを開き、色が反映されているか確認
追加CSSで上書きする方法(応急処置)
設定変更ではどうしても反映されない場合は、CSSで強制的に色を変更することも可能です。
.header-nav a {
color: #ff0000 !important; /* 任意の色コード */
}
※ !important
は最終手段です。他のデザインに影響する場合があるため、基本はカスタマイザーでの設定を推奨します。
まとめ
- PCヘッダー横列メニューの文字色は「電話番号とヘッダーリンク」の設定が優先される
- 「スマホミドル/横列」や「PCヘッダーメニュー色」ではPC横列メニューは変わらない
- 仕様を理解して正しく設定すれば、透過ヘッダーでも通常ヘッダーでも対応可能
このポイントを押さえておけば、「色が変わらない…」という悩みは一発で解決できます。