Shopifyストアのメガメニューを作成する

Shopifyのメガメニューについて

メガメニューは、複数のオプションを一度に表示する展開可能なメニューの一種で、通常は列にまとめられています。在庫数が多い、または商品カテゴリーが多いShopifyストアに最適です。

主な特徴：

• 複数列レイアウト: カテゴリは個別の列にグループ化されます。
• 構造化ナビゲーション: 買い物客が深くネストされたコレクションや製品を閲覧するのに役立ちます。
• テーマに応じてShopifyには組み込みのメガメニューツールがありません。一部のテーマでは、ネストされたメニューがデフォルトでメガメニューとして表示されます。

始める前に知っておくべき重要なポイント

現在のテーマがドロップダウンまたはメガ メニュー レイアウト (例: Dawn、Craft、Ride テーマ) をサポートしていることを確認してください。

GemPagesで構築されたすべてのページは、 テーマのヘッダー/フッターしたがって、メニューの編集はShopify管理画面で行う必要があります。

メガメニューを設定する前に、GemPages で構築されたページを含むストア全体でのメニューの表示方法に影響するいくつかの重要な制限と要件を理解することが重要です。

#1. テーマはメニューの表示を制御します

メガメニューはShopify管理画面に組み込まれた機能ではなく、アクティブなShopifyテーマによって制御されるビジュアルレイアウトスタイルです。つまり、以下のようになります。

• Shopify では、ナビゲーション設定でのみメニュー項目をネストできます。
• これらの項目が単純なドロップダウンとして表示されるか、完全なメガ メニューとして表示されるかは、テーマでどのようにレンダリングされるかによって完全に異なります。

#2. GemPagesはテーマのヘッダーを上書きできません

GemPagesでは美しいカスタムページを作成できますが、デフォルトではShopifyテーマのグローバルヘッダーとフッターが使用されます。つまり、

• GemPages エディター内でスタンドアロンのメガ メニューを作成することはできません。
• GemPages で構築されたホームページ、ランディング ページ、製品ページなど、サイト全体のすべてのメニューに Shopify のナビゲーションを使用する必要があります。

#3. メガメニューに対応したテーマを選ぶ

ネストされたメニュー構造を最大限に活用するには、複数列またはメディアリッチなドロップダウンをサポートするテーマの使用を検討してください。例としては、以下のようなものがあります。

• インパルス, Prestige, 効率化する （メガメニューレイアウトが組み込まれた有料テーマ）
• または、開発者を雇って現在のテーマをカスタマイズする

ストアに多くのコレクション、カテゴリ、または製品タイプがある場合は、これにより UX が大幅に向上し、直帰率が下がります。

Shopifyのメガメニューを作成する

ストアのメガメニューを作成するには、次の手順に従ってください。

ステップ1: メニューにアクセスする

• Shopify管理画面から コンテンツ > メニュー.
• 以下を行うには、 メインメニュー (またはストアのヘッダーに割り当てられたメニュー) をクリックしてエディターを見つけます。

ステップ2: ネストされた構造を作成する

• 詳しくはこちら メニュー項目を追加 最上位のメニュー項目（例：「ショップ」）を作成します。

• ラベルを入力し、この最上位項目への宛先リンクを選択します（例：「すべての製品」）。

• 詳しくはこちら メニュー項目を追加 新しいアイテムを追加し続けます。次に、関連するサブアイテム（例：「スキンケア」）を右にドラッグして、親アイテムの下にネストします。

• テーマが第 3 レベルのメニューをサポートしている場合は、レイヤーを追加します。

ステップ3: 更新を保存する

メニュー項目の追加と好みの構造での配置が完了したら、 Save

その後、GemPages で構築されたページを含むすべての変更がストアフロントで自動的に更新されます。

GemPages でメガメニューを作成できますか?

現在、 GemPages内でスタンドアロンのメガメニューを作成することはできません

• GemPages グローバルShopifyヘッダーやナビゲーションを上書きしない.
• メインメニューは以下から管理する必要があります Shopify管理画面 > コンテンツ > メニュー.
• 技術的には、ランディング ページの本文内にカスタム メニューを構築できます。

例えば、GemPatop で構築されたページで行と列を使用してトップバーを作成する場合、これはグローバル ストア ナビゲーションを置き換えるものではなく、一貫性を保つために推奨されません。

よくあるご質問

1. メガメニューを作成するには特別なテーマが必要ですか?

はい。Shopifyは構造のみを管理し、デザインはテーマによって決まります。テーマがメガメニューをサポートしていない場合は、シンプルなドロップダウンとして表示されます。

2. メガメニューは GemPages で構築されたページに表示されますか?

はい。GemPages はテーマのヘッダー/フッターを継承するため、メガメニューは自動的に表示されます。

3. GemPages でメガメニューのスタイルを設定できますか?

いいえ。GemPagesではテーマヘッダーのスタイルを変更できません。カスタマイズはテーマ設定またはコードから行う必要があります。

4. テーマがメガメニューをサポートしていない場合はどうなりますか?

次の操作を実行できます。

• メガメニューをサポートするテーマ (Impulse、Prestige など) に切り替えます。
• 既存のテーマにカスタム コードを追加する開発者を雇います。

5. メガメニューは SEO に影響しますか?

いいえ、SEOに悪影響を与えることはありません。実際、適切に構成されたメガメニューは、ナビゲーションを改善し、直帰率を低下させ、検索エンジンによるサイトのクロール効率を向上させる効果があります。