Thursday, April 24, 2008

Creating and Deploying a Custom Master Page with STSDev

This is my second post on creating SharePoint solutions the easy way, with STSDEV. This time around I'll be enhancing my last post's project by adding a custom master page. This master page will start by using a base master page from Heather Solomon's site. If you don't already have it, download it.

The base master page simply gives you a stripped down master page that you can enhance. We'll actually do some enhancements to give a taste of the power that you have over the UI when you choose to customize a master page.

Step 1: Add the base master page to the project
  1. If you haven't already done so, download and unzip the base master page from Heather Solomon's site.
  2. Right click on your 'RootFiles\TEMPLATE\SiteTemplates\YourSiteTemplateName' directory and choose 'Add Existing Item'
  3. Select the base master page from your file system and click 'Add'
  4. Rename the file 'SharePointersDemoCustom.master'.
Step 2: Editing the Default.aspx file
  1. Open the default.aspx file
  2. At the top of the page, change the 'Page' directives 'MasterPageFile' attribute to '~masterurl/custom.master' (note that this value can only be 'default.master' or 'custom.master' but you can name your file whatever you like because the onet.xml file's <Module> element contains the reference to the actual file)
  3. Save the file
Step 3: Editing the onet.xml file
  1. Open the onet.xml file
  2. In the <ListTemplates> node add the following child node:

    <ListTemplate Name="mplib" DisplayName="$Resources:MasterPageGallery;"
    SetupPath="global\lists\mplib" Type="116"
    BaseType="1" Path="GLOBAL" Hidden="TRUE"
    HiddenList="TRUE" NoCrawl="TRUE" Unique="TRUE"
    Catalog="TRUE" OnQuickLaunch="FALSE" SecurityBits="11"
    AllowDeletion="False" AllowEveryoneViewItems="TRUE"
    Image="/_layouts/images/itdl.gif" AlwaysIncludeContent="TRUE"
    DocumentTemplate="100" />

  3. Find the <Configuration> node the 'ID' attribute of 0 (zero)
  4. Add the 'MasterUrl' attribute to the <Configuration> node like so:

    <Configuration ID="0" Name="Blank" MasterUrl="_catalogs/masterpage/SharePointersDemoCustom.master">

  5. The <Configuration> node you just modified should have a <Modules> child element. Add the following <Module> tag as a child of this node

    <Module Name="CustomMasterPage" />

  6. Now go to the outer <Modules> tag that is a child of the main <Project> node and add the following child <Module> node

    <Module Name="CustomMasterPage" List="116" Url="_catalogs/masterpage" RootWebOnly="FALSE">
    <File Url="SharePointersDemoCustom.master" Type="GhostableInLibrary" IgnoreIfAlreadyExists="TRUE" />
Step 4: Deploy the project

Again, STSDEV makes this a breeze. If this is the first time you've deployed this solution change your build configuration to DebugDeploy and do a build, otherwise do a DebugRedeploy.

Now create a new site based on your site definition and see if your masterpage is working correctly. (Note, it should look pretty ugly since we haven't modified the UI yet.

Step 5: Start tweaking that master page!

Here's a bunch of really good resources for customizing your master pages all in one place. Heather Solomon really is the expert when it comes to SharePoint branding:

No comments: