OS 3.0 テーマエディターでの動的ソース（メタフィールド）の設定方法

動的ソース（メタフィールド）を使用すると、手動で入力した静的コンテンツの代わりに、ストアフロントでリアルタイムのストアデータを表示できます。パーツを動的ソースに接続することで、商品特徴やカテゴリタグなどの固有の詳細情報がストア全体で一貫して最新の状態に保たれます。現在、この機能は主に商品およびカテゴリリソースのメタフィールドに対応しています。

このガイドでは、メタフィールドの定義方法、3つの動的データ取得の次元の理解、およびよくある設定問題の解決方法について説明します。

設定前のメタフィールドの作成

動的コンテンツを表示する前に、カスタムデータフィールド（メタフィールド）を定義し、商品やカテゴリに値を割り当てる必要があります。

1. SHOPLINE管理画面で、設定 > カスタマイズデータに移動します。
   
2. 作成したいリソースタイプ（例：商品またはカテゴリ）を選択します。
3. 新しいフィールドを作成するには、フィールドを追加をクリックします。
   
4. 特定のアイテム（例：商品ページ）に移動し、メタフィールドセクションでそのアイテムの必須フィールドを入力します。設定を保存するには、追加をクリックします。
   

3つの動的ソース次元の説明

OS 3.0 エディターは3つのデータ取得次元を提供します。それらのロジックを理解することで、異なるページで正確にコンテンツを表示できます：

テンプレートリソース（現在のページ）

• 仕組み： これは、顧客が現在訪れている「URL」に完全に依存する固定データロジックです。
• 最適な用途： 商品詳細ページやカテゴリページの固定位置に最適です。
• 効果： 顧客が商品Aを訪れると、システムはURLを識別し、商品Aのメタフィールドにロックします。「現在の商品」に連携されたブロックは、そのページ固有のデータを自動的に取得します。

パーツレベルのリソース（現在のパーツ）

• 仕組み： これは「パーツ自体」の設定に基づいており、配置されているページには依存しません。パーツレベルで割り当てられたデータをサブモジュールが読み取ります。
• 最適な用途： 「注目商品」など、どのページにも配置可能な独立したセクション（例：トップページ）に最適です。
• 効果： まずセクションのトップレベルでリソース（例：「サマーセール」カテゴリの選択）を手動で連携する必要があります。連携後、「現在のパーツ」に設定されたサブモジュールは、その特定のカテゴリから正確にデータを取得します。

最も近いリソース

• 仕組み： これは「上方向への検索」ロジックを使用します。ブロックは現在の位置から始まり、ページ構造を上に向かって検索し、最も近い利用可能なデータソースを見つけて適用します。
• 最適な用途： 商品リストや検索結果ページに最適です。
• 効果： リスト内の個々のカードが「単一商品」データを識別できない問題を解決します。カード内の任意のパーツ（例：タイトル、画像）が「最も近いリソース」に設定されていると、そのループ内でそのカードに割り当てられた特定の商品データに自動的に一致します。

「最も近いリソース」の理解と使用方法

最も近いリソースの仕組みは、自動レイアウトにおける画期的な機能です。繰り返しリスト内の個々のブロック（商品カードなど）が「上方向を見て」そのアイテムに関連する特定のデータを見つけることを可能にします。

なぜ最も近いリソースを使うのか

• 自動化： 商品カードの各カードに手動でデータを割り当てる必要がなくなります。
• 詳細な表示： リストや検索結果の中で、商品カードに特定のアイテム特性（例：アルコール度数や生地の種類）を直接表示できます。

最も近いリソースの設定方法

1. OS 3.0 テーマエディターで、商品一覧のあるページ（例：カテゴリページ）に移動します。
2. 商品テンプレート内のブロックを選択します（例：商品説明ブロック）。
   
3. コンテンツ入力欄の隣にある動的ソースを追加アイコンをクリックします。
   
4. 現在のパーツセクションの下にある最も近い商品を選択します。
   
5. 表示したい特定のメタフィールドを選択し、保存をクリックします。

ユースケース：商品一覧と独立したパーツ

適切なソースの次元は、パーツの配置場所によって異なります：

シナリオ 1：商品一覧ページ

カテゴリページや検索結果ページの商品のカードを扱う場合は、最も近いリソースの次元を使用します。

• 重要な操作：商品カード内のサブモジュールを最も近い商品に接続します。
• 期待される結果：これにより、商品カードの各カードが自動的に対応する固有の属性（その商品の特定のメタフィールドなど）を表示し、システムがリストをループ処理します。

シナリオ 2：独立した/注目セクション

トップページやカスタムページに「注目商品」や「商品一覧」などのセクションを手動で追加する場合は、パーツレベルのリソース次元を使用します。

• 重要な操作：サイドバーのメインセクションレベルで、最初にデータソース（例：特定の商品やカテゴリの選択）をバインドする必要があります。
• 期待される結果：これにより、テンプレート外の任意のページで特定の商品情報を柔軟に表示できます。

OS 3.0 テーマエディターのメタフィールドに関するよくある質問

Q1 商品カテゴリページの一覧で個別の商品メタフィールドを表示するにはどうすればよいですか？

「最も近いリソース」の次元を使用する必要があります。

• よくある落とし穴： コレクションページでは、システムのデフォルト「テンプレートリソース」が「コレクション」全体のデータを取得します。これを商品カードに直接適用すると、個々の商品属性（アルコール度数や生地の素材など）を取得できません。
• 正しい解決策： エディターで商品カード内の特定のブロック（例：テキストボックス）をクリックし、動的ソースを最も近い商品に、最も近いリソースカテゴリの下で設定します。
• ロジック： システムがリストを生成するとき、各カードに個別の商品データを割り当てます。「最も近いリソース」を選択することで、そのブロックは「上方向に検索」して、そのカードに正確にマッピングされた特定の商品データを取得し、差別化された表示を実現します。

Q 2 メタフィールドとメタオブジェクトの違いは何ですか？

メタフィールドは、商品やコレクションなどのリソースに直接付随するカスタム属性です（例：スキンケア商品の「主要成分」や保湿剤の「適した肌タイプ」など）。

メタオブジェクトは、特定の商品やコレクションに付随しない独立した再利用可能なデータレコードで、複数の商品、ページ、パーツで参照できます。例えば、ストアで複数のスキンケアラインを扱う場合、「ラインのコンセプトや開発ストーリー」などのコンテンツは同じライン内のすべての商品ページに表示される必要があります。この場合、メタオブジェクトを使うことで、各商品に同じ情報を繰り返し入力することなく、中央で管理できます。商品固有のデータにはメタフィールドを、複数の商品やページで共有する必要があるコンテンツにはメタオブジェクトを使用してください。メタオブジェクトの詳細については、「OS 3.0 テーマエディターでのメタオブジェクトの接続」をご覧ください。