Creating and Applying Dreamweaver templates

Creating and Applying Dreamweaver templates 

Dreamweaver templates allow you to have a consistent look and feel on all the pages in your site.  Using a Dreamweaver template with your site allows you to easily modify and update all the pages in your site at once.

This How To shows you how to create a Dreamweaver template based off on a page you have created and how you can apply your template to other pages in your site.

What Do You Need to Start? 

• Dreamweaver 8, CS3 or CS4

Creating your template

A Dreamweaver template can be generated from any HTML or PHP page. Once you have created the design of your site, whether using CSS Sculptor or manually in Dreamweaver, follow these steps to create your template.

1.   In Dreamweaver, open the file that contains your design.  

2.   If you intend to create PHP pages out of this template, but your file currently has a .htm or .html extension, you should choose File > Save As, and choose PHP to change the extension.

If you don’t need to change the file extension, skip to the next step.

3.   Go to File > Save As Template.

4.   In the Save As Template window, enter a name for your new template.

5.   Click Save.

The template file you just saved will be stored in the Templates directory of the site you have open in the Files panel.

Defining Editable Regions

Editable regions are applied to various locations of your template to specify where content can be inserted. 

You should only create editable regions for areas where content will change on a per page basis.  For example, the header is likely to be consistent throughout your entire site, and should not be an editable region.  Whereas, the content area of your page should be different for each page, and would require an editable region.

1.   Place your cursor within the area where you wish to create your editable regions.

2.   Then, from the Template Objects option under the Insert menu, select Editable Region.

3.   In the Name field of the New Editable Region window, enter a name for the editable region.  

4.   Click OK.

An editable region is now displayed on your page defined by a blue border.

Note: The name of each editable region you create is entered as placeholder text within the region. This text is overwritten by any content that exists on the page you apply this template to.

Applying your Dreamweaver template

Once you have created your template and editable regions, you can apply it to any page in your site.
1.   Open the first page of your site.
2.   From the Assets tab, choose the Templates option.

3.   Right-click the .dwt file that you are using for your site.
4.   Choose Apply.
5.   Select the appropriate editable regions for each portion of your page.
6.   Click OK.
Repeat this process for each page in your website.

Creating a New File from a Template

When creating a new page for your website, you should always create your new page from the template you are using.
1.   From the Assets panel, right-click on your template.
2.   Choose New from Template.
3.   When the page is loaded in Dreamweaver, press Ctrl (Cmd) + S to save the page.