Render templates

3 min

Define content types

The rendering of products and other catalog information on the front-end site can be based on the Optimizely content model. This provides out-of-the box functionality for Optimizely Commerce Connect content types such as products and variants, implementing the IContent interface. The following example shows a simple content type for a product variant.

using System;
    using System.ComponentModel.DataAnnotations;
    using EPiServer.Commerce.Catalog.ContentTypes;
    using EPiServer.Commerce.Catalog.DataAnnotations;
    using EPiServer.Core;
    using EPiServer.DataAbstraction;
    using EPiServer.DataAnnotations;
    using EPiServer.SpecializedProperties;
    
    namespace MyCommerceSite.Models.Catalog
      {
        [CatalogContentType(GUID = "8d664789-3e96-409e-b418-baf807241f7c", MetaClassName = "My_Variation")]
        public class MyVariation : VariationContent
          {
          }
      }

For information about defining content types, see Catalog contentCatalog content.

Define template rendering

You can display Commerce Connect catalog content on your website by creating a rendering template (MVC) in the same way you would for CMS content (see Rendering). The following example shows a simple controller for a product variant.

using System.Collections.Generic;
    using System.Linq;
    using System.Web.Mvc;
    using EPiServer;
    using EPiServer.Core;
    using EPiServer.Framework.DataAnnotations;
    using EPiServer.Web.Mvc;
    using MyCommerceSite.Models.Catalog;
    
    namespace MyCommerceSite.Controllers
      {
        public class MyVariationController : ContentController<MyVariation>
          {
            public ActionResult Index(MyVariation currentContent)
              {
                return View(currentContent);
              }
          }
      }

For the currentPage and currentContent properties, because the catalog is routed as a partial route to the CMS route, the currentPage gives you the PageData that the route is registered under. Default for that is the start page of the site. However, for Commerce Connect content, currentContent is the requested catalog content.

For information about templating, see RenderingRendering.

Register routing

To use a renderer template, you must register the catalog content routes. The recommended way is to do it is in an EPiServer.Framework.IInitializableModule using the CatalogRouteHelper. See RoutingRouting.