Converting an Existing Web Page to Use the Master Page
You may already have existing Web pages that you want to convert to use a Master Page. As you saw in the previous lesson, using a Master Page involves two
main steps: registering the Master Page in the Page directive, and placing the page's
content in a Content control (which is, in turn, hosted by the Master Page in its
You will now convert the Authors.aspx page to use a Master Page.
1. Open Authors.aspx in Source view. In the
Page directive begin typing "MasterPageFile". You will notice that
IntelliSense quickly recognizes your intentions. When MasterPageFile
is selected press Tab and then type "=".
2. Notice that IntelliSense knows what Master Pages are available in the project
and lists them in its menu. Select MasterPage.master and then press
Tab. (You could also use the Pick Master feature
to find a Master Page that is not currently in your project.) The result should
The Master Page contains the HTML, HEAD, BODY, FORM, etc. tags. These cannot also
be in a content page.
3. Remove all tags outside of the outer div tag. Also delete <h1>Authors</h1> because the
site header will now reside in the Master Page.
4. Wrap the remaining body content in a Content control manually
by adding the control's opening and closing tags. IntelliSense is again there to
help. In addition to the ID and runat attributes
you'll need to specify the ID of the ContentPlaceHolder
control on the Master Page. IntelliSense should also display this ID, but if not, recall
that it is "bodyContentPlaceHolder".
Note that when you enter the final character of the opening tag, VWD's tag completion
feature will automatically add the closing tag.
5. Move the closing Content control tag below the closing
All page content except for the Page directive should now be between the asp:Content
6. Press F5 to run the application.
You have successfully converted the Authors.aspx page to use a Master Page. Although this was a manual process, it was quick and easy. You should now be
more familiar with how Content and Master Pages work together.
7. Close your browser.