ホテル・結婚式場などのホームページがつくれるエレガントなデザインのテンプレート「CANON」

ワードプレステーマ別

TCDテーマCORE:グローバルメニューのテキストの色を変更する

WordPressテーマ「NULL」

TCD LABOはWordPressテーマ「NULL」を使用して作られています。

ダウンロード

Q.グローバルメニューのメニュー項目の背景色は設定出来ましたが、文字色を変更する方法はありますか?

メニュー項目の背景色・ホバー時の背景色は外観>メニューで「カテゴリー」をメニュー項目に追加すると、設定項目が表示されるようになります。文字色はテーマ側で白色が指定されていますので、カスタムCSSでの調整が必要です。

▼変更箇所イメージ
変更箇所イメージ

A.下記の方法で調整してください。

外観>TCDテーマオプション>基本設定のカスタムCSSに入力してください。

.pc #global_menu > ul > li a { color: #fff; }
.pc #global_menu ul ul a:hover { color: #fff; } /* 副項目ホバー時の文字色 */

「#fff;」を任意のカラーコードに変更してください。

メニューごとに文字色を変えたい!メニュー項目ごとに文字色を変更すること自体は可能です(メニュー項目にクラス名をつけるなど)。しかし、サイトに統一感をもたせるためには同じ文字色を使うのがいいでしょう。各メニュー項目の背景色は色のトーン(明度・彩度)を合わせると綺麗に見えますよ。

この記事は役に立ちましたか?

もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!

同じテーマのカスタマイズ記事