Create custom views for the Content list widget

To define a custom List view that you can use with the Content list widget, perform the following:

1. Create a .cshtml file.
   The file name must not start or end with Details. 
   
2. Place it in Views/Shared/Componenents/SitefinityContentList/ directory in the root of your project.
   If such folder does not exist, you must create it.
   
3. The model for the view must be of type:
   @model Progress.Sitefinity.AspNetCore.Widgets.Models.ContentList.ContentListViewModel
   

The ContentListViewModel class has a method T GetValue<T>(string name) which works with the field mappings, described below. The name argument of the function accepts one of the mappings defined for this view and automatically maps the name to the field name, selected in the user interface for the current content type.

Additionally, the ContentListViewModel has a property, called Items, which contains all the content items that need to be rendered. These items are of type Progress.Sitefinity.RestSdk.Dto.SdkItem, which is the base class for working with the RSET services in Sitefinity CMS.

GITHUB EXAMPLE: To see a custom list view, see the Extended Content list » CardsListCustom.cshtml sample on Sitefinity GitHub repository. 

To define a custom Detail view that you can use with the Content list widget, perform the following:

1. Create a .cshtml file.
   The file name must be in the format Details.<customname>.cshtml. 
   
2. Place it in Views/Shared/Componenents/SitefinityContentList/ directory in the root of your project.
   If such folder does not exist, you must create it.
   
3. The model for the view must be of type:
   @model Progress.Sitefinity.AspNetCore.Widgets.Models.ContentList.ContentDetailViewModel
   

The ContentDetailViewModel contains a property called Item, which refers to the currently rendered item. The item property is of type Progress.Sitefinity.RestSdk.Dto.SdkItem. This class contains a method called T GetValue<T>(string fieldName), by which the field values of the content item can be accessed. 

For example, you can asceses a ShortText field value in the following way:
Model.Item.GetValue<string>("MyShortTextFieldName"))

GITHUB EXAMPLE: To see a custom list view, see the Extended Content list » Details.Custom.cshtml sample in Sitefinity GitHub repository.

GITHUB EXAMPLE: To see a custom list view, see the All fields sample in Sitefinity GitHub repository.

The Content list widget implements a new concept for view reusability across different content types. This concept is called field mappings. The view has its own abstract set of fields that it can work with. Then, these fields are mapped to the field names of the content type. Thus, the view knows that it can work with a predefined set of fields and can be reused for several different content types.

The workflow is the following:

1. The developer defines a set of views (razor .cshtml files) for the content list widget and provides mappings for these views.
2. The developer implements the view logic with the predefined set of fields.
3. The views and their mappings appear in the UI for the marketer to use.
4. The marketer builds a page to display content items on that page, selects the content type, and selects one of the views that the developer has provided.
5. The mappings are regenerated for the specific view and the marketer selects the ones that are appropriate for the currently selected type.

The relation between views and field mappings is controlled by a ViewsMetadata.json file that is located in the Views/Shared/Componenents/SitefinityContentList/ViewsMetadata.json directory.

GITHUB EXAMPLE: To see a custom list view, see the Extended Content list » ViewsMetadata.json sample in Sitefinity GitHub repository.