Module 4 - Dreamweaver Templates (Static vs. Dynamic Content)

1. Module 4
Introduction to
Templates
March 17

2. What is a Template?
• A template allows you to reuse
the same design and code over
and over
• Parts of the template are “locked
down” to prevent modifications
• Other areas become editable and
allow for content to be placed in
them
• Making changes in your template
applies those changes to all
pages using that template

3. What is a Template?
Editable area
All other areas
are “locked”

4. Static vs. Dynamic web pages?
Static Dynamic
• Prebuilt content is the same each
time the page is loaded
• Content is generated “on-the-fly” and
changes regularly
• Content only changes when
someone updates and publishes the
file (sends it to the web server)
• Page contains "server-side" code,
allows the server to generate unique
content when the page is loaded
• HTML code
• PHP, ASP, and JSP or other
• Can pull content from a database
• Example: About Us page with
corporate background, mission,
vision, etc.
• Example: upcoming events on a
homepage pulling from a calendar
and changing each day

5. Templates
• Web content management
systems (WCM) use templates
• Called themes in some
systems (Wordpress, Drupal)
• Templates can be custom built,
purchased online (from a vendor
such as ThemeForest.com) or
downloaded for free

6. Dreamweaver Templates
• Dreamweaver allows you to build templates in HTML (or other languages)
and apply the template to static pages
• Creates a .dwt file in your site (in a templates folder)
• Parts of the template are tagged as being an “editable area”
• When a template is applied to a new or existing page the design of the
page will take on the new look/feel
• Content (text, images, videos, tables, etc…) can then be inserted into the
editable areas
• Site must already be using Dreamweaver’s Manage Site features to define
a local root folder for your web site on your personal computer

7. Creating Dreamweaver Templates
• Can create a template from a
new html page, or can save an
existing page as a template
• Once created, templates can be
applied to a new page - use
“Create from Template” option
• Templates can also be applied
to existing pages - will need to
indicate what editable region
content is going to go in
• Creates a “Templates” folder
where all will be saved…don’t
move them!

8. Locked vs. editable areas
• Pages using a
template will have
different content
• Need to create
“editable” areas
within the template
• Under “Insert” you’ll
find these options
• Simplest is an
“Editable Region”
Give it a
unique name…
Creates
code…
…that appears as

9. Locked vs. editable areas
• Editable regions works best within a
<div> tag or other structural HTML
tag that surrounds all of the text,
images, or other elements in the
page that you will want to edit
• Editable regions can get more
complex, e.g:
• Repeating elements
• Tables that allow rows to be
added

10. Changing a template
• Biggest advantage of
templates is that when you
want to go back and edit
elements you use
throughout your site (such
as the navigation links) you
make that change once to
the template and it’s
automatically changed on
every page using the
• …but the files that changed
then must be uploaded to
the server to be visible
online…

11. Pros & Cons of Dreamweaver Templates
Pros Cons
• Useful when many pages look the same
and share common elements (eg. banner,
menu, footer…)
• A different template is required for pages
that are organized in different ways
• Changes are made once an applied to all
pages using the template
• Large sites can be time consuming to
update in this way
• Simple and easy to create and tag
• HTML pages must still be uploaded to the
website (server) to be visible
• Limits “messing up” code on your site,
useful if someone else needs access to edit
• Requires Dreamweaver software to
manage and work with templates
• Helpful for small sites that aren’t updated
frequently
• May not be the best long-term solution for a
site (think CMS!)

12. Conclusion
• Dreamweaver
templates can be
useful in some
situations…
• As you learn more
about content
management systems
you’ll see the
advantages of using a
system for sites

13. Module 4 independent study
• Please watch the videos and read the articles found in
the Online Learning / Independent Study section of
Module 4 and complete Quiz 4 before next class