Use Dynamic Web Templates with ASP.NET Pages for a Consistent Look and Feel

Analysis
Oct 27, 20093 mins

With a little up-front effort, you can easily use DWTs with your ASP.NET pages.

Creating a consistent look and feel is critical to successful Web site design. Expression Web offers two features that make consistency in your design easier: dynamic web templates (DWTs) and ASP.NET master pages. If all of your pages are ASP.NET pages, using master pages provides more flexibility than DWTs because you can nest master pages for a single ASP.NET page. On the other hand, if your site uses a combination of static pages and ASP.NET pages, using DWTs is a great choice, but using them with your ASP.NET pages will require a little extra work.

When I’m using DWTs in a site that uses ASP.NET pages, I create a separate DWT for my ASP.NET pages. The ASP.NET DWT is exactly like the original DWT, but I add three things to it. First, I add a Page directive directly under the DOCTYPE declaration like so.

Second, I add a new editable region and a script block directly under the Page directive so that I can add server-side code to the page if I choose. Here’s that editable region.

Third, I surround the editable region that defines my main content area with a form so that my ASP.NET controls will work. Here’s an example of that.

    

Main Page Content

Once I’ve made those changes, I save the DWT using the same name as my original DWT, but I tack “ASPX” to the end of the name. For example, if my DWT is named Template.dwt, the one I use for ASP.NET pages is named TemplateASPX.dwt. When I need to create a new ASP.NET page, I follow these steps to attach my DWT to the page.

  1. Select File, New, Page.
  2. Select ASPX from the list of page types. (Don’t select Create from Dynamic Web Template.)
  3. Once the ASPX page has been created, select Format, Dynamic Web Template, Attach Dynamic Web Template.
  4. Select my ASPX DWT and click Open to attach it.

When you follow these steps, you’ll see a warning that any content outside of the tag will be erased. Click Yes to continue with the DWT attach and you should see your DWT applied to the page successfully. If you need to add server-side code, you’ll be able to do so in the editable region defined for that purpose.

DWTs provide a convenient way to apply a consistent appearance to your Web site, and by taking a few extra steps up front, you can easily use this powerful feature with your ASP.NET pages.