لطفا منتظر باشید ...
• Table of Contents• Reviews• CD-ROM• Reader Reviews• Errata• AcademicDreamweaver MX 2004: The Missing ManualBy
David Sawyer McFarland Publisher: O''ReillyPub Date: February 2004ISBN: 0-596-00631-4Pages: 840Slots: 1.0
Dreamweaver MX 2004: The Missing Manual
enables both first-time and experienced web designers to
bring stunning, interactive web sites to life. What sets
this new edition apart is the crystal-clear writing, welcome
humor, and exclusive features. With over 500 illustrations,
a handcrafted index, and the clarity of thought that has
made bestsellers of every Missing Manual to date, this new
edition is the ultimate atlas for Dreamweaver MX 2004.
18.6 Building Pages Based on a Template
Building a template is only a prelude to the actual work of building your site. Once
you finish your template, it's time to produce pages.
To create a new document based on a template, choose File
New to open the Newfrom Template window (see Figure
18-14). Click the Templates tab and select the
current site you're working on from the "Templates for" list. All templates for the
selected site appear in the right column. Select the template you wish to use and
click Create.
|
corner that identifies the underlying template name. Dreamweaver outlines any
editable regions in blue; a small blue tab displays each region's name (Figure
18-5).
Dreamweaver makes it painfully obvious which areas you aren't allowed to edit; your
cursor changes to a "forbidden" symbol () when it ventures into a locked area.
To add content to an editable region, click anywhere inside the editable region. You
can type inside it, add graphics, or add any other objects or HTML you can normally
add to a document. You can also change the document's title and add Behaviors (see
Chapter 12), Cascading Style Sheets (see
Chapter 8), and meta tag information (items that go in the <head> of an HTML document).
NOTEDreamweaver doesn't let you use the Layer tool to draw a layer in an editable region. That's because
using this method, Dreamweaver tries to add the code for the layer at the very beginning of the page, which
is usually a non-editable region. Instead, you're better off creating a CSS style using absolute
positioning (Section 8.1) and use the Insert Div Tag tool (
Section 8.3.1.6) to place a layer inside an editable region.
If you're designing sites to work with Netscape Navigator 4, don't insert Layer code into a table cell, since
Navigator 4 has trouble with that arrangement. The best solution is to add a single paragraph to the template
fileat the very bottom of the page just before the closing </body> tag is a good placeand mark
it as editable.
Then insert layers into this region of your template-based pages.
18.6.1 Working with Repeating Regions
Repeating regions work a bit differently than editable regions. In most cases, a repeating
region will include one or more editable regions (which you can edit using the
instructions above). However, Dreamweaver provides special controls to let you add,
remove, and rearrange repeating entries (see Figure 18-15).
Repeating regions are a
great way to quickly use
lists in your Web pages.
In this example, a list of
links to related stories, you
can add as many stories
to the page as you'd like.
Clicking the + button adds
another row to this table
complete with an icon (in
a region locked by the
template) and an editable
story region.
These regions are intended to let a page author add repeated page elementslike
rows of product information in a list of products. To add a repeating entry, click the
+ button that appears to the right of the Repeat region's blue tab. You can then edit
any editable regions within the entry. Click inside an editable region inside a repeating
entry and click + again to add a new entry after it.
Deleting a repeating entry is just as easy. Click inside an editable region within the
entry you wish to delete and click the - button.
NOTEYou can create repeating regions that don't have any editable regionsfor example, a star that can
be repeated several times to indicate the rating for a product. Although you can use the + button to repeat
such regions, you can't delete those regions with the - button. In other words, you're stuck with any extras
you've added. The only workaround is to add an editable region to the repeating region. Then Dreamweaver
lets you remove any repeating regions you wish.
To rearrange entries in the list, click inside an entry's editable region. Click the up or
down arrows to move the entry in the list (to alphabetize it, for example).
18.6.2 Changing Properties of Editable Tag Attributes
Unlike editable or repeating regions, an editable tag attribute isn't immediately apparent
on template-based pages. There's no blue tab to represent it, as there are for
editable regions; in fact, nothing appears in Design view to indicate that there are any
editable tag properties on the page. The only way to find out is to choose Modify
Template Properties to open the Template Properties dialog box (see Figure
18-16).
The Template Properties
window lets you control
editable tag attributes
and other parameters
for optional regions.
Depending on which
parameter you select, the
options at the bottom of
the window change. In
this case, since this page's
Bgcolor property is editable,
the PageBackground
parameter lets you use
Dreamweaver's color box
to select a new color for
the background of the
page.
All editable tag attributes for this page appear in this window. All parameters defined
for this page, including optional regions, appear here, as discussed in the box in
Section 18.4.4.2.
To change the value of a template propertyin other words, to edit the property of
an editable tagselect its name from the list and fill out the option that appears at
the bottom of the window. For example, in the case of color properties, use the color
box to pick a Web-compatible color. If the property is a path (like a link or an image's
source property indicating the graphic file's location in the site), use the common
folder icon to browse to select the file.
Once you've finished setting the editable properties for the page, click OK to close
the window.
18.6.3 Hiding and Showing Optional Regions
As with Editable Tag Attributes, you use the Template Properties window to control
the display of optional regions. On template-based pages, you can show or hide an
optional region by choosing Modify
Template Properties to open this dialog box(see Figure 18-17). Next, select the name of the optional region. To make all
page elements in the region appear, turn on the "Show" checkbox at the bottom of the
window. To hide the optional region, deselect this box.
A Template property for an optional
region has either a value of true or false.
True means the contents of the region will
be visible on the page, while false hides
the region. (The "Allow Nested Templates
to Control This" option is described in the
box on the facing page.)
18.6.4 Applying a Template to a Page You Already Made
What happens if you create a Web page and then decide you want it to share the look
of a template? No problem. Dreamweaver lets you apply a template to any Web page
in your site, as long as that page isn't already based on a template.
To apply a template to a page you've already created:Choose File
Open to open the page you want to alter.The Web page opens.Choose Window
Assets. Click the Asset panel's Templates button (see Figure 18-4).The Assets panel appears and reveals a list of the site's templates.
|
The Inconsistent Region Names dialog box opens (Figure 18-18).
In the list under Editable Regions, choose Document Body.
To the right, in the Resolved column, you'll see <Not Resolved>. This is Dreamweaver's
way of saying it doesn't know what to do with the contents of the current
page. You need to pick one of the template's editable regions.
From the Move Content to New Region menu, select an editable region.
If you want to keep the material, select the name of an editable region from the
list; otherwise, choose Nowhere, which, in effect, creates a new blank page based
on the template.
FREQUENTLY ASKED QUESTIONControlling the NestThe Template Properties dialog box includes a checkbox labeled "Allow Nested Templates to Control This." What does it do? Imagine that you create a template and add several optional regions and editable tag attributes to it. You then use this template as a basic design for more refined templates for each section of your site. When you create one of these nested templates based on the master template, it has access to the Template Properties window, where page authors can modify any of the template properties created by the original, master template. For example, to better identify each section of a site, you might add a different background color to each section's pages: blue for the products section, orange for the support section, and so on. In the master template, you make the <body> tag's Bgcolor property editable. Now, when you create a nested template for the products section, you simply open the Template Properties dialog box and set the property to the blue color you desire. For the support section's nested template, set the property to orange. Now when you create a template-based page for the support section, its background will be orange, while a page for the products section will have a blue background. However, to let your site's color palette go really wild, you might want every page in the site to have its own unique background color. (Disclaimer: Don't try this at home.) In this case, you'd want to let every page based on a nested template have an editable Bgcolor property.To do so, open the nested template, open the Template Properties window, select the property that should be editable in pages built from this template (color in this case), and turn on the "Allow Nested Templates to Control This," checkbox. Now this property is uneditable in the nested template, but editable in all pages created from it. You've probably realized by now that the phrase "Allow Nested Templates to Control This" doesn't make much sense. Turning it on actually prevents the nested template from controlling the property. A better way to think of it is "Allow pages created from this template to control this property." The bottom line: Turning on this box makes the attribute uneditable on that page. If it's a nested template, it lets the Template property "pass through" to all pages based on this template. In other words, you can't set the background color in the template, but page authors can change it in pages created from the template. |
are in the original, Dreamweaver merges them all into a single editable region.
When you apply a
template to a page
you've already created,
you must tell Dreamweaver
what to do
with the material that's
already on the page. Do
so by selecting one of
the template's editable
regions from a pop-up
menu, which will take
charge of all editable
regions in your page.
If Document Head also appears in the window, select it and choose "head" from
the Move Content to New Region menu.
Doing so will preserve any special information you added to the head of your page,
like Cascading Style Sheets, meta tags, custom JavaScript programs, and other
information that goes in the <head> of the document. Unfortunately, the title of
your original page is always replaced with the default title of the template. You'll
have to reenter the title (see Section 1.1.2) after you apply the
template.
If you apply a template to a page that has Dreamweaver Behaviors (
Chapter 12) applied to it, be
careful when selecting this option. If the same behaviors already exist in the template code, Dreamweaver
actually makes a duplicate copy of the JavaScript code in the <head> of the page. To get rid of the extra
code, you'll need to go into Code view (
Chapter 10) and manually remove it.
Click OK.
Your new page appears.
