Populating Sitecore mvc model in .net mvc view

By Pranay  ·  08 Jan '15  ·  6010 views

Yes, we can pass a sitecore populated view to a .net razor view in Sitecore with MVC. Here, I will go through a simple example on how to display social links to a website whose link name and its URL is provided at sitecore content item but needs to be rendered inside a razor view (.cshtml file).

Create C# Model classes.

Create a Model class called SocialLinks in c# as shown below.


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Sitecore;
using Sitecore.Mvc.Presentation;
using Sitecore.Data.Items;
using Sitecore.Web.UI.WebControls;
namespace Sitecore.MyProjSolution.Website.Models 
    public class SocialLinks : List<SocialLinks>, IRenderingModel
        public Sitecore.Mvc.Presentation.Rendering Rendering { get; set; }
        public Item Item { get; set; }
        public Item PageItem { get; set; }
        public virtual string Title { get; set; }
        public virtual string URL { get; set; }
        public List<SocialLinks> SocialLinksItems = new List<SocialLinks>();
        public SocialLinks() { }
        public SocialLinks(Item item)
            this.Title = FieldRenderer.Render(item, "Title");
            this.URL = FieldRenderer.Render(item, "Link");
        public void Initialize(Sitecore.Mvc.Presentation.Rendering rendering)
            Rendering = rendering;
            Item = rendering.Item;
            PageItem = PageContext.Current.Item;
            foreach (Item child in rendering.Item.GetChildren())
                SocialLinks obj = new SocialLinks(child);

Create Sitecore Models.

From sitecore content editor create a new Model with some name say SocialLinksModel.

  1. Go to Layouts->Models, right click on Models and then click on Insert-> Model.

  2. Provide the field values for the Model as shown below.

    Model Type: Sitecore.MyProjSolution.Website.Models.SocialLinks,Sitecore.MyProjSolution.Website

  3. Save and publish the item.

Create view rendering and view file.

From sitecore content editor, create a view rendering with name SocialLinksRendering.

  1. Go to Layouts->Renderings, right click on Renderings and select Insert->View Rendering. Give the name as SocialLinksRendering and with below mentioned field values.

    • Path: Path to the razor view file say “/Views/Shared/SocialLinks.cshtml“.
    • Model: Click on insert link and select the sitecore Model we have created ‘SocialLinksModel’.
    • PlaceHolder: This is the placeholder in the Layout file where this view rendering should be rendered.
  2. Save and publish the item.


    @model Sitecore.MyProjSolution.Website.Models.SocialLinks
    <div class="container">
        <div class="row social">
           <ul class=" list-inline pull-right">
                @foreach (var item in @Model.SocialLinksItems)
                    <li> <a href="@item.URL" title ="@item.Title" rel="nofollow" target="_blank">
                    <i class="social-item"></i>

Create sitecore content items/data source.

Create an item under Content in Sitecore and name it as SocialLinksDataSource.

  1. Right click on Content and click on insert-> Insert from Template.
  2. Select a template without any data fileds inside if none exists create a new template without any data fields and select that template here.

    • Create a child item to SocialLinksDataSource. Right click on SocialLinksDataSource and click on insert -> Insert from Template, select a template which has two fields Title (Single line Text), Link (Single line Text) ( If there is no template with such fields then create a new template and select that template) name the Item as say Facebook and provide the below field values.

      • Title: Facebook
      • Link: http://www.facebook.com/MyPage
    • Similarly create one more item under the parent item SocialLinksDataSource and name it as Twitter with below mentioned field values.

      • Title: Twitter
      • Link: http://www.twitter.com/MyPage

About the author

Pranay Deegoju
Sitecore Certified Professional

A Software Engineer by profession, a part time blogger and an enthusiast programmer. You can find more about me here.

Leave your comments on this post here


Liked this article?

Subscribe with your email and get updates when ever a new article is posted.

By subscribing you agree to our privacy terms. We promise that we do not sell your data.