Affordable Professional Web-hosting

webstore design: straight to the point of sale

Home About Us FAQ Testimonials Terms Links Membership Contact Us

SitesOutlet Products

Website Design Tip:

If you're designing a site that requires a lot of changes use database-driven web technologies (E-commerce Kit).
SitesOutlet™ inFantasy Is PayPal Verified Credit CardsRSS Feed
Your Own Web Store Web Design Resources: webmasters join to get traffic! Search Engine Optimization

Dreamweaver Web Template (DWT) Tutorial


Introduction

Back to Top

What is a Dreamweaver Web Template?

Back to Top

How do I use Dreamweaver Web Templates?

Back to Top

What are the key content regions of a Dreamweaver Web Template?

Dreamweaver Web Template can contain the following editable regions:
  1. Editable Regions
  2. Optional Regions
  3. Repeating Regions
Back to Top

Create a Dreamweaver Web Template

Note: Do not move your templates out of the Templates folder, or put any non-template files in the Templates folder. Also, do not move the Templates folder out of your local root folder. Doing so causes errors in paths in the templates.
To create a Dreamweaver template:
  1. Open the document you want to save as a template in the Document window, by doing one of the following:
    To open an existing document, choose File > Open and select the document.
  2. To open a new blank document, choose File > New. In the dialog box that opens, choose Basic Pages or Dynamic pages. In the document list select the type of page you want to work with, then click Create.
    When the document opens, choose File > Save as Template.
    Note: Unless you selected Don't Show This Dialog Again, you'll receive a warning that says the document you're saving has no editable regions. Click OK to save the document as a template, or click Cancel to exit this dialog box without creating a template.
  3. In the dialog box that appears, select a site to save the template in from the Site pop-up menu, and enter a unique name for the template in the Save As text box.
  4. Click Save.
    The template file is saved in the site's Templates folder, with a .dwt filename extension.
To create a new Dreamweaver template using the Assets panel:
  1. Open the Assets panel (Window > Assets or F11), if it isn't already open.
  2. Select the Templates category.
  3. Click the New Template button in the Assets panel. A new document is added to the Name list. The document name is highlighted.
  4. Type a name for the document.
  5. Click the Edit button in the Assets panel. A template document opens in the Document window
Back to Top

Add editable regions to a Dreamweaver Web Template

To define an editable template region:
  1. In the Document window, do one of the following to select the region:
    • Select the text or content that you want to set as an editable region.
    • Place the insertion point where you want to insert an editable region.
  2. Do one of the following to insert an editable region:
    • Choose Insert > Template Objects > New Editable Region.
    • Right-click (Windows) or Control-click (Macintosh) the selected text or object, and choose New Editable Region from the context menu.
    • In the Insert bar, select Templates, then click the Editable Region button. The Editable Region dialog box appears.
  3. In the Name text box, enter a unique name for the region. (You cannot use the same name for more than one editable region in a particular template.) Note: Do not use special characters in the Name field.
  4. Click OK.
The editable region is enclosed in a highlighted rectangular outline in the template, using the highlighting color that is set in preferences.
A tab at the upper-left corner of the region shows the name of the region. If you inserted an empty editable region in the document, the name of the region also appears inside the region.
Back to Top

Optional Regions

To create optional regions:
  1. In the Document window select the element you want to set as an optional region.
  2. Click the Templates menu and select Optional Region.
  3. In the dialog box that now appears give the optional region a name.
  4. Click the OK button.
  5. Repeat the above steps to add more optional regions to the document.
  6. In the document window, choose Modify > Template Properties. The word "true" appears in the Value column next to each of the optional regions. This means that each optional region is currently visible on the page. Changing the values of these optional regions to false prevents the document from displaying them.
  7. Open the Property inspector.
  8. In the Property inspector, click Edit to open the New Optional Region dialog box to set basic or advanced "if" conditions/rules to your optional regions.
Back to Top

Repeating Regions

There are two templates tools that you can use to duplicate page elements:
  1. Repeating region
  2. Repeating table
Working with Repeating regions:
  1. Place the insertion point in the document where you want to insert the repeating table and then do one of the following to bring up the Insert Repeating Table dialog box:
    • In the Templates category of the Insert panel, click the Repeating Table button.
    • Choose Insert > Template Objects > New Repeating Table.
    • Right-click (Control-click for Macintosh) the selected content and choose New Repeating Table from the context menu.
  2. In the Starting Row text field, enter 2. This is the first row that will be repeatable.
  3. Table Raws
    In the Ending Row field, also enter 2. This means that the repeating table initially will just have one repeatable row, as shown below. Content contributors will create additional rows as necessary.
  4. Give each of the editable regions a descriptive title. Open the Property inspector, clicking the first editable region, and change the name.
  5. Do the same for the other two editable regions by giving them unique names.
  6. Save the document.
When you create a repeating table, all new rows inherit the same background color by default. With a small amount of hand coding, you can alternate these colors.
To alternate row colors:
  1. Open the template file you want to modify.
  2. Click the Show Code View button or show the Code Inspector (by choosing Windows > Others > Code Inspector or pressing F10).
  3. In the HEAD section of your document add the following:

    <!-- #TemplateParam name="evenColor" type="color" value="FFFFFF" -->

    <!-- #TemplateParam name="oddColor" type="color" value="#FFFFCC" -->

Back to Top

Removing an editable region

To remove an editable region:
  1. In the document or in the tag selector, select the editable region you want to change.
  2. Choose Modify > Templates > Remove Template Markup.
    The region is now no longer editable.
Back to Top

Creating a nested template

To create a nested template:
  1. Create a document from the template you want to base the nested template on by doing one of the following:
    • In the Assets panel's Templates category, right-click the template you want to create a new document from, then select New From Template.
    • Choose File > New. In the New Document dialog box, click the Templates tab and select the site that contains the template you want to use; then in the document list, double-click the template to create a new document.
      A new document appears in the Document window.
  2. Choose File > Save as Template or click the Make Nested Template button in the Insert bar, to save the new document as a template
  3. In the new template, add additional content and editable regions.
  4. Save the template.
In documents based on the nested template, you can add or change content in editable regions passed through from the base template, as well, as editable regions created in the new template.
Back to Top

Applying a template to an existing document

To apply a template to an existing document:
  1. Choose File > Open to open the document you want to apply the template to.
  2. Perform one of the following actions:
    • Click in the Document window, then choose Modify > Templates > Apply Template to Page. Choose a template from the list and click Select.
    • Select the template in the Templates category of the Assets panel, and click the Apply button.
    • Drag the template from the Templates category of the Assets panel to the Document window's Design view.
  3. If content exists in the document that can't be automatically assigned to a template region, the Inconsistent Region Names dialog box appears. It lists all the editable regions in the template being applied. Use it to choose a destination for the content.
Back to Top

Detaching a document from a template

To detach a document from a template:
  1. Open the template-based document you want to detach.
  2. Choose Modify > Templates > Detach from Template.
The document is detached from the template and all template code is removed.
Back to Top

Updating template based pages

To open and modify an attached template:
  1. With the template-based document in the Document window, select Modify > Templates > Open Attached Template.
  2. Modify the content of the template as desired. To modify the template's page properties, choose Modify > Page Properties. (Documents based on a template inherit the template's page properties.)
  3. Save your document. Dreamweaver prompts you to update pages based on the template.
To apply template changes to the document: To update the entire site or all documents that use the attached template:
  1. Select Modify > Templates > Update Pages.
    The Update Pages dialog box appears.
  2. In the Look In pop-up menu, do one of the following:
    • Select Entire Site, and then choose the site name from the adjacent pop-up menu. This updates all pages in the selected site to their corresponding templates.
    • Select Files That Use, and then choose the template name from the adjacent pop-up menu. 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.
Dreamweaver updates the files as indicated. If you selected the Show Log option, Dreamweaver provides information about the files it attempts to update, including information on whether they were updated successfully.
Back to Top
Page copy protected against web site content infringement by Copyscape