Create new account I forgot my password    

Creating a Dynamic Page Template with Microsoft Expression Web
Rating: 3 user(s) have rated this article Average rating: 5.0
Posted by: Minal Agarwal, on 1/7/2009, in category "Expression Web"
Views: this article has been read 9081 times
Abstract: This article gives you a basic insight into what are dynamic web templates and how do you create one and use it to create web pages with same look and feel.

What is a Dynamic Web Template?
A Dynamic Web Template is an HTML-based master copy of a Web page. It can contain page layout, page elements, settings, formatting, styles, graphics and certain regions that can be edited. The purpose of a dynamic web template is to derive or create pages in a web site based on it, to maintain an identical and consistent look and feel throughout the web site.
Why do I use a Dynamic Web Template?
‘I have a web site that has around 500 pages. I have to revamp certain portions of my web site, and that involves a lot of changes since I have to sit and edit each page manually!’
‘I have already created 20 pages in my web site and there are lots more to create. I am tired of copying and pasting the basic layout in each page. Is there a solution to this?’
Have you come across such a situation if not then you are lucky. If yes then you are at the right place! This is exactly why you would want to create and use dynamic web template.
You create a template with the layout and all the page elements, formatting, styles that would be common across all the pages in your website and create editable regions wherever you want to put elements that would be specific to each page. Then create new pages based on this template and go ahead with customizing each page. Isn’t this easy? All you have to do is attach the dynamic web template to your pages.
How do I create a Dynamic Web Template?
In the menu bar go to File > New > Page > New dialog box. Then choose Dynamic Web Template from the list of General Pages.
New Dialog Box
Click OK to create a dynamic web template as shown below:
New Dynamic Web Template
As you notice there is a box with brown border that is created. When you click on the box it shows <DWT:editable> in the top pane, see below:
Defualt Editable region
This area is an ‘editable’ region of the template. Even though it is not specifically mentioned, content of a web template is divided into editable region and non-editable region. Non-editable region is a specific part of the template, content of which is unalterable in all the pages that are created based on the template. Unlike non-editable region, an editable region is that portion of the dynamic web template, the content of which is specific to that page. To put it in simple words; when a page is created based on a dynamic web template all of the content of the page derived from the template is locked excluding the content in the editable regions.
So whenever you create a template for a website you would enter the elements like text, images and the same that would be common across all pages. You could create one or more editable regions in the template where you need to enter page specific data. Later when you create individual pages from this template you would fill in the content that is specific to those pages into these editable regions.
Though by default an editable region is created in the template you can always delete it and create a new one wherever and whenever you want. To do that, right click on the editable region and choose ‘Manage Editable Regions…
Manage Editable Regions menu
Editable Regions dialog box
Enter a ‘Region name’ and click on ‘Add’.
New Editable region
You can similarly create multiple editable regions in between non-editable regions in your template. Once you complete creating the template you can now create as many pages from your template as much needed in your web site. But before that you need to save it. A dynamic web template is saved with an extension of ’.dwt’. Save the template in the same location of your website, but you can save it anywhere else.
To create a new page based on the template, go to New > Create from Dynamic Web Template…
Create new page from dynamic web template
Attach Dynamic Web Template
Then choose the template and Open. Expression Web will inform you that the new page has been updated with the content from the dynamic web template.
Information window
Click on Close and go to the new page. The page would look exactly same as the template. But as you roll over your mouse you may notice a change your cursor in some regions. That is because all the regions except the editable regions are locked, and hence in the above example if you move your mouse over the image or anywhere else except the ‘PageContent’ region the pointer changes to a red circle with a cross line through it.
Non editable region
The content in the editable region is displayed and can be edited.
Expression Web maintains a link between the dynamic web template and the content pages derived from the template. So whenever you make any changes to the template, it will ask you if you would also like to update the content pages that are linked. Hence dynamic web templates help you to create multiple pages in your website with a consistent look. Also whenever you decide to make any changes in your pages, you do not have to go to each page and do it individually. Instead edit the dynamic web template and let Expression Web update all the linked pages with this change. Your job is much easier with templates.
You can always choose various actions on your pages related to the dynamic web template from the menu, by choosing Format > Dynamic Web Template. See below:
 Dynamic Web Template options
Conclusion
This article was to give you an overview of creating dynamic web templates and using them to create your web pages. I hope it was useful to you. If you like this article then subscribe to the RSS and stay updated with new articles.









Page copy protected against web site content infringement by Copyscape


How would you rate this article?

User Feedback

Post your comment
Name:
E-mail: (Will not be displayed)
Comment:
Insert Cancel

NEWSLETTER