レンダリングバリアントを使用して製品情報を表示する

SXA Storefrontをインストールすると、SXAレンダリング バリアントが /sitecore/Content/Sitecore/Storefront/Presentation/Rendering Variantsフォルダーにインストールされます。ページ コンテンツ レンダリングでは、追加のコマース固有のレンダリング バリアントを使用して、名前、説明、およびその他の製品フィールドを1つのSXAコンポーネントで表示することができます。これにより、エクスペリエンス エディター ツールボックスのCommerce Catalogセクションで使用できるProduct Informationコンポーネントに代わるものが提供されます。

SXAレンダリング のRich TextとTitleをカタログ アイテムにも使用できます。これを行うには、製品の説明や表示名などを表示できるカスタムレンダリングバリアントを作成します。カタログ項目は、デフォルトのレンダリングバリアントで使用されているものとは異なるフィールド名を使用するため、カスタムレンダリングバリアントを作成する必要があります。

ストアフロントでは、1つのページを使用してさまざまな商品を表示します。 CatalogItemResolverパイプライン プロセッサは、現在の製品コンテキストを設定します。

SXAレンダリング バリアントで製品アイテム フィールドを使用できるようにするために、ResolveCatalogContextパイプライン プロセッサは、次の条件に基づいて、これらのレンダリングのデータ ソースを現在の製品に動的に設定します。

SXAストアフロントの商品ページでは、ページ コンテンツ レンダリングのバリアントを使用して商品情報を表示します。製品情報レンダリングには、次のフィールドが含まれています。

ページ・コンテンツ・レンダリングをページに挿入して、製品情報を表示できます。エクスペリエンス エディターでこれを行うには、ツールボックスからレンダリングをページにドラッグし、ドロップダウン メニューからProduct Informationバリアントを選択します。

エクスペリエンス エディターでのレンダリング バリアントの動作

エクスペリエンスエディターで商品が選択されている場合、Product informationバリアントにはコマースシステムからの商品情報が表示されます。

Commerce商品情報レンダリングとは異なり、Page Contentレンダリング バリアントはプレースホルダー データを表示できません。フィールドのデータが使用できない場合、ページ コンテンツ レンダリングにはフィールド名 ( Features fieldなど) が表示されます。製品が選択されていない場合、製品のタイトルは * と表示され、すべてのフィールドにフィールド名が表示されます。

ライブストアフロントでのレンダリングバリアントの動作

ライブストアフロントには、商品情報が表示されます。フィールドに使用できるデータがない場合、そのフィールドは非表示になります。

製品情報を表示する別の方法は、2つのレンダリング バリアントを使用することです。