Work with CMS components

Describes the CMS components in Optimizely Configured Commerce.

var cartPage = this.InitializePageWithParentType<CartPage>(typeof(HomePage));

Pages

A Page refers to a webpage hosted within the Content Management System. Pages can be created from predefined templates that come with Configured Commerce, user defined Templates or can be custom built.

Custom pages

When implementing a custom page, derive a class from the ContentPage if the new page should be navigated to. If the new custom page should show in the navigation menu but not be navigated to directly, derive from AbstractPage.

The MVC views are located in the Theme/Views/Pages folder of the InSiteCommerce.Web solution. The page models (.NET classes) are included in the Insite Module for each respective page.

For example, the CartPage class serves as the model for the Standard cart view.

public class CartPage : ContentPage, ICreatableContent
            {
            }

Custom built pages require deriving from the ContentPage class and implementing the ICreatableContent interface. When custom pages are built using this best practice the platform will look for a corresponding content creator class that derives from AbstractContentCreator using generics of the page class name.

For example, the CartPageCreator is built as follows.

public class CartPageCreator : AbstractContentCreator<CartPage>
{
    /// <summary>Creates an initial <see cref="CartPage"/></summary>
    protected override CartPage Create()
    {
        var now = DateTimeProvider.Current.Now;
        var cartPage = this.InitializePageWithParentType<CartPage>(typeof(HomePage));
        cartPage.Name = cartPage.Title = "Cart";
        cartPage.Url = "/Cart";
        cartPage.ExcludeFromNavigation = true;
        this.SaveItem(cartPage, now);
        this.SaveItem(this.InitializeWidget<PageTitle>("Content", cartPage), now);
        var cartView = this.InitializeWidget<CartView>("Content", cartPage);
        this.SaveItem(cartView, now);
        var crossSells = this.InitializeWidget<WebCrossSells>("Content", cartPage);
        this.SaveItem(crossSells, now);
        return cartPage;
    }
}
               ```
For example, the following initializes the shopping cart as a child of the Home menu item.

Building the custom page within the hierarchy is done by using the InitializePageWithParentType method located in the AbstractContentCreator base class.

### Custom page hierarchy

When creating custom pages the content creator will default to a view called Standard. This means that for all custom pages the folder with the same name as the content page needs to exist in the theme Views/Pages folder.

- Order approval
- Checkout
- Review and pay
- Account settings
- My account
- RMA
- RFQ
- Wish lists

The AuthenticatedContentPage class is used for pages that require authentication to access profile data. This includes, but is not limited to:

These properties are the same fields that can be edited when creating pages using the Add Page feature in the CMS.

- Title
- MetaDescription
- MetaKeywords
- Summary
- HideHeader
- HideFooter
- DisallowInRobotsTxt
- ExcludeFromNavigation
- ExcludeFromSignInRequired
- Css
- Javascript

ContentPage is the base class for all commerce pages not created from within the content management system. The following properties can be set using the ContentPage class:

When creating custom pages the choice should be made to use ContentPage or AuthenticatedContentPage.

The page creator will call an override Create method with the return type of the page class. By following this pattern it is possible to build additional pages from code that fit into the commerce workflow.

Updated 10 months ago