レイアウト内の製品リスト

  • リリースバージョン: Australia
  • 更新日 2026年03月12日
  • 所要時間:4分
  • CPQレイアウトで製品リストを定義およびカスタマイズして、部品表 (BOM) と製品の詳細からのデータを表示します。レイアウト CSV ファイルまたはレイアウトエディターでリストの配置、列、および表示設定を構成して、明確で構造化された製品と価格情報をエンドユーザーに表示します。

    CPQでは、レイアウト定義はCSVファイルを介して行われます。製品リストは、部品表 (BOM) に製品と関連情報を表示できるコンポーネントです。製品リストコンポーネントを制御するレイアウトには、 productlistproductlistcolumnsの 2 種類の列があります。複数の製品リストをレイアウトに含めて、さまざまな BOM タイプの製品を表示できます。

    製品リストの定義

    レイアウト CSV ファイルで、次の列ガイドラインに従って製品リスト行を定義します。

    • 製品リストのタイプ (レイアウト CSV ファイルの列 A) は次のように定義されます productlist
    • 製品リストにはパス (レイアウト CSV ファイルの列 B) は必要ありません。空白のままにすると、製品リストが標準位置に配置されます。製品リストを階層に配置するには、階層に対する相対パスを指定します。例: /layout/tiers/myTier/myProductList

    製品リストには、値フィールドを JSON 形式で設定することで制御できる多くのプロパティがあります。

    例:

    {
      "location": "right",
      "type": "sales",
      "totalLocation": "bottom",
      "hierarchyColumn": "displayName",
      "displayZeroPriceAs": "On Request",
      "displayNullPriceAs": ""
    }

    利用可能なオプション

    • 場所 は、レイアウト内で製品リストコンポーネントを表示する場所を示します。値は、 right (デフォルト)、 leftbottom、または modalです。
    • [タイプ] は、製品の [bomType] フィールドに基づいて、この製品リストに含まれる製品を決定します。値は、 salesmanufacturing、またはアドミンによって製品で指定された任意のカスタムタイプにすることができます。複数の BOM タイプを含めることができます。たとえば、type: sales, customBOMTypeA, customBOMTypeB,type: all です。
    • totalLocation は、カートの合計が表示される場所を決定します。有効な値は、 bottomtopboth、および noneです。
    • hierarchyColumn は、製品に子製品がある場合に展開矢印または折りたたみ矢印を表示する列を決定します。
    • displayZeroPriceAsdisplayNullPriceAs は、製品リストにゼロ価格と null 価格を表示する方法を決定します。表示値は、「要求に応じて」などの任意の文字列にすることができます。0 (ゼロ) を指定すると、ロケールと記号またはコード (USD 0.00 など) とともにゼロの価格が表示されます。デフォルトは空白で、指定しない場合は動作になります。

    製品リスト列

    製品リスト列は製品リストの子であり、BOM に表示される製品からのデータを使用して、表示されるデータの列を定義します。表示する製品データの列ごとに、製品リスト列を作成します。

    レイアウト CSV ファイルで、次の列ガイドラインを使用して製品リストの列行を定義します。

    • type (レイアウト CSV ファイルの列 A) 製品リスト列の行は productlistcolumn として定義されます。
    • path (レイアウト CSV ファイルの列 B) 製品リストの列は、製品リストを基準にして定義されます。たとえば、/productList/columns などです。
    • variablename (レイアウト CSV ファイルの列 E) は、製品の一致するフィールドに基づいて表示するデータを決定します。拡張製品リストの値は、[variablename] 列に extended.columnName を入力することで表示できます。たとえば、 extended.taxExemptProductList.extended.taxExempt の値を表示します。
    • classname (レイアウト CSV ファイルの列 H) を allow-wrap に設定すると、レイアウト内のその列のコンテンツを折り返すことができます。 value (レイアウト CSV ファイルの列 I) は、レイアウト内の列の表示スタイルを定義します。
      • value列では幅を指定できます。例: {"width":"10%"}
      • 幅を指定する場合は、モーダルまたは下部にドッキングされた製品リストにパーセンテージを使用することをお勧めします。
      • 製品リストの幅が固定されているため、左ドッキングまたは右ドッキングの製品リストには、 px (ピクセル) などの固定単位の使用をお勧めします。chの使用はお勧めしません。

    レイアウトエディター

    製品リストとそのプロパティは、 CPQ UI のレイアウトエディターを使用して編集できます。製品リストレイアウト要素は、ページの下部にあります。

    レイアウト内の製品リスト

    レイアウトのこの部分を編集するには、マウスを移動したときに製品リストレイアウト要素の右上に表示される歯車をクリックします。製品リストには、前に参照したすべてのプロパティを含む設定画面があります。

    レイアウト内の製品リスト

    詳細については、「レイアウトでの複数の製品リストの表示」を参照してください。