メガメニューを作成するにはどうすればよいですか?

"

このテーマにはメガ メニューのサポートが付属しており、この手順ではメニューのセットアップ方法を示します。

このページでは

メガメニューの外観

  • Be Conceptでは、次のようにコンテンツが列に配置されたメガ メニューを作成できます。

  • メガ メニューは、メニュー項目とプロモーションの 2 つの部分の組み合わせです。

メガメニューの設定

  1. まず、ネイティブの Shopify ナビゲーションを使用して、メニューを複数のレベルで設定する必要があります。複数のレベル (ドロップダウン) でメニューを作成する方法については、 Shopify の公式ドキュメントをご覧ください。以下は、最初のスクリーンショットのメガ メニューに対応するメニュー構造の例です。

  2. テーマ設定で、セクション リストのヘッダー1をクリックし、メニュー設定2に移動して、上で作成したメニューを選択します。

  3. メガ メニューの設定を続けるには、 [メガ メニューの追加]をクリックしてメガ メニュー ブロックを追加します。

    • [メガ メニュー]設定では、メガ メニューを含むメニュー項目の名前を入力するだけです。 「メニュー項目」に入力した名前は、メニュー項目の名前と一致する必要があることに注意してください。以下は、ショップアイテム内にメガメニューが含まれている例です。

    • でメニュー項目の設定では、オプションでさまざまなプロモーション用に最大 5 つの画像をアップロードできます。これらの画像はメガメニューのバナーに表示されます。

      以下は、5 つのプロモーションを含むコレクション メニューの例です。 :

    • 詳細については、メガメニューのブロック設定を確認してください。

メガメニューブロック設定

設定説明
メガメニュー
メニュー項目メガ メニューに含めるメニュー項目の名前を入力します。 「メニュー項目」に入力した名前は、第 1 レベルのメニュー項目のいずれかの名前と一致する必要があることに注意してください。
メガメニューの画像を表示する

ナビゲーションの第 2 レベルの項目が画像付きのコレクションにリンクしている場合、リンクのタイトルの上に画像が表示されます。以下に例を示します。

ヘッドフォンの第 2 レベルの項目:

これは、ヘッドフォンアイテムが画像のあるコレクションにリンクされているためです。

ボタンラベル

ボタンを非表示にするには、ラベルを空白のままにします。

ボタンのテキスト
ボタンリンクボタンの URL。
プロモーション

オプションで、5 つのプロモーションに対して 5 つの画像を、それぞれ同じ設定でアップロードできます。

画像表示したい画像
画像比率ブログ投稿画像の画像比率:
  • 画像に適応(デフォルト) - 画像のアスペクト比を使用します。これにより、画像が切り取られるのを防ぎます。
  • 正方形- 画像を 1:1 の比率でトリミングします。
  • ポートレート- 画像を 2:3 の比率にトリミングします。
  • 風景- 画像を 3:2 の比率にトリミングします。
  • ワイド- 画像を 16:9 の比率にトリミングします。
見出しプロモーションのタイトル。
サブテキストプロモーションの説明テキスト。
画像にテキストをオーバーレイする画像にテキストをオーバーレイするオプションを有効にします。このオプションが無効になっている場合、テキストは画像の下に表示されます。
リンクリンク先の URL。
タグ

製品に関する追加情報を提供するために製品ページに表示されるカスタム テキスト。

文字の色テキストの色。
オーバーレイのテキストの色テキストのオーバーレイの色。

テキストオーバーレイの不透明度は0から100%まで設定できます。

この記事がお役に立てば幸いです。この機能についてご質問やご不明な点がございましたら、お気軽に弊社チームのサポートまでお問い合わせください。

"
{{ タイトル }} に戻る