既存メニューを壊さずに導入。Utopiaの「メガメニュー」機能でできること

コーポレートサイトやポータルサイトでは、メニューの子ページが増えるほど、通常のドロップダウンでは見づらくなりがちです。

Utopiaには、そうした悩みに対応する「メガメニュー」機能が標準搭載されています。子ページを持つメインメニュー項目を、ワンクリックで横幅の広いメガメニューに変えられます。

メガメニューとは

メガメニューとは、メニューをクリック（またはホバー）したときに表示される、通常のドロップダウンより幅の広いパネル型のメニューです。子ページが多いメニュー項目でも、リンクを整理して一覧しやすく表示できます。

Utopiaのメガメニューは、管理画面の「デザイン設定」画面から設定します。特別なプラグインを追加する必要はなく、テーマに標準で組み込まれた機能です。

「デザイン設定」画面の下部に「メガメニュー」という項目があります。「メガメニューを有効化」のトグルをオンにするだけで、子を持つメインメニュー項目がワイドなメガメニュー表示に変わります。

コードの編集やメニューの再構築は必要ありません。既存のメニュー構造をそのまま使えるため、導入のハードルは低めです。

Utopiaのメガメニューは、初期状態では無効になっています。これは、既にメニューを組んでいるサイトの見た目を、意図せず変えてしまわないための設計です。

必要なサイトだけ、任意のタイミングでオンにできます。通常のドロップダウンメニューのままで運用したい場合は、何もしなくてもこれまで通りの表示が保たれます。

メガメニューが特に効果を発揮するのは、メニュー項目の下に多くの子ページがぶら下がるサイトです。商品・サービス・施工事例など複数カテゴリを持つポータルサイトや、部門・サービス紹介ページが多いコーポレートサイトでは、通常のドロップダウンだと縦に長くなりすぎることがあります。

メガメニューを使えば、横方向のスペースを活かして、複数の子ページを見やすく並べられます。Utopiaはコーポレート・メディア・ブログ・LP・ポータルなど9種類のサイトタイプに対応しているため、ポータル型やコーポレートPro型のサイトを作る際に組み合わせやすい機能です。

メニューが見やすくなると、訪問者が目的のページにたどり着きやすくなり、主要ページへの内部リンクが自然に増えます。結果として、回遊性やクローラビリティの向上にもつながりやすくなります。

メガメニューは、管理画面の「デザイン設定」を開き、ページ下部のトグルを切り替えるだけで確認できます。オンとオフを切り替えて実際の見た目を比べてみると、自分のサイトに合うかどうか判断しやすくなります。

メニュー項目が増えてきた、子ページの一覧性が気になる、という方は、次のメニュー整理のタイミングでぜひ試してみてください。