Render catalog content

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.content model. This provides out-of-the-box functionality also 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 {}
}

See Catalog contentCatalog content for information about defining content types.

Define rendering templates

You can display Commerce Connect catalog content on your website by creating a rendering template (MVC) in the same way you would for the Optimizely Content Management System (CMS) content (see RenderingRendering). 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 routepartial 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 Render contentRender content in CMS.

Register routing

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