テーマデザインにおけるメタフィールド
商品詳細および商品一覧ページのフィールドを独自に開放し、柔軟にカスタマイズできるようにするため、SHOPLINEはメタフィールド機能モジュールをアップグレードしました。テーマデザインでのビジュアル設定を通じて、このアップグレードはパーソナライズされた要件を容易にし、ストアの構築の柔軟性、拡張性、およびカスタマイズ能力を大幅に向上させるとともに、ストアカスタマイズに伴う技術的コストを効果的に削減します。
| 注:この機能はアンチクローラー設定の最適化バージョンです。アンチクローラー設定にアンチクローラーページを入力している場合、システムは自動的に対応するdisallowテキストをRobots.txtファイルの末尾に追加します。 |
メタフィールドの紹介
メタフィールド機能モジュールは、商品やカテゴリのための特定の拡張フィールドを作成し、ページ上に表示することをサポートします。テキスト(単一行および複数行)、画像、URL、数字、色、JSON、参照商品などを追加して、顧客向けのメモをまとめたり、使用説明を提供したり、より多くの商品詳細を紹介したりして、ストアが顧客からより多くの好意と信頼を得るのに役立ちます。
機能効果
女性服のストアを例にとると、その商品詳細ページでは、服のメイン画像、素材、詳細な色の表示、洗濯推奨、ダウンロード可能なファイル、デザイン仕様などの標準化された紹介情報を表示する必要があります。メタフィールドを利用して標準化された手順を作成できます。情報を一括で設定した後、異なる商品の紹介情報を自動的に生成でき、設定作業の複雑さを軽減します。
- 商品管理ページで商品のメタフィールドを追加します。
- ストアデザインページの商品詳細ページ > 画像とテキストモジュールで画像およびテキストのメタフィールドを追加できます。追加後、各商品の対応する画像と説明テキストが画像とテキストモジュールに表示されます。
適用範囲
対応ページおよびパーツ:
| 所有リソース | ページ | パーツ |
|
商品
|
商品詳細ページ/ | 商品詳細ページ内のヘッダー/フッターおよびその他の全ページパーツを除く、すべてのデフォルト/任意セクションを含みます。 |
|
トップページ/ 商品一覧ページ/ カスタムページ カテゴリページ/ ブログ/ ブログカテゴリ/ カートページ/ 404/ 検索ページ |
単一商品限定 | |
|
カテゴリ
|
商品一覧ページ | 商品一覧ページ内のヘッダー/フッターおよびその他の全ページパーツを除く、すべてのデフォルト/任意セクションを含みます。 |
|
トップページ/ 商品詳細ページ/ カスタムページ カテゴリページ/ ブログ/ ブログカテゴリ/ カートページ、その他ページ-404/ 検索ページ |
|
追加可能なコントロール
各コントロールに追加できる動的ソースとそのメタフィールド設定は、データタイプに連携しています。以下の表は、現在のエディターで各コントロールがサポートするデータタイプを示しています。
| コントロール名 | サポートされているメタフィールドデータタイプ | 単一/複数選択 |
| richtext/textarea |
テキスト:単一行、複数行テキスト 数値:整数、浮動小数点数 |
複数選択:一度に1つの動的ソースのみ選択可能ですが、1つの入力ボックスに複数の動的ソースを追加できます。 |
| text |
テキスト:単一行 数値:整数、浮動小数点数 |
複数選択 |
| color | カラー | 単一選択 |
|
url
|
URL | 単一選択 |
| image_picker | 参照:ファイル | 単一選択 |
|
page_picker
|
参照:カスタムページ | 単一選択 |
| product_picker | 参照:商品 | 単一選択 |
手順
メタフィールドの設定は4つのステップで行います:
この記事では、女性服のストアを例に説明します。
メタフィールドの作成
- トップページに移動し、左下の設定 > メタフィールドをクリックします。
- メタフィールドページでは、商品、商品カテゴリ、商品バリエーション、ページ、顧客、ブログ、ブログカテゴリ、および注文のメタフィールドを定義できます。ここでは、例として商品を取り上げます。
- <strong>フィールドを追加</strong>をクリックします。
- 商品メタフィールドの定義を追加します。
- フィールド名:SHOPLINE管理画面でメタフィールドを識別するために使用します。例:Color(色)。
- 名前空間とキー:メタフィールドの一意の識別子です。名前空間を使って類似のメタフィールドをグループ化できますが、各名前空間とキーは一意でなければなりません。例:「custom.color」。
- 説明(任意):メタフィールドに入力する値などの説明情報を提供します。
- データタイプ:メタフィールドが格納するデータの種類です。テキスト、ドキュメント、URLなどがあります。単一または複数のデータタイプの設定が可能です。
- アクセスオプション:自動生成されるコレクションを設定できます。
例えば、Sales Copy(販売用コピー)を設定し、名前空間、キー、説明を入力します。データタイプを選択します。ここではテキストを選択します。さらに、必要に応じて色、ドキュメント、数値、URL、重量、サイズなども選択できます。
テキストを選択すると、<strong>単一行テキスト</strong>または<strong>複数行テキスト</strong>の選択ボックスが表示されます。要件に応じて<strong>複数行テキスト</strong>を選択し、内容を入力して<strong>追加</strong>ボタンをクリックします。
<strong>作成が完了すると、自動的にリストページに戻り、作成成功を確認するポップアップが表示されます。リストの最上行には新しく作成されたメタフィールドSales Copyが表示され、フィールド値の数は現在0です。</strong>
メタフィールドへの値の割り当て
要件に応じて、商品に対して複数のメタフィールドを作成できます。例えば、詳細画像-色表示、詳細画像-生地表示、販売用コピー、商品ケアガイドなどです。メタフィールドを作成した後、商品管理ページに戻り、各必要な商品のメタフィールドに対応する値を入力する必要があります。
-
商品 > 商品詳細 ページに移動します。
- ページの一番下までスクロールすると、メタフィールドのテキストボックスが表示されます。該当するフィールドに入力または画像を追加し、入力後に更新をクリックします。
- 完了したら、右上の更新をクリックし、複数の商品に対して上記の手順を繰り返します。
- メタフィールド管理ページに戻ります。フィールド値の数が0から1に変わっており、これは「セールスコピー」メタフィールドに値が割り当てられた商品の数を示しています。
要件に応じたストア構築時のメタフィールドの選択
メタフィールドを作成し値を割り当てた後、ストア構築で統一的な設定のためにメタフィールドを選択できます。
- 商品詳細の下に画像付きテキストパーツを追加し、メイン画像と生地情報を表示します。
- <strong>画像付きテキスト</strong>パーツをクリックし、アイコンをクリックしてメタフィールドを追加します。
- <strong>画像付きテキスト</strong>のタイトルを選択し、右上のアイコンをクリックして動的ソースを商品タイトルに変更し、最後に保存をクリックします。
- テキストを選択し、右上のアイコンをクリックして動的ソースをセールスコピーに変更し、次に保存をクリックします。
メタフィールドの修正
メタフィールドの修正、値の変更、表示方法の変更も可能です。
- メタフィールドの修正: トップページの左下をクリックし、設定 > メタフィールド > 商品 > 商品メタフィールドに進み、特定のメタフィールドをクリックします。
この時点で、フィールド名と説明のみを修正できます。
- メタフィールドの値の変更: 商品 > 商品管理詳細ページ > メタフィールドセクションに進み、メタフィールドをクリックして直接修正し、修正を保存します。
- 表示の修正: メタフィールドをクリックし、値を修正、動的ソースを変更、動的ソースを削除から選択します。
- 値を修正: 商品管理画面にリダイレクトされ、商品メタフィールドの値を直接修正できます。
- 動的ソースを変更: 別のメタフィールドに切り替えることができます。
- 動的ソースを削除: 直接削除するか、キーボードの削除キーを押して削除します。
実用的な提案
1. フィールドを独立して拡張し、商品詳細ページを柔軟にカスタマイズする
優れた商品詳細ページは、顧客が購入判断に必要な情報を提供できます。競争の激しい越境ECマーケットでは、細部が成功を左右します。マーチャントが商品詳細ページで独自の詳細を顧客に示すことができれば、より多くの顧客の好意と信頼を得て、差別化された競争優位を形成し、競合他社を凌駕することが可能です。
例えば、マーチャントが商品の洗濯情報を追加したい場合、その商品に洗濯情報の拡張フィールドを作成できます。これにより、顧客は商品詳細ページで洗濯情報の注意事項を確認でき、商品への信頼と好意が高まり、洗濯ミスによる返品の可能性を減らせます。
洗濯情報に加え、マーチャントは必要に応じて素材、原産地、サイズなどの情報をメタフィールドを通じて商品詳細ページに追加できます。
2. 簡単なコードカスタマイズ: パーソナライズされた機能要件の実装
| 注意: 開発者はメタフィールド概要に進むことができます。 |
より多くの情報を柔軟に表示できるだけでなく、メタフィールドは特定のビジネスシナリオに基づくパーソナライズされた機能要件のカスタマイズにも利用できます。これにより、マーチャントがストアをカスタマイズする過程で直面する技術的コストや技術的障壁を効果的に低減できます。
例えば、商品説明のTAB切り替えの実装、関連資料のダウンロードセクションの追加、または関連商品レコメンドセクションの追加などがあります。
-
商品説明のタブ切り替え:商品詳細ページには多くの情報を表示する必要がある場合があります。すべての情報を商品詳細ページに配置すると、ページが散らかって見え、顧客が探している情報をすぐに見つけにくくなり、ショッピング体験が悪化し、顧客の離脱につながる可能性があります。そのような場合、マーチャントはTAB切り替えテンプレートを使用して情報を分類・整理し、単一のコンテンツボックス内で均一に表示できます。顧客はタブを切り替えることで異なる情報カテゴリを閲覧できます。この方法により、商品詳細ページに表示される情報は包括的でありながら、視覚的な魅力も保たれます。以前は、この機能をページに追加したいマーチャントは、開発のために技術者を雇うために追加費用がかかり、便利ではありませんでした。メタフィールド管理ツールを使えば、マーチャントは独自に新しい拡張フィールドを作成し、基本的なTAB切り替えテンプレートのコードをコピー&ペーストするだけで済みます。これにより、商品説明のTAB切り替えテンプレートを簡単に設定し、商品詳細ページに表示できます。
-
関連資料のダウンロードセクションの追加:すべての情報を商品詳細ページに直接表示できるわけではありません。設置マニュアルや素材構成説明など、内容が多岐にわたる必要な資料説明は、文書の形で顧客に提供する方が適しています。メタフィールドを使うことで、マーチャントは関連資料のダウンロードリンクを対象商品に追加でき、顧客はクリックして資料をダウンロードし、ローカルで閲覧できます。
- 関連商品レコメンドセクションの追加:データによると、個別の商品詳細ページに関連商品レコメンドを組み込むことで、顧客のページ滞在時間が効果的に増加するだけでなく、ストアの平均取引額も向上します。以前は、関連商品レコメンドを実装するために特定のアプリが必要でした。メタフィールド管理ツールを使えば、マーチャントはいつでもどこでも簡単に関連商品レコメンドモジュールを作成できます。商品、カテゴリ、顧客、注文、ブログ、ページ、ストアなどのリソースに対して拡張フィールドを作成し、特定の情報を保存できるだけでなく、メタフィールドはAdmin APIを通じて他のeコマースシステム(CRM/IMS/ERP)とのデータ送受信や連携も促進します。これにより、SHOPLINEストアは他のシステムとよりシームレスに連携でき、マーチャントはさまざまなデータを便利に管理・閲覧できます。
この記事はAIを使用して翻訳されており、不正確な箇所が含まれている可能性があります。最も正確な情報については、元の英語版をご参照ください。