サブコレクションを作成するにはどうすればよいですか?

このガイドでは、サンプルビデオで紹介されている機能を再現して、 [コレクション] ページでサブコレクションを構成する方法を説明します。

サブメニュータイトルの上にマウスを移動すると、対応する画像が表示されます。この設定では、管理パネル内のメタフィールド名...構造を利用します。

1. まずサブメニューを作成します。これはサブコレクションのコンテナとして機能します。

2. 次に、メタフィールドの設定を行います。この手順は、ユーザーがサブメニュータイトルの上にマウスを移動したときに画像が表示されるようにするために重要です。

サブメニューの作成

[オンラインストア] > [ナビゲーション]に移動し、新しいメニューを作成します。このメニューでは、必要に応じて独自のコレクションの構造を作成します。たとえば、これはデモで作成したものです。

このメニューのすべてのメニュー項目はコレクションにリンクされている必要があることに注意してください。

テーマエディター内で、コレクションページ>製品グリッドセクション >サブコレクションブロック >メニューの選択 > 上の例のように作成したメニューを選択しますサブコレクション。
サブコレクションが表示されるはずです。

メタフィールドの設定を行います。

まず、新しいメタフィールドを作成します。このメタフィールドはすべてのコレクションに表示されます。
管理者ダッシュボードで、[設定] > [カスタムデータ] > [コレクション] > [定義の追加] を選択します。
この新しいメタフィールドを設定するには、次の正確な手順に従ってください。
- 名前- Thumbnail
  名前空間とキー- theme.thumbnail
- 「ファイル」を入力してから、 「1 つのファイル」を選択します。
  検証- [画像]を選択します。サポートされているファイル形式は、 JPEG、PNG、WEBP、SVG、HEIC 、 GIFです。ファイルサイズは20 MB 未満である必要があります。
上記の手順を完了すると、「サムネイル」という名前の新しいメタフィールドが作成されます。
目的のコレクションに関連付けられた「サムネイル」メタフィールドに画像を割り当てます。この画像は、関連するメニュー項目にマウスを移動すると表示されます。
たとえば、「ヘッドフォン」コレクションを例として使用してみましょう。
- 管理者ダッシュボード> [製品] > [コレクション] > [ヘッドフォンコレクション] を選択します。
- ヘッドフォンコレクションで、下にスクロールして [メタフィールド] のすべてを表示をクリックします。
  [サムネイル]をクリックし、画像を選択します。
  最後に、 「保存」をクリックして終了します。