On a recent makeover of the Migrating from FrontPage to Expression Web site, we wanted to use the same DWT but give the site two distinctive looks. WHY? Because Migrating from FrontPage to Expression Web consists of two separate parts:
- The main site which supports the Migrating from FrontPage to Expression Web E-Book AND
- Expression Web Site Templates which offers a series of generic templates for various layouts that can be added to your Expression Web software to give you a wider selection of default templates to build your sites
After designing the template and experimenting with various color combinations, we decided on stick with the current green for the main part of the site and a brown/orange combination for the site templates section. The same menus which are includes would serve both sections with a separate color combination. Because the sidebar is also an editable region, they could be arranged a bit differently for each of the sections.
The easiest way to achieve this was to develop the one DWT and use a separate style sheet for the two sections.
Besides the normal editable regions for the template, we added editable regions for the meta tag to attach the style sheet as well as the banner area where the site name (graphic image) was inserted.
Code used:
<!– #BeginEditable “stylesheet” –>
<link href=”../styles/tem-project-site.css” rel=”stylesheet” type=”text/css” />
<!– #EndEditable –>
<!– #BeginEditable “bannerimg” –>
<div class=”banner”>
<img alt=”” class=”dynasize” src=”../images/orange-logo.gif” /></div>
<!– #EndEditable –>
End Result:
Screenshot Migrating from FrontPage to Expression Web
Screenshot Expression Web Site Templates
So if you are looking for an easy way to give a site the same but different looks, you might try this approach – one dynamic web template and two different style sheets.