投稿2021/12/14 07:14
やりたいこと：ヘッダーメニューに2階層、もしくは2段のメガドロップメニューを作成したい。
現在WordPressのEmanon Premiumテーマを使用してホームページを作っておりますが、その際にヘッダーメニューにMaxMegaMenuというプラグインを使用してメガドロワーメニュー化しました。
しかしカテゴリーが11個もあり、とても1行には入りません。
そこでメニュー自体を2段にするか、もしくは取扱製品＞製品カテゴリー＞実際の製品 のように2階層にできないでしょうか？
この目的を達成できるなら特にMaxMegaMenuの使用にはこだわりません。
よろしくお願いいたします。
ここにより詳細な情報を記載してください。
MaxMegaMenu バージョン2.9.5
WordPress バージョン5.8.2
回答2件
0
自己解決
メニューsubを2行に表記する方法
メニューsubのmax-widthを制限した上で文字数をわざと多くすることでオーバーフローさせると2行になる。
そのままだと全体が左詰めになって右側に大きく空欄が開いてしまうので同時にmarginをautoとつけることで中央寄せすることができる。
megamenu.scssの中の38行目と42行目をいじればよい
変更後：
38行目：margin: 0 auto;
42行目：max-width: 920px;
ただし課題もある。現在使用している環境ではMaxMegaMenu自体のカスタムCSSを編集しようとしても反映されない。
これを今後解決する必要がある
※追記
プラグインでVK All in One Expansion Unitを導入
ExUnitのCSSカスタマイズで
.mega-menu-wrap {
margin: 0 auto !important;
max-width: 890px !important;
}
と入力して読み込ませることでメニュー部分の幅を890ピクセルに制限した上で文字数をオーバーフローさせることで2行とした。
また、マージンをオートとしたことで両サイドの背景デザインを制御した
投稿2021/12/20 06:51
編集2021/12/24 08:34
総合スコア3
0
公式ドキュメントに記事があるようです。
How to display menu items over multiple lines – Max Mega Menu
投稿2021/12/15 01:26
総合スコア36981
あなたの回答
tips
プレビュー
Q&A
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。