動的ソースとメタフィールドを使用してカスタマイズを活用する

場合によっては、ケースバイケースで製品情報を表示する必要があるかもしれません。 Conceptテーマの動的ソース機能を使用すると、メタフィールドを使用してカスタマイズされた製品情報を作成でき、独自の製品仕様に多用途のソリューションを提供できます。

このガイドでは、テーマのカスタマイズの可能性を最大限に引き出すための動的なソースとメタフィールドの活用について詳しく説明します。

このページでは

新しいメタフィールド定義の追加

必須前提条件:標準またはカスタムのメタフィールドを適用する前に、メタフィールド定義の追加に関する Shopify のガイドを必ず確認してください。

新しいメタフィールドの作成を説明するために、製品機能のカスタマイズされた概要を示す製品特性メタフィールドを考えてみましょう。

「製品特性」メタフィールドを追加するには、次の手順に従います。

  1. Shopify 管理者ダッシュボード> [設定] > [カスタムデータ] 。

  2. 新しいフィールドを追加するストアの部分を選択します。たとえば、新しいフィールドをProductsに追加します。

  3. 製品を選択した後、右上隅にある「定義の追加」ボタンをクリックします。

  4. [製品メタフィールド定義の追加] ボックスで、次のような新しいメタフィールド「 Sound 」の詳細を設定します。

    • 名前- Sound
    • 名前空間とキー- tech_specs.sound (挿入された名前に基づいてデフォルトの名前空間とキーを保持することも、変更することもできます)
    • 説明(オプション) - 「製品を説明する重要な情報を追加します。」という説明行を追加します。
    • コンテンツ タイプの選択- 行テキスト、整数、日付と時刻、ファイルなど、さまざまなコンテンツ タイプがあります。この例では、リッチ テキストを選択します。
    • ストアフロントへのアクセス- オプション

動的ソースを接続して製品にメタフィールド値を割り当てる

新しいメタフィールド定義が確立されたら、次のステップでは、個々の製品のこのメタフィールドに特定の値を割り当てます。たとえば、製品「Flow Harmony Liz」の主な特徴を紹介するには、次の手順に従います。

  1. Shopify 管理者ダッシュボード> [製品] > 指定された情報を含む製品を選択します。

    製品のフィルター バーに製品名を貼り付け、製品をクリックして編集ウィンドウを開くと、リスト内の製品をより迅速に検索できます。

  2. ここから一番下までスクロールし、メタフィールド バーの[すべて表示]ボタンをクリックします。

  3. 次に、既存のすべてのメタフィールドを使用して値を挿入できるようになります。リクエストの例によれば、以下の画像のように、「 Sound 」フィールドにいくつかの重要な情報を追加します。次に、 「保存」をクリックします。

  4. [オンライン ストア] > [テーマ] に移動し、コンセプトテーマを選択し、テーマのボタン [カスタマイズ]をクリックします。

  5. テンプレートのデフォルト製品に移動 >製品を選択します(この例では「Flow Harmony Liz」製品を選択します) >製品情報セクション >ブロックの追加>折りたたみ可能な行ブロック。

  6. 折りたたみ可能な行構成では、以下を設定できます。

    • アイコン
    • 見出し
    • 行の内容
    • ページの行コンテンツ

  7. このブロックの手順 3で追加したキー情報を表示するには、 [行の内容]フィールドのデフォルトのテキストを削除し、 [動的ソースの挿入] アイコンをクリックします。次に、ダイナミックソースリストからサウンドを選択します。

  8. その結果、製品「Flow Harmony Liz」の指定された「サウンド」情報が表示されます。

  9. 「保存」をクリックして終了します。

注:

  • 新しく作成したメタフィールドに割り当てられた情報を表示する別の製品に対して、手順 3 を繰り返す必要があります。

  • セクションまたはブロックがメタフィールドをサポートできるかどうかを確認するには、動的ソースの挿入アイコンがあるかどうかを確認します。動的ソースは通常、テキストや折りたたみ可能なタブなどのブロック タイプで使用できます。

    • 以下の動的ソースの挿入アイコンが表示される場合、接続できるメタフィールドは 1 つだけです。

    • プラスの付いた動的ソースの挿入アイコンが表示される場合は、最大 20 個のメタフィールドを接続できます。

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

{{ タイトル }} に戻る