--- title: "レンダリングバリアントのカスタマイズ" slug: "customizing-rendering-variants" abstract: "レンダリングバリアントの概要とその構成方法。" --- # レンダリングバリアントのカスタマイズ レンダリングバリアントは、同じレンダリングを異なる方法で使うことができます。各レンダリングバリアントごとに、HTMLを特定の方法で表示するように構造化やスタイルを付けることができ、バリアントごとに異なるコンテンツを公開できます。以下の例は、レンダリングバリアントを使って画像の位置を左から右に変えたり、完全に削除したりする方法を示しています。 ![Rendering variant - image position left](https://doc.sitecore.com/api/markdown-image/xp/ja/developers/100/sitecore-experience-commerce/images/Promo_image_left_variant.jpg) ![Rendering variant - image position right](https://doc.sitecore.com/api/markdown-image/xp/ja/developers/100/sitecore-experience-commerce/images/Promo_image_right_variant.jpg) ![Rendering variant - no image](https://doc.sitecore.com/api/markdown-image/xp/ja/developers/100/sitecore-experience-commerce/images/Promo_image_text_only_variant.jpg) すべてのSXAおよびCommerceレンダリングは、標準的なRazorビューとコードの背後方式を採用しています。さらに、一部のレンダリングは以下のいずれかの方法で実装されたレンダリングバリアントも使用しています。 > !ヒントSXAレンダリングのバリエーションに関する短い [動画](https://www.youtube.com/watch?v=HyMCJ0zhbK8&list=PL2bl35t0WZd0abyx-x6CrqitasCkJAfRd) はYouTubeで見ることができ、Discover SitecoreチャンネルではScribanテンプレートに関する [動画](https://youtu.be/HgwnRTYtTXs) も見つかります。 ## レンダリングバリアント - Scriban [スクリバンテンプレートは](https://doc.sitecore.com/xp/ja/developers/100/sitecore-experience-commerce/working-with-scriban-templates.html "Working with Scriban templates") 、標準的な[SXAフィールドレンダラー](https://doc.sitecore.com/xp/en/users/sxa/100/sitecore-experience-accelerator/the-sxa-renderings-and-rendering-variants.html) よりもレンダリングマークアップや機能に対して柔軟性があり、レンダリングバリアントのカスタマイズも容易になります。スクリバンテンプレートはSXAストアフロントレンダリングバリアントに保存され、コンテンツエディター(*/sitecore/Content/Sitecore/Storefront/Presentation/Rendering Variants*)で利用可能です。 ## レンダリングバリアント - フィールドレンダラー 一部のレンダリングには、フィールドレンダラーに基づく商業特有の [レンダリングバリアン](https://doc.sitecore.com/xp/en/developers/sxa/100/sitecore-experience-accelerator/build-a-rendering-that-includes-variants.html) ト(例えば、ページコンテンツレンダリングやプロダクト情報レンダリングバリアント)があり、以下のようなものがあります。 - Sitecoreアイテムと同じ型でSitecoreアイテムの値を読み取るバリアントフィールドです。 - バリアントセクションはHTML要素を作成するラッパーです。 - テキスト定数に使われるバリアントテキストフィールド。 - 日付形式を定義できるバリアント日付フィールド。 - 他のコンポーネントをレンダリングバリアントに埋め込むためのプレースホルダーを作成するバリアントプレースホルダー。