Subscribe: SharePoint SharePoint SharePoint

Sunday, February 2, 2014

New Delegate Controls in SharePoint 2013

Delegate Controls are very significant medium to make changes to master page without touching the code part. In SharePoint 2010, we had a lot of delegate controls. To name a few we had : AdditionalPageHead, SmallSearchInputBox etc.

Now in SharePoint 2013, three new delegate controls were introduced. These were actually based on the new master page structure in SP 2013. Since in SharePoint 2013 we have "suites" defined in layout i.e left suite bar and right suite bar, so the delegate controls are based on them.

They may be summarized as below:

  • PromotedActions
  • SuiteBarBrandingDelegate
  • SuiteLinksDelegate

  • PromotedActions delegate control is that part of header which contains links like "Share","Edit" etc. So we can use this delegate control to add our own controls to the header as shown below:

    SharePoint Delegate Controls
    And the code for user control is as simple as :

     <a title="Open Facebook" class="ms-promotedActionButton" style="display: inline-block;" href="http://www.facebook.com">  
     <span class="s4-clust ms-promotedActionButton-icon" style="width: 16px; height: 16px; overflow: hidden; display: inline-block; position: relative;">  
     <img style="position:absolute;" alt="facebook" src="/_layouts/15/images/MyDelegateControls/facebook.png"/>  
     </span>  
       <span class="ms-promotedActionButton-text">Post on Facebook</span>  
     </a>  
    

    SuitingBarBrandingDelegate  Delegate Control facilitates us to override the left-top corner text for the site. By default it is "SharePoint". So we can replace it with the title of our own site:

    SharePoint Delegate Controls


    User Control: (SuiteBarBrandingDelegateCustom ascx)
     <div class="ms-core-brandingText" id="SiteTitleControl" runat="server" />   
    
    Code behind: (SuiteBarBrandingDelegateCustom.ascx.cs)
     protected void Page_Load(object sender, EventArgs e)  
     {  
       SiteTitleControl.Controls.Add(new Literal  
       {  
         Text = string.Format("<a href='{0}'><img src='{1}' alt='{2}' /></a>", SPContext.Current.Site.Url,  
         "/_layouts/15/images/MyDelegateControls/sitelogo.png", SPContext.Current.Site.RootWeb.Title)  
       });  
     }  
    

    SuiteLinksDelegate delegate control allow us to add  links in right suite bar like "Newsfeed","Sites" etc. :

    SharePoint Delegate Controls


    User Control Code Behind:
     protected override void Render(HtmlTextWriter writer)  
       {  
         writer.RenderBeginTag(HtmlTextWriterTag.Style);  
         writer.Write(".ms-core-suiteLinkList {display: inline-block;}");  
         writer.RenderEndTag();  
         writer.AddAttribute(HtmlTextWriterAttribute.Class, "ms-core-suiteLinkList");  
         writer.RenderBeginTag(HtmlTextWriterTag.Ul);  
         RenderSuiteLink(writer, "http://www.myreports.com", "Report", "TimeManagement", false);  
          writer.RenderEndTag();  
         base.Render(writer);  
       }  
    

    Note : For all these delegate controls , you need to add a reference in Elements.xml file to specify the control id and control source properties:
     <?xml version="1.0" encoding="utf-8"?>  
     <Elements xmlns="http://schemas.microsoft.com/sharepoint/">  
      <Control ControlSrc="/_controltemplates/15/MyDelegateControls/UserControl.ascx"  
          Id="DelegateControlID" //ID of DelegateControl e.g. "SuiteLinksDelegate"  
          Sequence="1" />  
     </Elements>  

    0 comments:

    Post a Comment