Master pages provide an excellent way to make your Web sites easier to design, Putting all(or at least most) of your page layout in a single file allows you to concentrate on the more important things for the individual Web pages of your site, Master pages an: created in files with the extension .master, and can be added via the Web site.
New Item menu item, like any other site content At first glance, the code generated for a master page is much like that for a standard .aspx page:
The differences are:
- A Master directive is used instead of a <‘i Page b directive, although the attributes are the same.
- A Content PlaceHolder control with an head is placed in the page header.
- A ContentPlaceHolder control with an ContentPlaceHolderl is placed in the page body.
The Content PlaceHolder controls are what make master pages so useful. You can have any number of these on a page, and they are used by .aspx pages using the master page to “plug in” content. Youcan put default content inside a ontentPlaceHolder control, but. aspx pages can override this content.
For an .aspx page to use a master page, you need to modify the <‘i Page ,> directive as follows:
Here you have added two new attributes: a MasterPageFile attribute saying which master page to use and a Title attribute that sets the content of the <titIe> element in the master page.
When you add an aspx page to a Web site, you can choose to select a master page, as shown in Figure 38-7.
If you do this, you can navigate through your site structure to find the master page you want, as shown in Figure 38-3
The . aspx page doesn’t have to contain any other code, if you want to use the default master page content. In fact, it is an error to include a Form control, because a page may only have one of these and there is one in the master page.
aspx pages that use a master page can contain no root-level content other than directives, script elements, and Content controls. You can have as many Content controls as you like, where each one inserts content into one of the ContentPlaceHolder controls in the master page, The only thing to look out for is to make sure that the Correct attribute of the Content control matches the ID of the ContentPlaceHolder control where you want to insert content. So, to add content into the master page shown earlier, you would simply need the following in the. aspx file:
The true power of master pages comes when you surround the ContentPlaceHolder controls in your master pages with other content, such as navigation controls, site logos, and HTML. You can supply multiple ContentPlaceHolder controls for main content, sidebar content, footer text, and so on.
You can omit Content controls on a page if you do not wish to supply content for a specific ContentPlaceHolder, For example, you could remove the Contentl control from the preceding code without affecting the resultant display.
Accessing Master Page Content from Web Pages
When you add a master page to a Web page, you will sometimes need to access the master page from code in your Web page. To do this, you can use the Page. Master property, which will return a reference to the master page in the form of a MasterPage object. You can cast this to the type of the master page as defined by the master page file (for the example in the previous section, this class would be called MyMasterPage), Once you have this reference, you can access any public members of the master page class.
Also, you can use the MasterPage. FindControl () method to locate controls on the master page by their identifier. This enables you to manipulate content on the master page that is outside of content placeholders.
One typical use of this might be if you define a master page that is used for a standard form, with a submit button. You can locate the submit button in the child page and add an event handler for the submit button in the master page. In this way, you can provide, for example, custom validation logic in response to a form submission.
Nested Master Pages
The Select master page option is also available when you create a new master page. By using this option,you can create a nested master page that is based on a parent master page. For example, you can create a master page called MyNestedMasterPage that uses MyMasterPage as follows:
Pages that use this master page would supply content for NestedContentPlaceHolderl and Neste’dContentPlaceHolder2, but would not have direct access to the ContentPlaceHolder controls specified in MyMasterPage, In this example, MyNestedMasterPage fixes the content for the head control and supplies a template for the ContentPlaceHolderl control.
By creating a family of nested master pages, you can provide alternate layouts for pages while leaving some aspects of the base master pages untouched, For example, the root master page might include navigation and basic layout, and nested master pages could provide layouts with different amounts of columns. You could then use the nested master pages in the pages of your site and quickly switch
between these alternate layouts on different pages.
Master Pages In PCSDemoSite
In PCSDemoSite, the single master page MasterPage. master (the default name for a master page) is used, with code as follows:
Many of the controls here are ones that you haven’t looked at yet,and you will come back to those shortly.The important things to note here are the <div» elements that hold the various content sections (header, navigation bar,and body), and the use of <%$ AppSettings :SiteTitIe %> to obtain the site title from the Web. config file:
<add key=”SiteTitle’ value=’Professional ct Demo Site’l>
There isalso a stylesheet link to StyleSheet. css:
<link rel=’stylesheet” href=’StyleSheet.css· type=”text/css’ />
This CSS stylesheet contains the basic layout information for the <d i,v» elements on thispage, as well as for a section of the meeting room booker control:
Note that none of this style information includes colors, fonts, and so on. This is achieved by style sheets within themes, which you will see later in this chapter. The only information here is layout information, such as <div> sizes.
Note that Web site best practices have been adhered to in this chapter whenever possible. Using CSS for layout rather than tables is fast becoming the industry standard for Web site layout and is well worth learning about. In the preceding code, #symbols are used to format <d i,v» elements with specific id attributes, whereas. mrbEventList will format an HTML element with a specific class attribute.