Page views (layouts) determine how pages are rendered by the web rendering engine. Multiple views may be selectable per page model, allowing a content manager to select the appropriate view for that particular page. Views are represented by Razor views. The views receive a Redakt page object as the model, containing the page content data.

We recommend to first read the section on content models for more information on how to implement content model types if you have not yet done so.

View imports

Redakt views require classes and methods that are defined in several Redakt namespaces. To be able to access them in all your views, add these references to your _ViewImports.cshtml file. A typical _ViewImports.cshtml file looks as follows:

@using MyProject.Models
@using Redakt.ContentManagement.Web
@using Redakt.ContentManagement.Annotations
@using Redakt.Extensions
@using Redakt.Extensions.Web
@addTagHelper *, Redakt.Web
@addTagHelper *, Redakt.ContentManagement.Web
@addTagHelper *, Redakt.Dictionary.Web

Inherits

Page views are inherited from the RedaktPage<TModel> abstract class, which is derived from the default RazorPage<T> class. The TModel type specifier must be a page content model, a class that implements the IContentType interface. As it is possible for views to be used for different page models, the TModel specifier can also be a shared base class or interface of several page models, or even the IContentType interface itself to allow this view to be used with any page model.

To allow a Razor view to be used as a Redakt CMS page layout, use the Razor @inherits directive as shown in the following examples:

@inherits RedaktPage<ContentPage>
@{
    // This layout can be used for ContentPage type page models
    // or any page model that derives from it.
}
@inherits RedaktPage<IContentType>
@{
    // This layout can be used for any page model,
    // which also makes it useful for the base _Layout.cshtml view.
}

Setting the @inherits directive adds some helper methods to the view and removes the necessity to specify a view model explicitly. This is the recommended way of implementing Redakt layouts. Alternatively, you can use the @model directive to specify a view model without changing the base class of the view. The model that is passed into the view is of type INodeViewModel<TModel>, where TModel is your content model type. You will be able to use the model in the way described below, but you will lose the helper methods that are on the RedaktPage class.

Model

After setting the @inherits directive to a Redakt view page type, the Model property of the view will be of type INodeViewModel<TModel>, where the TModel type specifier is the same page model type as you specified for the RedaktPage<TModel>. The INodeViewModel interface contains some properties of the page, including id, name, URL, etc. The strongly typed content data itself is accessible on the Model.Content property, which will be an instance of the TModel type. The example below demonstrates how content can be retrieved from the page model.

The Model.Content property will contain the localized content for the currently requested culture. Therefore the value of this property can be different for other requests to the same page if the site is multilingual.
@inherits RedaktPage<ContentPage>
@{
    var pageName = Model.Name;  // The name of the page
    var introText = Model.Content.IntroText;  // Example of a string property in the content
    var image = Model.Content.Summary.MainImage;  // Example of an image property in the content
}

The layout can now be further implemented as a regular Razor view, using the data and content that is available on the view model.

Layout display name

ASP.NET Core allows setting class attributes on Razor views. Redakt uses this to let you specify the display name of a view in the back office. Set the DisplayNameAttribute on the view as shown in the following code:

@inherits RedaktPage<BlogOverview>
@attribute [DisplayName("Blog Overview (condensed)")]
@{
    // The rest of the view
}

Tag Helpers

One of the most powerful new features in ASP.NET Core is tag helpers. Redakt has a number of tag helpers that can be used out of the box, aiding in the efficient implementation of page views. See the tag helpers section for more information on the available tag helpers.

Extension methods

A number of extension methods are available on the INodeViewModel interface. Add the Redakt.Extensions.Web namespace to your _ViewImports.cshtml as described above to be able to use them in your views. The available extension methods include:

  • RootAsync() to retrieve the root page of the current site.
  • ParentAsync() to retrieve the parent of the page.
  • AncestorsAsync() to retrieve the ancestors of the page.
  • ChildrenAsync() to retrieve the children of the page.
  • DescendantsAsync() to retrieve all descendants of the page.
  • SiblingsAsync() to retrieve the siblings of the page.
  • NextSiblingAsync() and PreviousSiblingAsync() to retrieve the closest siblings of the page.
In this article