高機能な不動産物件ポータルサイトが作成できるWordPressテーマ「GRAVITY」
ワードプレステーマ別

TCDテーマGRAVITY:ヘッダーのメニュー項目を等分割させずに表示する方法

WordPressテーマ「NULL」

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

ダウンロード

Q.グローバルメニューで各メニューが同じ幅で表示されますが、メニューの文字数に合わせて異なる幅で表示させたいです。

GRAVITYのヘッダーで表示されるグローバルメニューは、メニュー数によって等分割して表示されます。
まずは、デモサイトのように「各メニューを同じくらいの文字数にする」「メガメニューやドロップダウンでメニューをまとめる」ことを検討してみてください。

ただ、どうしても長いラベルを設定する必要がある場面もあるかと思います。

▼変更前のイメージ(一部メニューが改行されてしまっています。)
変更前イメージ

A.下記の方法で対応してください。

TCDテーマ>基本設定>カスタムCSSに入力します。

.pc .p-header-nav__list {
    display: inline-flex; }

 
▼変更後イメージ
変更後イメージ

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

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

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