tag:blogger.com,1999:blog-73985452919417415862024-03-21T06:48:26.664-07:00Sharepoint Blog - CharlesCharles Tustinhttp://www.blogger.com/profile/00718461217498224333noreply@blogger.comBlogger1125tag:blogger.com,1999:blog-7398545291941741586.post-47044631026292633482010-02-10T02:03:00.000-08:002010-02-11T01:37:41.862-08:00How to deploy Custom Masterpage with Codebehind<h1>How to deploy Custom Masterpage with Codebehind</h1><strong>Custom Masterpage with custom Codebehind is strong tool for developing sites with extra functionality.</strong><br /><br />Codebehind could be attached to Masterpage also at runtime, if we update Masterpage in Sharepoint Designer and we have deployed dll with Codebehind in Global Assembly Cache (GAC).<br /><br />The easier way is to attach Codebehind to Custom Masterpage at development time in Visual Studio.<br /><br />In this article i will provide tutorial in which i describe how to deploy Custom Masterpage with Codebehind within WSP Solution package.<br /><br /><strong>You should follow these steps:</strong><br /><ol><li><a href="http://sharepoint-charles.blogspot.com/2010/02/how-to-deploy-custom-masterpage-with.html#creating-blank-site-definition">Create a Blank Site Definition</a></li><li><a href="http://sharepoint-charles.blogspot.com/2010/02/how-to-deploy-custom-masterpage-with.html#attaching-custom-masterpage-to-solution">Attach Custom Masterpage to solution</a></li><li><a href="http://sharepoint-charles.blogspot.com/2010/02/how-to-deploy-custom-masterpage-with.html#updating-site-definition">Update Site definition</a></li><li><a href="http://sharepoint-charles.blogspot.com/2010/02/how-to-deploy-custom-masterpage-with.html#add-custom-codebehind-to-project">Add Custom Codebehind to project</a></li><li><a href="http://sharepoint-charles.blogspot.com/2010/02/how-to-deploy-custom-masterpage-with.html#attach-codebehind-to-masterpage">Attach Codebehind to Masterpage</a></li><li><a href="http://sharepoint-charles.blogspot.com/2010/02/how-to-deploy-custom-masterpage-with.html#deploying-solution">Deploy solution and create Site collection</a></li></ol><br /><a name="creating-blank-site-definition"></a><h3>1) Create a Blank Site Definition</h3>- in Menu choose: File -> New -> Project<br />- in tree list navigate to Sharepoint group and choose Blank Site Definition<br />- fill the Name and Location of project and click OK<br /><br /><a title="Creating Blank Site definition" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiYSdoZRHU4f-tEoWgXqCNziARMEUHH7ASGN6Lw0pvNUhTAtn7Rj7yJaZk6pxkc0fU0piFXt2jf0wHC4m2ZXzO3D4WmV2xMwb-dDB3cpIC68T4W_hR836uzci3bIlpSTks0T_JhyphenhyphenH-h050/s1600-h/creating-blank-site-definition.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 272px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiYSdoZRHU4f-tEoWgXqCNziARMEUHH7ASGN6Lw0pvNUhTAtn7Rj7yJaZk6pxkc0fU0piFXt2jf0wHC4m2ZXzO3D4WmV2xMwb-dDB3cpIC68T4W_hR836uzci3bIlpSTks0T_JhyphenhyphenH-h050/s400/creating-blank-site-definition.png" border="0" alt="creating blank site definition" id="BLOGGER_PHOTO_ID_5436244436777055410" /></a><br /><a name="attaching-custom-masterpage-to-solution"></a><h3>2) Attach Custom Masterpage to solution</h3>- locate file default.master in folder: C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\12\TEMPLATE\GLOBAL\default.master<br />- right click the file and choose Copy<br />- go to Visual Studio Solution explorer<br />- right click the folder Site definition under the created Project<br />- choose Paste from context menu<br />- right click the inserted file default.master and choose Rename<br />- set the name of file to: demosite.master<br />- in Masterpage add ASP Control as shown on picture:<br /><br /><a title="Masterpage ASP Control" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimAQui5DxAvVZPZ-R9ourhNO_5JYiB_PwUA7ytgiys46UFawN82G518BB0hKUIl-mNIwQUYya9LnKcZeRjO0WoYYGoyoSMitBi11NckhpCv0OxWmBa-SEtAyHWEohpJocG38DVU4cO3VKo/s1600-h/masterpage-asp-control.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 177px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimAQui5DxAvVZPZ-R9ourhNO_5JYiB_PwUA7ytgiys46UFawN82G518BB0hKUIl-mNIwQUYya9LnKcZeRjO0WoYYGoyoSMitBi11NckhpCv0OxWmBa-SEtAyHWEohpJocG38DVU4cO3VKo/s400/masterpage-asp-control.png" border="0" alt="masterpage asp control" id="BLOGGER_PHOTO_ID_5436247277001305810" /></a><br />- XML code of ASP Control<br /><pre class="brush: xml"><br /><asp:label id="CustomLabel" runat="server" text="CustomLabel control"><br /></asp:label></pre><br /><a name="updating-site-definition"></a><h3>3) Update Site definition</h3>- locate and open for update onet.xml file in Solution explorer<br />- navigate to Configuration node with ID=1 under Configurations node<br />- add attributes CustomMasterUrl and MasterUrl as shown on picture<br /><br /><a title="Updating Site definition" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9jxkLxf84azJIIbULLfLBYKJQxCphScV3HmNEEoN9_S7OHTFLpjY170pMRgtGjKmG33llF4kWHItcJNMHRDfayklSPwgbN4lay_oJmaCKeRp2Ytc_ooT5mOaigzRQXLn-YN6z_f0UnbFl/s1600-h/update-site-definition-1.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 237px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9jxkLxf84azJIIbULLfLBYKJQxCphScV3HmNEEoN9_S7OHTFLpjY170pMRgtGjKmG33llF4kWHItcJNMHRDfayklSPwgbN4lay_oJmaCKeRp2Ytc_ooT5mOaigzRQXLn-YN6z_f0UnbFl/s400/update-site-definition-1.png" border="0" alt="updating site definition" id="BLOGGER_PHOTO_ID_5436244644919305522" /></a><br />- navigate to Modules node under the edited Configuration node<br />- create new reference Module node under Modules node as shown on picture<br />- navigate to Modules node under Project node<br />- create new definition Module node as shown on picture<br /><br /><a title="Updating Site definition" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvsw8VUvwIJtB8tlqYWuNGGFXSPeKbly_O6lnxk61j0blHoJto6EYSa-okUGBRWv5hyphenhyphenkJzZFJYc_zP2f5_KOsaSiyz17nWAflrrAuYQorPp1ifs8QCg2ddVXBy2zQZ6KFVpqhurhYejMap/s1600-h/update-site-definition-2.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 154px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvsw8VUvwIJtB8tlqYWuNGGFXSPeKbly_O6lnxk61j0blHoJto6EYSa-okUGBRWv5hyphenhyphenkJzZFJYc_zP2f5_KOsaSiyz17nWAflrrAuYQorPp1ifs8QCg2ddVXBy2zQZ6KFVpqhurhYejMap/s400/update-site-definition-2.png" border="0" alt="updating site definition" id="BLOGGER_PHOTO_ID_5436244607402891250" /></a><br />- code for copy and paste for onet.xml file:<br /><pre class="brush: xml"><br /> <configuration id="1" name="Blank" custommasterurl="_catalogs/masterpage/demosite.master" masterurl="_catalogs/masterpage/demosite.master"><br /> <lists><br /> <modules><br /> <module name="DefaultBlank"><br /> <module name="MyDefaultMaster"><br /> </module></module></modules><br /></lists></configuration></pre><br /><pre class="brush: xml"><br /> <module name="MyDefaultMaster" url="_catalogs/masterpage"><br /> <file url="demosite.master" type="GhostableInLibrary"><br /> </file></module><br /></pre><br /><a name="add-custom-codebehind-to-project"></a><h3>4) Add Custom Codebehind to project</h3>- right click the folder Site definition in the Solution explorer and choose Add new item<br />- choose Code file and name it demosite.master.cs<br />- when you click the Properties of file, you should see Build Action: Compile<br />- the minimal class code is shown on the picture<br />- notice that the class must derive from System.Web.UI.MasterPage class<br />- the namespace of class have to be the same as in the SiteProvisioning.cs file<br />- in this class we have reference to asp:Label control which we have added to Masterpage template<br /><br /><a title="Custom Codebehind" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiH62EmDd487u_6_1T-Wh92oas80tM7IalyKnVSWW16lqjv7kCn8JLyKv_o6h4lwjmHmM0j2m_LuE5jvow7vd7ogiO518KV8m9q9SmDyPFyqtEWipaaffYg9U1TgRX0_SoqCiB-YWMrAPCB/s1600-h/custom-codebehind.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 197px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiH62EmDd487u_6_1T-Wh92oas80tM7IalyKnVSWW16lqjv7kCn8JLyKv_o6h4lwjmHmM0j2m_LuE5jvow7vd7ogiO518KV8m9q9SmDyPFyqtEWipaaffYg9U1TgRX0_SoqCiB-YWMrAPCB/s400/custom-codebehind.png" border="0" alt="custom codebehind" id="BLOGGER_PHOTO_ID_5436247527166920322" /></a><br />- code for copy and paste:<br /><pre class="brush: cpp"><br />namespace BlankSiteDefinitionDemo<br />{<br /> public class MasterPageCodeBehind : System.Web.UI.MasterPage<br /> {<br /> protected global::System.Web.UI.WebControls.Label CustomLabel;<br /><br /> protected override void OnInit(System.EventArgs e)<br /> {<br /> base.OnInit(e);<br /> CustomLabel.Text = "";<br /> }<br /> }<br />}<br /></pre><br /><a name="attach-codebehind-to-masterpage"></a><h3>5) Attach Codebehind to Masterpage</h3>- in file demosite.master you have to add reference to Codebehind<br />- add attributes CodeBehind and Inherits to the first line of master page template as shown on picture<br />- attribute CodeBehind contains file name and relative path of Codebehind file<br />- attribute Inherits contains the reference to dll, first subparameter is namespace plus dot plus classname, second subparameter is namespace again, third subparameter is token of our DLL Library<br />- the token of our DLL Library could be obtained in an easy way: first quick deploy project and choose copy binaries (Project is built and DLL are copied to GAC - Global Assembly Cache), open My computer and go to location: c:\windows\assembly, libraries are sorted by name, locate namespace of our Project, right click on it and choose Properties, then just copy the token<br />- Masterpage should look like this:<br /><br /><a title="Masterpage with attached Codebehind" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjB7RwVQ5NC1dKvERdJm3s3pn3DmnNwaOm-5TxBX40F71IzUeNUGKyb3j84rMfFY5R9hbWMaigbL-Cw22Bb2z889ImDqL18l8juTXzrmtKCyACU3z0IJ44nEb3CwEd0wcKBPR_vjiciXCbu/s1600-h/masterpage-with-attached-codebehind.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 136px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjB7RwVQ5NC1dKvERdJm3s3pn3DmnNwaOm-5TxBX40F71IzUeNUGKyb3j84rMfFY5R9hbWMaigbL-Cw22Bb2z889ImDqL18l8juTXzrmtKCyACU3z0IJ44nEb3CwEd0wcKBPR_vjiciXCbu/s400/masterpage-with-attached-codebehind.png" border="0" alt="masterpage with attached codebind" id="BLOGGER_PHOTO_ID_5436247727720197698" /></a><br />- XML code for copy:<br /><pre class="brush: xml"><br />< %@Master language="C#" CodeBehind="demosite.master.cs"<br /> Inherits="BlankSiteDefinitionDemo.MasterPageCodeBehind,<br /> BlankSiteDefinitionDemo, Version=1.0.0.0, Culture=neutral,<br /> PublicKeyToken=3728f88d7c774d6a" %><br /></pre><br /><a name="deploying-solution"></a><h3>6) Deploy solution and create Site collection</h3>- when you have attached customized Masterpage to WSP Solution package, next step are common for most deployment scenarious, just deploy solution and create site collection<br />- after you done it, site should be displayed with custom master page and label should be updated:<br /><br /><a title="Updated masterpage" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0VSmewyLLTm66nB6J3rf8A7IGRboaMxlKvnMnWq11yk7Z62IRXCGm7uQQtsiQ_qb6dtvr54Sh-r7Cp1OKh6iFwvCLILzdnPDfiei9_-YFmTfdSkuZ31fRmvV7-4_mogw2chzIWAjeN8Vw/s1600-h/updated-masterpage.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 284px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0VSmewyLLTm66nB6J3rf8A7IGRboaMxlKvnMnWq11yk7Z62IRXCGm7uQQtsiQ_qb6dtvr54Sh-r7Cp1OKh6iFwvCLILzdnPDfiei9_-YFmTfdSkuZ31fRmvV7-4_mogw2chzIWAjeN8Vw/s400/updated-masterpage.png" border="0" alt="updated masterpage" id="BLOGGER_PHOTO_ID_5436248183458469122" /></a><br /><strong>Custom Masterpage was deployed successfuly with solution WSP package and the ASP control on it was correctly accessed from codebehind.</strong><br /><br /><a href="http://sharepoint-charles.blogspot.com/2010/02/how-to-deploy-custom-masterpage-with.html#top">Back to Top</a><br /><br />Charles Tustinhttp://www.blogger.com/profile/00718461217498224333noreply@blogger.com0