Friday, February 13, 2015

Change ‘SharePoint’ in top left bar in Sharepoint 2013 with Logo

‘SharePoint’ on the top left of the new SharePoint 2013 site (in the blue bar) can be replaced by overriding one of the new Delegate Controls.This text is displayed using ‘SuiteBarBrandingDelegate‘ delegate control and to change it, you would need to Override SuiteBarBrandingDelegate with you own custom control and deploy it in your farm.
Because We’re So Good, Our Content gets Copied very Often.If you are not reading this on LearningSharePoint.com, please read the Original article Here for details, comments and updates on this post.

In this post we will look at the detailed steps to replace the text ‘SharePoint’ with a Company ‘Logo’ using the custom SuiteBarBrandingDelegate control.
Result –

Steps –
1. Create an empty SharePoint project.
Create Custom Suite bar delegate Control SharePoint 2013
2. Next add a new User Control Item.
Create Custom Suite bar Delegate Control SharePoint 2013
3. The solution bar should look like below.
SolutionExplorer
4. Next add the code in the User Control that you added.The code will replace “SharePoint” text with a Logo. The Logo is already uploaded in the styles Library at path – ‘/Style%20Library/Images/Lsp_logo.png’.
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
namespace CustomSuiteBarBrandingDelegate.ControlTemplates.CustomSuiteBarBrandingDelegate
{
public partial class SuiteBarBrandingDelegateCtrl : UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected override void Render(HtmlTextWriter writer)
{
writer.RenderBeginTag(HtmlTextWriterTag.Style);
writer.Write(“.ms-core-brandingText {display: inline-block;}”);
writer.RenderEndTag();
writer.AddAttribute(HtmlTextWriterAttribute.Class, “ms-core-brandingText”);
writer.Write(“”);
base.Render(writer);
}
}
}
5. Next add the Elements file for the Control.
customsuitebarelement sharepoint 2013
Add the following in Elements file for Overriding the ‘SuiteBarBrandingDelegate’ Control.

< Elements xmlns=”http://schemas.microsoft.com/sharepoint/”>
< Control Id=”SuiteBarBrandingDelegate”
Sequence=”9″
ControlSrc=”/_ControlTemplates/15/CustomSuiteBarBrandingDelegate/SuiteBarBrandingDelegateCtrl.ascx”>
< /Control>
< /Elements>
6. Finally Build and Deploy.
7. Resulting Logo.
"SharePoint 2013 add Logo"

Related –
Add,Remove Links in Top Suitebar (SkyDrive,Sites,NewsFeed) in SharePoint 2013

Original article : Here

No comments:

Post a Comment