既存のメニューを置き換える

ハウツーガイド すべてのプラン 3 分で読めます

自動で違うメニューが選ばれる場合に使用します。たとえば、ヘッダーが メインメニュー 以外のナビゲーションを表示している場合や、デスクトップとモバイルで異なるShopifyメニューを使っている場合です。アプリは、選択したナビゲーションとリンクが一致するメニューを見つけて置き換えます。

既存のメニューの置き換えを設定する

1. ヘッダーが使っているナビゲーションを確認する

   Shopify管理画面で オンラインストア > テーマ > カスタマイズ に移動し、ヘッダー セクションをクリックして、選択されているメニュー（例: メインメニュー）を確認します。テーマによっては、モバイルメニュー用の設定が別にあります。

2. 「既存のメニューを置き換える」を選ぶ

   メニューエディターの左側のバーで、設定 タブをクリックします。位置 で、既存のメニューを置き換える を選択します。

   

   2つのメニューリストが表示された「既存のメニューを置き換える」の設定

3. 置き換えるメニューを選ぶ

   ヘッダーに合わせて、両方のリストを設定します（設定をご覧ください）。最初は、ストアの最初のナビゲーションが選択されています。

4. 保存して公開する

   保存 をクリックし、メニューを公開します。デスクトップとモバイルでストアフロントを確認してください。

設定

メインメニューを選択

テーマが デスクトップ で表示している、Shopifyのナビゲーション（オンラインストア > ナビゲーション）です。通常は メインメニュー です。

モバイルメニューを選択

テーマが モバイル のメニューで表示しているナビゲーションです。ほとんどのテーマでは、デスクトップと同じです。

トラブルシューティング

メニューのリストが空

ストアフロントがパスワード保護されているため、アプリがナビゲーションを読み取れず、メニュー一覧を更新するにはストアのパスワードを解除してください と表示されている可能性があります。ストアのパスワードを削除する（オンラインストア > 環境設定 が開きます）をクリックし、パスワードを削除してからもう一度お試しください。

メニューがヘッダーを置き換えない

アプリは、ヘッダーのリンクを選択したナビゲーションと照合するため、ハードコードされたリンクや別のナビゲーションでは一致しません。ヘッダーが実際に使っているナビゲーションを選ぶか、このCSSセレクターにメニューを表示に切り替えてください。

デスクトップでは置き換わるがモバイルでは置き換わらない、またはその逆

モバイルメニューを選択（または メインメニューを選択）を、そのレイアウトが実際に使っているナビゲーションに設定してください。

関連ページ

• 自動で置き換えるアプリにテーマのヘッダーメニューを見つけさせ、自動で置き換えます。
• CSSセレクターにメニューを表示するCSSセレクターを入力して、テーマの特定の要素にメニューを配置します。
• ストアにメニューが表示されないのはなぜですか？ストアフロントにメニューが表示されない、または表示が崩れる場合の手順別チェックリストです。

このページは役に立ちましたか？

問題を報告