building templates

Goals: Managing the content of a web site can be very difficult. This session will show how to use Dreamweaver templates to control the structure of a site. It will also show how to base pages off the template and how to deploy changes to a site using the template update feature.

  1. Template Overview
  2. Creating Templates
  3. Setting Page Properties
  4. Defining Editable Regions
  5. Creating Pages Based on Templates
  6. Updating Templates
  7. Exercise

template overview

Templates make it easy to maintain a web site. A template is a document that can used as the foundation for other documents. Templates can help to create web pages with a consistent design. Templates can be designed and redesigned, and they can change hundreds of pages, including links, images, and footers in minutes.

template content relationship
Figure 1. Template Overview

When a template is created, elements that should remain constant across all pages are marked as non-editable regions. Regions that will house content unique to each page are marked as editable regions.

A template can be modified even after it has been used it to create documents. When a template is changed, documents based on the template are updated. Only the locked (non-editable) sections of those documents are updated.

Examples:

creating templates

A template can be created from an existing HTML document, or created from scratch. Templates are automatically stored in the Templates folder in the local root folder for the site. If this folder does not already exist, Dreamweaver creates it when a new template is saved.

To save an existing document as a template:

  1. Choose File | Open and open a HTML document.
  2. Choose File | Save as Template.
  3. Dreamweaver may ask to set editable regions.
  4. In the dialog box that appears, select a site and enter a name for the template in the Save As box.
  5. Click Save.

To edit an existing template:

  1. Choose Window | Files.
  2. Open the template found in the Templates folder.
  3. Edit the template.
  4. Click File | Save.
  5. Dreamweaver will ask to update associated pages.

setting page properties

To modify the template's page properties, choose Modify | Page Properties. (Documents created from a template inherit the template's page properties, except for the page title. Individual pages will require individual titles.) Many of these settings can and should be set using cascading style sheet settings.

defining editable regions

As we mentioned above, editable regions are the parts of a page that change - for example, a daily lesson in an online course. Locked (non-editable) regions are the areas that remain constant from one page to another, such as a main title, logo and contact information.

By default, all regions on a template are marked as locked. To make the template useful, some parts of it must be made editable. While editing the template itself, changes can be made to both editable and locked regions. When the template is applied to a document, however, changes can only be made to the editable regions of the document; the locked regions of the document cannot be modified.

To define existing template content as an editable region:

  1. In the template, select the text or content to be made editable.
  2. Choose Insert | Template Objects | Editable Region.
  3. In the Name: dialog box, enter a name for the region.

Note: When a region is named, the following characters cannot be used: single or double quotation marks (', "), angle brackets (<>), and ampersands (&).

To define a new editable region in a template:

  1. In the template, place the insertion point where the editable region is to be created.
  2. Choose Insert | Template Objects | Editable Region.
  3. In the Name: dialog box, enter a name for the region. The region name, surrounded by braces ({}), is inserted into the template as a highlighted placeholder. When the template is applied to a document, replace the place holder with text, images, or other content.

To unmark a region (make it non-editable):

  1. Choose Modify | Templates | Remove Template Markup.

creating pages based on templates

Templates can be used as a starting point for a new document or applied to an existing document. It is significantly easier to create new pages based on a template than it is to apply a template to an existing page.

To create a new document based on a template:

  1. Choose File | New.
  2. Choose Page From Template.
  3. In the dialog box that appears, choose a template and then click Create.

To apply a template to an existing Dreamweaver document:

  1. Open the document.
  2. Choose Modify | Templates | Apply Template to Page.
  3. Choose a template from the list and click Select.

When a template is applied to an existing document, the content in the template is added to the document. If a document already has a template applied to it, Dreamweaver compares the editable region names of the two templates, and inserts the content of the new template into the region names with a match in the old template.

To detach a document from a template:

  1. Open the document.
  2. Choose Modify | Templates | Detach From Template.

If any of the editable region names don't match, or if an editable region in the previous template doesn't have a corresponding region in the new template, a dialog box asks whether it should delete the extraneous regions or transfer them to a new region of the template. If there are more editable regions in the new template than in the old template, the additional regions will appear in the documents as placeholders.

updating templates

When changes are made to a template, Dreamweaver asks whether pages based on this template should be updated. There are times when updating the dependent pages is not desirable. To manually update dependent files:

To update the current document to the most current version of a template:

  1. Choose Modify | Templates | Update Current Page.

To update the entire site or all documents that use a particular template:

  1. Choose Modify | Templates | Update Pages. The Update Pages dialog box appears.
  2. In the Look In pop-up menu, do one of the following: Choose Entire Site, and then select the site name. This updates all pages in the selected site to their corresponding templates. Choose Files That Use, and then select the template name. This updates all pages in the current site that use the selected template.
  3. Make sure Templates is selected in the Update option.
  4. Click Start.

advance to exercise