1.2. Extending a Master Page’s Content to Include Content for Other Application Pages

Problem

You have a master page that provides the basic content for some of your pages but you would like to extend the master page to include additional content for other pages. You might want to do this, for example, when you want the login page of your application to appear one way and the pages that follow it to appear in another way that builds on the appearance of the login page.

Solution

Nest master pages as outlined here. Create the base master page that contains the minimum content used by content pages and then create the content pages that require the content of the base master page. Next, create another master page that references the base master page and adds additional content required for other pages. Now, create content pages that require the content of master pages and reference the second master page.

In the .master file of the base master page:

  1. Add the HTML that is common for your application pages.

  2. Add an asp:ContentPlaceHolder control for each portion of the page that will have page-specific content.

  3. Set the ID attributes to unique identifiers.

In the .aspx file of the pages that will use the base master page:

  1. Set the MasterPageFile attribute of the @ Page directive to the name of the .master file of the base master page.

  2. Add an asp:Content control for each asp:ContentPlaceHolder control in the .master file of the base master page.

  3. Set the ContentPlaceHolderID attribute of the asp:Content to the ID of the corresponding asp:ContentPlaceHolder in the master page.

  4. Add the page-specific content to the asp:Content controls.

In the .master file of the second master page:

  1. Set the MasterPageFile attribute of the @ Master directive to the name of the .master file of the base master page.

  2. Add the additional HTML that is common for the second type of application pages.

  3. Add an asp:ContentPlaceHolder control for each portion of the page that will have page-specific content.

  4. Set the ID attribute to a unique identifier.

In the .aspx file of the pages that will use the second master page:

  1. Set the MasterPageFile attribute of the @ Page directive to the name of the second .master file.

  2. Add an asp:Content control for each asp:ContentPlaceHolder control in the .master file.

  3. Set the ContentPlaceHolderID attribute of the asp:Content to the ID of the corresponding asp:ContentPlaceHolder in the second master page.

  4. Add the page-specific content to the asp:Content controls.

Figure 1-2 shows the output of the page that uses the nested master page in our example. The base master page and a sample content page that uses the master page are shown in Examples 1-1 and 1-2 in Recipe 1.1. Example 1-3 shows the .master file, and Example 1-4 shows the .aspx file of this example.

Nested master page example output

Figure 1-2. Nested master page example output

Discussion

In many web applications, the content of the pages is a function of the location within the application. A login page, for example, may contain only a header and the required controls for inputting the login credentials and a button to initiate the login. Pages displayed after login may contain the same header as the login page plus navigational sections under the header and potentially along the left side of the pages. You can use master pages to support this structure and define the HTML only once.

In this example, we use the master page defined in Recipe 1.1 as the base master page for nesting. It contains a header that will be used for all pages.

In the second master page, we have added a menu to the left side of the page and another asp:ContentPlaceHolder for the page-specific content that will be to the right of the menu. Figure 1-3 shows the hierarchy of the nested master pages in this example.

Hierarchy of nested master pages

Figure 1-3. Hierarchy of nested master pages

Content pages that need only a header will reference the base master page (ASPNet-CookbookVB.master) and provide the content for the PageBody asp:ContentPlace-Holder control. Content pages that need a header and the left menu will reference the second master page (CH01NestedMasterPageVB.master) and will provide content for the ContentBodyasp:ContentPlaceHolder control.

Tip

You can edit simple master pages in the Visual Studio 2005 designer, which provides a WYSIWYG environment. Nested master pages cannot be edited in the designer, however. They must be edited in Source mode. Attempting to access the designer for nested master pages or content pages that use a nested master results in an error with a message indicating the nested master pages cannot be edited in the designer.

Master pages can be as simple or complex as your application dictates. They can include any number of content placeholders and can be nested to any level that meets the needs of your application.

See Also

Recipe 1.1

Example 1-3. Nested master page (.master)

<%@ Master Language="VB" MasterPageFile="~/ASPNetCookbookVB.master" 
       AutoEventWireup="false" %> 
<asp:Content ID="Content1" ContentPlaceHolderID="PageBody" Runat="Server"> 
     <table class="pageBody"> 
          <tr> 
               <td class="leftMenu">
                    <ul class="menuList">
                         <li class="menuListItem">Online Examples</li>
                         <li class="menuListItem">Buy The Book</li>
                         <li class="menuListItem">The Authors</li>
                         <li class="menuListItem">Errata</li>
						 <li class="menuListItem">Feedback</li>
                    </ul>
               </td>
               <td class="contentBody">
                    <asp:contentplaceholder id="ContentBody" runat="server" />
               </td> 
          </tr> 
     </table> 
</asp:Content>

Example 1-4. Nested master page (.aspx)

<%@ Page Language="VB" MasterPageFile="~/CH01NestedMasterPageVB.master" 
       AutoEventWireup="false" 
	   title="Nested Master Content Page" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentBody" Runat="Server" > 
     <div align="center" class="pageHeading">
          Nested Master Pages (VB)
     </div>
	 <br />
	 The content for individual pages is placed here.
</asp:Content>

Get ASP.NET 2.0 Cookbook, 2nd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.