メタフィールドを使ったストアコンテンツのカスタマイズ方法

メタフィールド機能は、SHOPLINE管理画面に追加のフィールドを保存できるようにし、ストアの外観や機能のカスタマイズを可能にします。メタフィールドを使うことで、ストアデザインや商品ページにパーソナライズされた設定やさまざまな表示効果を実装できます。例えば：

• 複数の商品に対して異なるユーザーマニュアルを商品詳細ページに追加する
• 異なるカテゴリに異なる割引情報を追加する
• 衣料品の商品に対して異なる素材説明や洗濯表示などを追加する
• ジュエリー商品のカラット重量表示情報を追加する
• 異なる商品に対して異なる配送案内を追加する

メタフィールドの使用概要

モジュール選択：各メタフィールドは特定のモジュールに紐づいているため、メタフィールドを使用する前に、作成したいモジュールを特定する必要があります。現在、メタフィールドは以下のモジュールをサポートしています：商品、商品バリエーション、商品カテゴリ、ページ、顧客、ブログ、ブログカテゴリ、および注文。
 

 手順： 

1. メタフィールドの基本情報を入力します。
2. ストアのSHOPLINE管理画面でメタフィールドに値を割り当てます。
3. ページエディターに動的ソースを挿入するか、SHOPLINEレイアウトエンジンに呼び出しコードを挿入します。

メタフィールドの紹介

メタフィールドの構成

メタフィールドの基本情報の入力。メタフィールドは以下の情報で構成されています：フィールド名 / オーナーリソース / ネームスペース / キー / 説明、およびデータタイプ。

• フィールド名：メタフィールドの名前。例：商品の素材。
• オーナーリソース：メタフィールドが属するリソースの種類、別名「オーナーリソースタイプ」。例：商品、カスタムページなど。
• オーナーID：メタフィールドが属するオーナーリソースのID。例：商品AのIDは1605898661。
• ネームスペース：メタフィールドのグループをまとめるコンテナ。同じキー名のメタフィールドが異なるマーチャントで競合しないようにネームスペースでグループ化します。例：my_fields。
• キー：特定のメタフィールドを参照するための名前で、メタフィールドのコード識別子として機能します。例：materials。
• データタイプ：メタフィールドに保存されるデータの種類。例：単一行テキスト、URL、整数など。
• 説明：メタフィールドを定義する説明情報で、値を割り当てる際に正しい値を入力するのに役立ちます。例：ジュエリーの素材情報を入力してください。
• 値：メタフィールドに保存されるデータ。例：925シルバー。

メタフィールドのデータタイプ

以下はメタフィールド機能で利用可能なデータタイプです：

メタフィールドの作成

以下は、商品モジュールのメタフィールドを作成する例です：

1. SHOPLINE管理画面から、設定 > データのカスタマイズに移動します。
   
    
2. メタフィールドセクションで、作成したいメタフィールドのモジュールを選択します。現在、以下のモジュールのメタフィールドを作成できます：商品 / 商品カテゴリ / 商品バリエーション / ページ / 顧客 / ブログ / ブログカテゴリ / 注文。この手順では、メタフィールド作成のために商品モジュールを選択します。
   
    
3. フィールドを追加をクリックします。
   
    
4. 詳細を入力し、完了したら追加をクリックします。
   
    

• フィールド名：SHOPLINE管理画面でメタフィールドを識別するために使用します。例：Color（色）。
• Namespace（名前空間）とKey（キー）：メタフィールドの一意の識別子です。名前空間を使って類似のメタフィールドをグループ化できますが、各名前空間とキーは一意でなければなりません。例：「custom.color」。名前空間とキーは数字で始めることはできませんのでご注意ください。
• 説明（オプション）：メタフィールドに入力する値など、説明情報を提供します。
• dataType（データタイプ）：メタフィールドが保存するデータの種類です。テキスト、ドキュメント、URLなどがあります。単一または複数のデータタイプの設定が可能です。

5. 作成が完了しました。
   
    

メタフィールドが作成された後、メタフィールドに値を割り当てることができます。

メタフィールドへの値の割り当て

1. 値を割り当てたいモジュールを選択します。前の手順では、商品モジュールのメタフィールドを作成しました。したがって、SHOPLINE管理画面の商品ページに移動して値を割り当てます。値を割り当てたい特定の商品を選択します。この例では、3番目の商品を選択して詳細ページに移動します。
   
    
2. ページの下部にあるカスタマイズデータセクションを見つけ、値を割り当てるメタフィールドを選択します。入力できる値の種類は、メタフィールドのデータタイプによって異なります。
   
    

メタフィールドへの値の割り当てを完了します。

テーマデザインでのメタフィールドの設定

エディターでのメタフィールド動的ソースの挿入

具体的な操作手順については、以下を参照してください： メタフィールド｜テーマデザインでのメタフィールド設定。

レイアウトエンジンでの呼び出しコードの挿入

メタフィールドを作成し値を割り当てた後、以下の表から呼び出しコードをコピーしてレイアウトエンジンのコードエディターに貼り付けることでカスタマイズを実現できます。

例えば、namespaceがmy_fields、keyがadditional_infoの商品のメタフィールドを作成した場合、このメタフィールドを呼び出すコードは：{{product.metafields.my_fields.additional_info.value}} となります。

