News page

This page type shows a paginated list of news items, where each one is displayed as a child page.

The news page is configured as follows:

1. Navigate to the Website area in back office, then go to Start and use the News list template to create the page.
2. Edit the news page and remember to set the Number of news per page for pagination. 
3. Create a child page of the news page using the News page template and add the content. 
4. Publish the child page and it will show up on the news page.
5. Keep going to create other child pages, as required.

Implementation

There is an MVC page that includes the following standard components:

• List and Index Razor views
• Pagination HTML helper
• News MVC Controller

Razor view

The Razor views are located under the Litium.Accelerator.Mvc\Views\News folder.

List.cshtm shows all published child pages of the news page using the NewsListViewModel that is built by the NewsListViewModelBuilder.

        private List<NewsViewModel> GetNews(PageModel pageModel, int pageSize, int pageIndex, out int totalCount)
        {
            var news = new List<NewsViewModel>();
            totalCount = 0;
            if (pageSize == 0)
            {
                return news;
            }
        
            var childPages = _pageService.GetChildPages(pageModel.SystemId, pageModel.Page.WebsiteSystemId);
            foreach (var childPage in childPages.Where(p => p.Status == ContentStatus.Published))
            {
                var newsModel = childPage.MapTo<PageModel>().MapTo<NewsViewModel>();
                newsModel.Url = _urlService.GetUrl(childPage);
                news.Add(newsModel);
            }
        
            totalCount = news.Count;
            var orderedNews = news.OrderByDescending(n => n.NewsDate).AsEnumerable();
        
            var doPageResult = pageSize > 0 && news.Count() > pageSize;
            if (!doPageResult)
            {
                return orderedNews.ToList();
            }
            
            var skip = pageSize * (pageIndex - 1);
            orderedNews = orderedNews.Skip(skip).Take(pageSize);
        
            return orderedNews.ToList();
        }

Index.cshtml shows the news items using NewsViewModel which is built by NewsViewModelBuilder.

Pagination

Pagination is rendered by the HTML helper. The view is located under Litium.Accelerator.Mvc\Views\Shared\Display Templates\PaginationViewModel.cshtml that is built by the PaginationViewModel.

    model.Pagination = new PaginationViewModel(totalCount, pageIndex, model.NumberOfNewsPerPage);

    @Html.DisplayFor(x => x.Pagination)

NewsController

NewsController serves the request to render the news page. It includes two actions, List and Index that use the Razor views above.