Sitecore Experience Accelerator

Customize rendering HTML per site

Abstract

Override the component view path.

All SXA renderings come with default HTML views. If you want to change the HTML for a rendering, SXA lets you specify site-specific views for renderings. For example, if you have a site that uses the Promo rendering a lot, but you don't like the HTML view, you can create a custom Promo rendering with a different HTML view. SXA will try to find overriden views under the specified path and if a site-specific view file exists, this file will be rendered. Otherwise, the functionality will fallback to the view from default views location. 

To create the site-specific view folder:

  1. Navigate to C:\inetpub\wwwroot\Site\Website\ and create a new folder to store the site-specific views. For example, create a Custom Views folder for a customized component HTML for the Promo rendering: C:\inetpub\wwwroot\Site\Website\MyCustomViews\

  2. Your new folder must have the same structure as in the root folder. Therefore, you must add a Views folder: C:\inetpub\wwwroot\Site\Website\MyCustomViews\Views\

  3. If, for example, you want to customize the Promo component, go to C:\inetpub\wwwroot\Site\Website\Views, copy the Variants folder and paste it in the Views folder you just created:

    C:\inetpub\wwwroot\Site\Website\MyCustomViews\Views\Variants\Promo.cshtml

  4. Navigate to C:\inetpub\wwwroot\Site\Website\Views, copy the web.config file and paste it in the folder you just created.

  5. Modify the HTML.

  6. In the Content Editor, navigate to sitecore/Content/Tenant/Site/Settings and in the Site Configuration section, in the CustomRenderingViewPath field specify the relative path to the folder that you just created.