未定義メタフィールドの管理

定義済みメタフィールドと未定義メタフィールド

SHOPLINEのメタフィールドは、定義済みと未定義の2種類に分かれています。

• 定義済みメタフィールド：SHOPLINE管理画面で作成され、テキスト、数値、ブール値、メディアファイルなどのデータタイプが割り当てられています。管理画面の設定ページに表示されるため、入力、更新、管理が簡単です。
• 未定義メタフィールド：これらのメタフィールドはSHOPLINE管理画面で作成されていません。通常、APIやサードパーティのアプリを通じて追加されます。

未定義メタフィールドの管理方法

未定義のメタフィールドを管理するには、定義のないメタフィールドタブに移動します。ここから、以下の操作が可能です：

• メタフィールドの編集：メタフィールドの横にある鉛筆アイコンをクリックして、名前を更新したり、定義済みメタフィールドに変換したりできます。
• メタフィールドの削除：不要になったメタフィールドは、ゴミ箱アイコンをクリックして直接削除できます。

効果的な活用方法

商品詳細ページの柔軟なカスタマイズのための独立したフィールド拡張

よく作り込まれた商品詳細ページは、顧客の購買意思決定を導く上で重要な役割を果たします。国境を越えた競争が激しいeコマースの世界では、細部にこそ勝敗の鍵があります。商品詳細ページに独自で関連性の高い情報を表示することで、販売者は潜在的な顧客の信頼と好意を獲得するだけでなく、独自の競争優位性を確立し、ライバルを凌駕することができます。

例えば、マーチャントが商品の洗濯方法を含めたい場合を考えてみましょう。洗濯情報専用の拡張フィールドを作成することで、顧客は商品詳細ページで簡単にこれらの情報にアクセスできます。これにより、商品に対する信頼感と安心感が高まるだけでなく、洗濯に関する誤りによる返品の可能性も減少します。

洗濯表示以外にも、マーチャントは必要に応じてメタフィールドを使用して、素材の組成、原産地、サイズなどの追加情報を商品詳細ページに柔軟に掲載できます。

シンプルなコードカスタマイズによるパーソナライズ機能要件の実装

より多くの情報を柔軟に表示するだけでなく、メタフィールドは特定のビジネスシナリオに合わせたパーソナライズ機能要件のカスタマイズにも活用できます。これにより、マーチャントがストアをカスタマイズする際に直面する技術的なコストや障壁を効果的に軽減できます。

例えば、商品説明のタブ切り替えの実装、関連資料のダウンロードセクションの追加、関連商品レコメンドセクションの統合などです。

商品説明のタブ切り替え

商品詳細ページでは、多くの情報を提示する必要がある場合があります。しかし、すべての情報がページ上に散乱していると、顧客は圧倒され、必要な情報を迅速に見つけることが難しくなります。これにより、ショッピング体験が低下し、顧客の不満につながる可能性があります。

この問題に対処するために、マーチャントはタブ切り替えテンプレートを利用して情報を効果的に分類・整理できます。このテンプレートにより、マーチャントは複数の情報カテゴリを1つのコンテンツボックス内に表示し、顧客は異なるタブを切り替えて目的の情報にアクセスできます。この方法で、商品詳細ページは包括的でありながら視覚的に魅力的なレイアウトを維持できます。

以前は、このような機能を実装するにはマーチャントが技術者を雇用して開発に追加リソースを投じる必要があり、不便でした。しかし、メタフィールド管理ツールを使えば、マーチャントは独自に新しい拡張フィールドを作成し、コードをコピー＆ペーストするだけで基本的なタブ切り替えテンプレートを簡単に統合できます。これにより、商品説明のタブ切り替えテンプレートの設定と商品詳細ページへの表示が簡素化されます。

関連資料のダウンロードセクションの追加

すべての情報を商品詳細ページに直接表示することは必ずしも便利ではありません。設置マニュアルや素材組成の詳細など、膨大な資料説明は、文書の形で顧客に提供する方が適しています。

メタフィールドを使うことで、マーチャントは関連資料のダウンロードリンクを商品に簡単に追加できます。これにより、顧客はリンクをクリックして文書をダウンロードし、ローカルで閲覧できるため、商品に関する包括的な情報にアクセスできます。

関連商品レコメンドセクションの追加

データによると、個別の商品詳細ページに関連商品レコメンドを組み込むことで、顧客のページ閲覧時間が効果的に増加するだけでなく、ストアの平均取引額も向上します。

以前は、マーチャントが関連商品レコメンドを実装するには特定のアプリが必要でした。しかし、メタフィールド管理ツールを使えば、マーチャントはいつでもどこでも簡単に関連商品レコメンドモジュールを作成できます。

メタフィールドは、商品、カテゴリー、顧客、注文、ブログ、ページ、ストアなどのリソースに対して拡張フィールドを作成し、特定の情報を保存できるだけでなく、Admin APIを通じて他のeコマースシステム（CRM/IMS/ERP）とのデータ送受信や連携も可能にします。これにより、SHOPLINEストアは他のシステムとよりシームレスに統合でき、マーチャントはさまざまなデータを便利に管理・閲覧できます。