Customizing rendering variants
Overview of rendering variants and how they are configured.
Rendering variants give you the ability to use the same rendering in different ways. For each rendering variant, you can structure and style the HTML to display information in a particular way and you can expose different content for each variant. The following examples show how a rendering variant is used to change the position of an image from the left to the right, and to remove it all together.
All SXA and Commerce renderings use a standard Razor view and code behind approach. In addition, some renderings also use rendering variants implemented in one of the following ways.
Rendering variants - Scriban
Scriban templates give you more flexibility over the rendering markup and functionality than using standard SXA field renderers and make it easier to customize the rendering variant. Scriban templates are stored in SXA Storefront rendering variants and are available in the Content Editor (/sitecore/Content/Sitecore/Storefront/Presentation/Rendering Variants).
Rendering variants - Field renderers
Some renderings have commerce-specific rendering variants (for example, the Page Content rendering and Product Information rendering variant) that are based on field renderers, which include:
Variant field that reads the values from the Sitecore item using the same type as the Sitecore item itself.
Variant section, which is a wrapper that creates the HTML element.
Variant text field, which is used for text constants.
Variant date field, which enables you to define the date format.
Variant placeholder that creates a placeholder so that other components can be embedded in the rendering variant.