製品情報を効果的に提示する能力は、電子商取引の生命線です。しかし、商人は、豊かさが過負荷に変わるというもどかしいパラドックスに直面することがよくあります。厳格なレイアウト、無味乾燥なプレゼンテーション、雪崩のように情報が押し寄せると、製品の魅力がかき消され、顧客は当惑し、関心を失ってしまいます。
これらの障害に対処するために、 Conceptテーマは、製品コミュニケーションを合理化し、最適化するように設計された強力なツールである製品詳細セクションを提供します。このセクションでは、販売業者が仕様に焦点を当てて、明確かつ簡潔な製品説明を作成できるようにします。

このチュートリアルでは、「製品の詳細」セクションを段階的に構成する方法を示します。
A. この機能はどこにありますか

B. 製品詳細の設定
1. セクションの設定
2. ブロック設定
2.1.説明
このブロックは、有益で魅力的な説明を活用して、製品の詳細を最適に紹介し、顧客エクスペリエンスを向上させることを目的としています。

見出し- ブロックのタイトル。 (例:説明)
[説明]ブロックには、管理ダッシュボード> [製品] > [Flow Harmony]にある[製品の説明] フィールドの内容が入力されます ( Flow Harmony はこの記事のサンプル製品です)。参考までに、下の2枚の画像をご覧ください。
説明ブロック | フローハーモニー製品 |
---|---|
![]() | ![]() |
2.2.折りたたみ可能な行
折りたたみ可能なタブを使用して、顧客が十分な情報に基づいて購入の意思決定を行えるようにする補足情報を便利に表示します。

- 見出し- ブロックのタイトル
行の内容- 顧客の理解を深め、自信を持って購入の意思決定を容易にする詳細を提供するメタフィールド(メタフィールド アイコン)を入力または選択します。
メタフィールドのアイコン:
- メタフィールド- 値を保持するメタフィールドの名前空間とキーを入力します。各メタフィールドは独自の行になければなりません。
例えば:
このFlow Harmony製品の例では、プログラムでサウンドメタフィールドを取得することによって行コンテンツの値が決定され、データの一貫性と正確な表示が保証されます。
行の内容 | フローハーモニー製品 |
---|---|
![]() | ![]() |
製品情報をさらに強化するために、メタフィールド: tech_specs.battery
にバッテリー メタフィールドの名前空間とキーを正確に入力することにより、バッテリー情報が追加されました。

2.3.仕様
仕様ブロックの構成プロセスでは、次の 2 つのアプローチが提供されます。
2.3.1.マニュアル仕様追加
最初のメソッドの動作を視覚化してみましょう。 Flow Harmony 製品の5 つの仕様を表示するには、次の手順に従います。
- 5つの仕様ブロックを追加
- 関連するアイコンとテキストを使用して各ブロックをカスタマイズします
視覚的なサポートを提供するために、以下の 2 つの画像は追加のコンテキストを提供します。


2.3.2.メタオブジェクトとメタフィールドの統合
2 番目の方法では、 MetaobjectとMetafieldの組み合わせの力を利用します。ここで、メタオブジェクトはすべての製品仕様の集中リポジトリとして機能し、個々のメタフィールドは特定の製品ごとに仕様を動的に表示します。
このプロセスは、次の 3 つの主要なステップで構成されます。
- メタオブジェクトの作成
- メタフィールドの作成
- 仕様ブロック構成
1. メタオブジェクトの作成
管理者ダッシュボードから設定に移動します。
[設定]で、 [カスタム データ]タブ > [定義の追加]をクリックします。
[定義の追加]をクリックすると、次のウィンドウが表示されます。
参考として、データの配置が以下の画像に示されている例と一致していることを確認してください。
名前-
Tech spec
を入力しますフィールド-ファイルと単一行テキストを選択します
ファイル-名前に
Icon
を入力し、 1 つのファイルを選択します。単一行テキスト- [名前]に
Label
と入力し、 [1 つのファイル]を選択します。
このステップが完了すると、メタオブジェクトの構成は、以下の画像の視覚的表現を反映したものになります。
メタオブジェクトの作成に続いて、包括的な製品仕様 (ヘッドフォン、 USB-C ケーブル、1.25 m 、スピーカーなど) を設定します。これは次の方法で実現します。
エントリの追加をクリック
代表的なIconを選択し、 Labelにテキストを入力します。
たとえば、ここでは「USB-C ケーブル、1.25 m」というエントリを追加します。
残りの「Entry」値に対してこのプロセスを繰り返します。
このステップを完了すると、メタオブジェクト技術仕様にはすべての製品エントリ (この例では 8 つのエントリがあります) が包括的に格納され、仕様情報の中央リポジトリとして機能します。

2. メタフィールドの作成
このステップには、各製品に固有の固有の値を保持するように設計された「技術仕様」という名前の新しいメタフィールドを確立することが含まれます。
新しいメタフィールドを作成するには、管理者ダッシュボードから設定>カスタム データ>製品>定義の追加に移動します。
名前-
Tech specs
を入力します名前空間とキー-
custom.tech_specs
を入力します「選択」タイプでメタオブジェクトを選択します
参照では、 [技術仕様]を選択し、次に[エントリ タイプのリスト]を選択します。
「保存」をクリックしてこのステップを終了します。
このステップを完了すると、新しく作成されたメタフィールドがすべての製品に自動的に設定されます。これで、必要に応じて個々の製品に特定の値を割り当てることができます。
たとえば、 Flow Harmony製品 >技術仕様>エントリの選択>リスト内のこの製品のエントリを選択します。
3. 仕様ブロックの構成
「製品の詳細」セクションの「仕様」ブロックに戻ります。
この手順では、右上にあるメタフィールド アイコンをクリックして技術仕様メタフィールドを選択するだけです。
指定された製品仕様が自動的に入力されます。
この記事がお役に立てば幸いです。この機能についてご質問やご不明な点がございましたら、お気軽に弊社チームのサポートまでお問い合わせください。
さらに支援が必要です
コンセプト テーマに関して問題が発生した場合、または追加のサポートが必要な場合は、8 時間以内にチケット システムを通じてサポート担当者にご連絡ください。
以下の QR コードをスキャンして WhatsApp コミュニティに参加し、最新情報、ニュース、お知らせを入手してください。
Share:
製品ページでサイズ表を有効にするにはどうすればよいですか?
おすすめ商品セクションの追加