Dreamweaver CS4 the missing manual

Dreamweaver CS4
THE MISSING MANUAL
The book that
should have been
in the box®



Dreamweaver CS4
THE
MISSING
MANUAL

®

David Sawyer McFarland

Beijing • Cambridge • Farnham • Köln • Sebastopol • Taipei • Tokyo


Dreamweaver CS4: The Missing Manual
by David Sawyer McFarland
Copyright © 2009 O’Reilly Media, Inc. All rights reserved.
Printed in the United States of America.
Published by O’Reilly Media, Inc., 1005 Gravenstein Highway North, Sebastopol, CA 95472.
O’Reilly books may be purchased for educational, business, or sales promotional use. Online editions are
also available for most titles (safari.oreilly.com). For more information, contact our corporate/institutional
sales department: (800) 998-9938 or

Printing History:
November 2008:

First Edition.

Nutshell Handbook, the Nutshell Handbook logo, the O’Reilly logo, and “The book that should have been
in the box” are registered trademarks of O’Reilly Media, Inc. Dreamweaver CS4: The Missing Manual, The
Missing Manual logo, Pogue Press, and the Pogue Press logo are trademarks of O’Reilly Media, Inc.
Many of the designations used by manufacturers and sellers to distinguish their products are claimed as
trademarks. Where those designations appear in this book, and O’Reilly Media, Inc. was aware of a
trademark claim, the designations have been printed in caps or initial caps.
While every precaution has been taken in the preparation of this book, the publisher and author assume no
responsibility for errors or omissions, or for damages resulting from the use of the information contained
herein.

ISBN: 978-0-596-52292-6
[M]

[4/09]


Table of Contents

The Missing Credits ................................................................................. xix
Introduction................................................................................................. 1

Part One: Building a Web Page
Chapter 1: Dreamweaver CS4 Guided Tour ........................................... 21
The Dreamweaver CS4 Interface ........................................................................................................... 21
The Document Window .................................................................................................................... 22

The Insert Panel ................................................................................................................................. 26
The Files Panel ................................................................................................................................... 28
The Property Inspector ..................................................................................................................... 30
The Application Bar ........................................................................................................................... 30
Organizing Your Workspace ............................................................................................................ 32
Setting Up a Site ....................................................................................................................................... 37
The Site Definition Wizard ................................................................................................................ 38
Defining a Site the Fast Way ............................................................................................................ 42
Creating a Web Page ............................................................................................................................... 44
The Dreamweaver Test Drive ................................................................................................................. 47
Phase 1: Getting Dreamweaver in Shape ....................................................................................... 48
Phase 2: Creating a Web Site ........................................................................................................... 52
Phase 3: Creating and Saving a Web Page .................................................................................... 53
Phase 4: Adding Images and Text ................................................................................................... 58
Phase 5: Preview Your Work ............................................................................................................ 65
Phase 6: Finishing the Page .............................................................................................................. 67

v


Chapter 2: Adding Text to Your Web Pages ........................................... 73
Adding Text in Dreamweaver ................................................................................................................. 73
Adding Special Characters ................................................................................................................ 74
Line Breaks ......................................................................................................................................... 75
Nonbreaking Spaces .......................................................................................................................... 77
Multiple Spaces .................................................................................................................................. 77
Adding a Date to Your Page ............................................................................................................. 78
Copying and Pasting Text ........................................................................................................................ 79
Simple Copy and Paste ..................................................................................................................... 79
Paste Special ....................................................................................................................................... 80

Pasting Text from Word: The Basic Method ................................................................................... 82
Pasting Text with Word Formatting ................................................................................................. 83
Pasting Excel Spreadsheet Information .......................................................................................... 84
Importing Word and Excel Documents (Windows) ...................................................................... 85
Selecting Text ............................................................................................................................................ 85
Spell Checking .......................................................................................................................................... 87
About Dictionaries ............................................................................................................................. 88
Performing the Check ........................................................................................................................ 88
Undo, Redo, and the History Panel ....................................................................................................... 90
Undo .................................................................................................................................................... 90
History Panel ...................................................................................................................................... 90

Chapter 3: Text Formatting ......................................................................93
Paragraph Formatting .............................................................................................................................. 95
Paragraphs .......................................................................................................................................... 95
Headlines ............................................................................................................................................ 97
Preformatted Text .............................................................................................................................. 97
Paragraph Alignment ........................................................................................................................ 98
Indented Paragraphs ......................................................................................................................... 99
Creating and Formatting Lists .............................................................................................................. 100
Bulleted and Numbered Lists ......................................................................................................... 100
Reformatting Bulleted and Numbered Lists ................................................................................. 102
Definition Lists .................................................................................................................................. 105
Removing and Deleting List Items ................................................................................................. 106
Text Styles ................................................................................................................................................ 107

Chapter 4: Introducing Cascading Style Sheets ................................... 111
Cascading Style Sheet Basics ................................................................................................................ 112
Why Use CSS? ................................................................................................................................... 112
Internal vs. External Style Sheets ................................................................................................... 113

Types of Styles .................................................................................................................................. 114
Creating Styles ........................................................................................................................................ 115
Phase 1: Set Up the CSS Type ........................................................................................................ 115
Phase 2: Defining the Style ............................................................................................................. 119
Creating a Style with the Property Inspector ............................................................................... 119

vi

Dreamweaver CS4: The Missing Manual


Using Styles ............................................................................................................................................. 122
Applying a Class Style ..................................................................................................................... 122
Removing a Class Style ................................................................................................................... 124
Applying IDs to a Tag ...................................................................................................................... 124
Linking to an External Style Sheet ................................................................................................. 125
Manipulating Styles ................................................................................................................................ 126
Editing Styles .................................................................................................................................... 126
Deleting a Style ................................................................................................................................ 127
Renaming a Class Style ................................................................................................................... 128
Duplicating a Style ........................................................................................................................... 130
Checking Browser Compatibility .......................................................................................................... 130
Text Formatting with CSS ...................................................................................................................... 133
Choosing a Font ............................................................................................................................... 134
Changing the Font Size ................................................................................................................... 137
Picking a Font Color ........................................................................................................................ 140
Adding Bold and Italics ................................................................................................................... 140
Aligning Text ..................................................................................................................................... 141
CSS Type Properties in the Rule Definition Window .................................................................. 141
Block Properties ............................................................................................................................... 143

List Properties ................................................................................................................................... 146
Cascading Style Sheets Tutorial ........................................................................................................... 148
Setting Up ......................................................................................................................................... 148
Creating an External Style Sheet .................................................................................................... 149
Editing a Style ................................................................................................................................... 151
Adding Another Style ...................................................................................................................... 153
Creating a Class Style ...................................................................................................................... 156
Attaching an External Style Sheet .................................................................................................. 158

Chapter 5: Links.......................................................................................161
Understanding Links .............................................................................................................................. 161
Absolute Links .................................................................................................................................. 162
Document-Relative Links ................................................................................................................ 162
Root-Relative Links .......................................................................................................................... 163
Link Types in Action ........................................................................................................................ 165
Executive Summary ......................................................................................................................... 167
Adding a Link .......................................................................................................................................... 167
Browsing for a File ........................................................................................................................... 167
Using the Point-to-File Tool ............................................................................................................ 170
Typing (or Pasting) the URL or Path ............................................................................................. 171
Using the Hyperlink Object ............................................................................................................ 172
Adding an Email Link ............................................................................................................................. 175
Linking Within a Web Page ................................................................................................................... 176
Method 1: Creating a Named Anchor .......................................................................................... 177
Method 2: Adding an ID ................................................................................................................. 178
Linking to an Anchor or ID ............................................................................................................. 179
Viewing and Hiding Anchors .......................................................................................................... 179

Table of Contents

vii


Modifying a Link ..................................................................................................................................... 180
Changing a Link’s Destination ........................................................................................................ 180
Removing a Link ............................................................................................................................... 180
Styling Links ............................................................................................................................................ 181
CSS and Links ................................................................................................................................... 182
Creating a Navigation Menu ................................................................................................................. 184
Adding a Menu ................................................................................................................................. 185
Adding, Editing, and Removing Links ............................................................................................ 186
Changing the Look of the Menu .................................................................................................... 188
Link Tutorial ............................................................................................................................................ 195
Linking to Other Pages and Web Sites .......................................................................................... 195
Formatting Links .............................................................................................................................. 197
Adding a Navigation Bar ................................................................................................................. 199
Styling the Menu Bar ....................................................................................................................... 203
Submenus and Rollover Buttons ................................................................................................... 208

Chapter 6: Images................................................................................... 213
Adding Images ........................................................................................................................................ 213
Adding an Image Placeholder ........................................................................................................ 216
Inserting an Image from Photoshop .................................................................................................... 217
Method 1: Using the Insert Image Object .................................................................................... 219
Method 2: Copying and Pasting from Photoshop ....................................................................... 224
Modifying an Image ............................................................................................................................... 224
Adding an ID to an Image ............................................................................................................... 225
Adding a Text Description to an Image ........................................................................................ 225
Changing an Image’s Size ............................................................................................................... 227
Some Properties to Avoid ............................................................................................................... 227

Controlling Images with CSS ................................................................................................................. 229
Wrapping Text Around an Image .................................................................................................. 229
Adding Borders ................................................................................................................................ 231
Background Images ......................................................................................................................... 233
Editing Graphics ...................................................................................................................................... 236
The Built-In Editing Tools ................................................................................................................ 236
Setting Up an External Editor ......................................................................................................... 239
Editing Smart Objects ...................................................................................................................... 241
Editing Images Pasted from Photoshop ........................................................................................ 244
Optimizing an Image ....................................................................................................................... 245
Image Maps ............................................................................................................................................. 245
Editing a Hotspot’s Properties ........................................................................................................ 248
Rollover Images ...................................................................................................................................... 248
Tutorial: Inserting and Formatting Graphics ...................................................................................... 251
Setting Up .......................................................................................................................................... 251
Adding an Image .............................................................................................................................. 251
Inserting a Photoshop File .............................................................................................................. 253
Inserting a Rollover Image .............................................................................................................. 257
Using Background Images .............................................................................................................. 259

viii

Dreamweaver CS4: The Missing Manual


Chapter 7: Tables ....................................................................................263
Table Basics ............................................................................................................................................. 264
Inserting a Table ..................................................................................................................................... 265
Selecting Parts of a Table ...................................................................................................................... 268
Selecting a Table .............................................................................................................................. 268

Selecting Rows or Columns ............................................................................................................ 268
Selecting Cells .................................................................................................................................. 269
Expanded Table Mode ........................................................................................................................... 269
Formatting Tables .................................................................................................................................. 270
Aligning Tables ................................................................................................................................. 270
Clearing Height and Width Values ................................................................................................ 271
Resizing a Table ............................................................................................................................... 272
Modifying Cell and Row Properties ..................................................................................................... 273
Alignment Properties ...................................................................................................................... 273
Table Header .................................................................................................................................... 274
A Property to Forget ........................................................................................................................ 274
Cell Decoration ................................................................................................................................ 275
Setting Cell Dimensions .................................................................................................................. 276
Tips for Surviving Table Making .................................................................................................... 276
Adding and Removing Cells .................................................................................................................. 278
Adding One Row or Column .......................................................................................................... 278
Adding Multiple Rows or Columns ............................................................................................... 279
Deleting Rows and Columns .......................................................................................................... 280
Merging and Splitting Cells ................................................................................................................... 280
Tabular Data ........................................................................................................................................... 282
Importing Data into a Table ........................................................................................................... 282
Sorting Data in a Table ................................................................................................................... 284
Exporting Table Data ....................................................................................................................... 286
Tables Tutorial ........................................................................................................................................ 286
Adding a Table and Data ................................................................................................................ 287
Modifying the Table ........................................................................................................................ 289
Formatting the Table ....................................................................................................................... 290
Final Improvements ........................................................................................................................ 294

Part Two: Building a Better Web Page

Chapter 8: Advanced CSS.......................................................................299
Compound Selectors ............................................................................................................................. 299
Descendent Selectors ...................................................................................................................... 301
Styling Groups of Tags .................................................................................................................... 304
Fast Style Editing with the Properties Pane ........................................................................................ 305
Moving and Managing Styles ............................................................................................................... 308
More About CSS ..................................................................................................................................... 311
Inheritance ........................................................................................................................................ 312
The Cascade ..................................................................................................................................... 314
The Other Side of the CSS Styles Panel ........................................................................................ 315
Table of Contents

ix


Using the Code Navigator ..................................................................................................................... 320
Styling for Print ....................................................................................................................................... 322
Previewing Media Styles in Dreamweaver ................................................................................... 324
Tips for Printer Style Sheets ........................................................................................................... 325

Chapter 9: Page Layout ..........................................................................329
Types of Web Page Layouts .................................................................................................................. 331
Float Layout Basics ................................................................................................................................. 332
The Mighty <div> Tag ...................................................................................................................... 333
The Insert Div Tag Tool ................................................................................................................... 335
A Simple Example ............................................................................................................................ 337
Understanding the Box Model .............................................................................................................. 341
Dreamweaver’s CSS Layouts ................................................................................................................ 345
The Structure of Dreamweaver’s CSS Layouts ............................................................................ 350
Modifying Dreamweaver’s CSS Layouts ............................................................................................. 352

Making General Changes ................................................................................................................ 352
Modifying Fixed Layouts ................................................................................................................. 355
Modifying Liquid Layouts ............................................................................................................... 357
Modifying Elastic Layouts ............................................................................................................... 357
Absolute Positioning .............................................................................................................................. 358
The CSS Positioning Properties ...................................................................................................... 358
Adding an AP Div to Your Page ............................................................................................................ 366
Drawing AP Divs ..................................................................................................................................... 369
The AP Elements Panel .......................................................................................................................... 370
Modifying AP Element Properties ........................................................................................................ 371
Resizing Absolutely Positioned Elements ..................................................................................... 372
Moving AP Elements ........................................................................................................................ 372
Aligning AP Elements ....................................................................................................................... 373
Background Image and Color ........................................................................................................ 374
Nesting AP Divs ....................................................................................................................................... 374
CSS Layout Tutorial ................................................................................................................................ 375
Adding Content ................................................................................................................................ 379
Fine-Tuning the Layout ................................................................................................................... 380
Adding Styles and Navigation ........................................................................................................ 383
Fiddling with the Footer .................................................................................................................. 386

Chapter 10: Under the Hood: HTML...................................................... 391
Roundtrip HTML ..................................................................................................................................... 391
Auto-Fixing Your Code .................................................................................................................... 392
Web Application Server Pages ....................................................................................................... 393
Special Characters and Encoding .................................................................................................. 394
Code View ............................................................................................................................................... 395
Coding Toolbar ................................................................................................................................. 400
Code Hints ........................................................................................................................................ 402
Code Collapse .................................................................................................................................. 404

Setting Code Formatting ................................................................................................................. 406
Related Files ...................................................................................................................................... 410
x

Dreamweaver CS4: The Missing Manual


Live Code ................................................................................................................................................. 412
Quick Tag Editor ..................................................................................................................................... 413
Using the Quick Tag Editor ............................................................................................................. 414
Tag Inspector .......................................................................................................................................... 415
Comparing Versions of a Web Page .................................................................................................... 416
Using WinMerge to Compare Files ............................................................................................... 419
Using Text Wrangler to Compare Files ......................................................................................... 421
Reference Panel ...................................................................................................................................... 422
Inserting JavaScript ................................................................................................................................ 424

Part Three: Bringing Your Pages to Life
Chapter 11: Forms...................................................................................429
Form Basics ............................................................................................................................................. 429
The Code Backstage ........................................................................................................................ 430
Creating a Form ..................................................................................................................................... 431
Adding Form Elements .......................................................................................................................... 435
What All Form Elements Have in Common ................................................................................. 435
Text Fields ......................................................................................................................................... 439
Checkboxes and Checkbox Groups ............................................................................................... 442
Radio Buttons and Radio Groups .................................................................................................. 445
Pull-Down Menus and Lists ............................................................................................................ 446
File Field ............................................................................................................................................ 449
Hidden Field ..................................................................................................................................... 450

Buttons .............................................................................................................................................. 451
<label> Tag ....................................................................................................................................... 453
<fieldset> Tag ................................................................................................................................... 453
Validating Forms .................................................................................................................................... 454
Spry Validation Basics ..................................................................................................................... 455
Formatting Spry Error Messages and Fields ................................................................................ 460
Spry Text Field .................................................................................................................................. 462
Spry Text Area .................................................................................................................................. 468
Spry Checkbox ................................................................................................................................. 470
Spry Select ........................................................................................................................................ 473
Spry Password .................................................................................................................................. 474
Spry Confirm .................................................................................................................................... 476
Spry Radio Group ............................................................................................................................ 476
Forms Tutorial ........................................................................................................................................ 477
Inserting a Form and Adding a Form Field .................................................................................. 478
Adding a Spry Validation Text Field .............................................................................................. 483
Adding a Spry Form Menu ............................................................................................................. 486
Adding a Spry Radio Group ........................................................................................................... 489
Completing and Testing the Form ................................................................................................. 491

Table of Contents

xi


Chapter 12: Spry: Creating Interactive Web Pages..............................493
What is Spry? .......................................................................................................................................... 493
Tabbed Panels ........................................................................................................................................ 494
Adding a Tabbed Panel ................................................................................................................... 495
Adding and Editing Panel Content ................................................................................................ 497

Formatting Tabbed Panels .............................................................................................................. 498
Accordions ............................................................................................................................................... 501
Adding an Accordion ....................................................................................................................... 502
Adding and Editing Accordion Content ........................................................................................ 503
Formatting a Spry Accordion ......................................................................................................... 504
Collapsible Panels .................................................................................................................................. 508
Adding a Collapsible Panel ............................................................................................................. 508
Adding Content to a Collapsible Panel ......................................................................................... 510
Formatting a Collapsible Panel ...................................................................................................... 511
Spry Tooltips ........................................................................................................................................... 513
Adding a Spry Tooltip ...................................................................................................................... 513
Adding Content to a Tooltip ........................................................................................................... 517
Formatting a Tooltip ........................................................................................................................ 518
Spry Data Sets ......................................................................................................................................... 518
Storing Data in an HTML File ......................................................................................................... 520
Storing Data in an XML File ............................................................................................................ 522
Inserting a Spry Data Set ................................................................................................................ 527
Inserting HTML Data ........................................................................................................................ 529
Inserting XML Data .......................................................................................................................... 534
Choosing a Data Layout .................................................................................................................. 536
Creating a Spry Region .................................................................................................................... 545
The Bindings Panel .......................................................................................................................... 548
Spry Repeating Region .................................................................................................................... 549
Spry Repeat Lists .............................................................................................................................. 551
Live View .................................................................................................................................................. 553

Chapter 13: Dreamweaver Behaviors ...................................................555
Understanding Behaviors ...................................................................................................................... 556
Behavior Elements ........................................................................................................................... 556
More About Events .......................................................................................................................... 556

Applying Behaviors ................................................................................................................................ 557
The Behaviors Panel ........................................................................................................................ 557
Applying Behaviors, Step by Step .................................................................................................. 559
Adding Multiple Behaviors ............................................................................................................. 561
Editing Behaviors ............................................................................................................................. 562
A Quick Example .............................................................................................................................. 562
Events ....................................................................................................................................................... 563
Mouse Events ................................................................................................................................... 563
Keyboard Events .............................................................................................................................. 565
Body and Frameset Events ............................................................................................................. 566
Selection and Highlighting Events ................................................................................................. 566
Form Events ...................................................................................................................................... 567
xii

Dreamweaver CS4: The Missing Manual


The Actions, One by One ...................................................................................................................... 567
Spry Effects ....................................................................................................................................... 568
Navigation Actions ........................................................................................................................... 575
Image Actions ................................................................................................................................... 582
Message Actions .............................................................................................................................. 586
Element Actions ............................................................................................................................... 589
Advanced Behaviors .............................................................................................................................. 592
Call JavaScript .................................................................................................................................. 592
Change Property .............................................................................................................................. 593
Adding More Behaviors ........................................................................................................................ 594

Chapter 14: Flash and Other Multimedia .............................................595
Flash: An Introduction ........................................................................................................................... 596

Inserting a Flash Movie ................................................................................................................... 597
Flash Movie Properties ................................................................................................................... 599
Making It Easier to Download the Flash Plug-in ................................................................................ 603
Adding Flash Videos .............................................................................................................................. 604
The Land of Obsolete Web Technology .............................................................................................. 608

Part Four: Building a Web Site
Chapter 15: Introducing Site Management............................................613
Structuring a Web Site ........................................................................................................................... 614
Defining a Site .................................................................................................................................. 618
Editing or Removing Defined Sites ................................................................................................ 622
Exporting and Importing Sites ....................................................................................................... 623
Organizing Site Files ........................................................................................................................ 625
Modifying the Files Panel View ...................................................................................................... 627
Adding New Folders and Files ....................................................................................................... 628
Site Assets ................................................................................................................................................ 633
Viewing the Assets Panel ................................................................................................................ 634
Inserting Assets ................................................................................................................................ 636
Favorite Assets ................................................................................................................................. 637

Chapter 16: Testing Your Site................................................................. 641
Site Launch Checklist ............................................................................................................................. 641
Find and Fix Broken Links ..................................................................................................................... 643
Finding Broken Links ....................................................................................................................... 644
Fixing Broken Links ......................................................................................................................... 646
Listing External Links ....................................................................................................................... 647
Orphaned Files ................................................................................................................................. 648
Changing a Link Throughout a Site ............................................................................................... 650
Validating Web Pages ............................................................................................................................ 651
Steps for Validating Web Pages ..................................................................................................... 652

Cleaning Up HTML (and XHTML) ........................................................................................................ 654

Table of Contents

xiii


Site Reporting .......................................................................................................................................... 657
Accessibility ............................................................................................................................................. 660
Accessibility Priorities ...................................................................................................................... 663
Accessibility Options ........................................................................................................................ 664
Download Statistics ................................................................................................................................ 665

Chapter 17: Moving Your Site to the Internet ......................................667
Defining a Remote Site .......................................................................................................................... 668
Setting Up a Remote Site with FTP ................................................................................................ 669
Setting Up a Remote Site over a Local Network .......................................................................... 673
Setting Up a Remote Site with RDS ............................................................................................... 674
Setting Up a Remote Site with WebDAV ....................................................................................... 675
Setting Up a Remote Site with SourceSafe ................................................................................... 677
Transferring Files .................................................................................................................................... 678
Moving Files to the Web Server ..................................................................................................... 678
Getting Files from the Web Server ................................................................................................ 682
Cloaking Files .................................................................................................................................... 684
Check In and Check Out ........................................................................................................................ 686
Checking Out Files ........................................................................................................................... 688
Checking In Files .............................................................................................................................. 691
Synchronizing Site Files ......................................................................................................................... 693
Communicating with Design Notes ..................................................................................................... 696
Setting Up Design Notes ................................................................................................................. 697

Adding Design Notes to a File ........................................................................................................ 698
Viewing Design Notes ...................................................................................................................... 699
Organizing the Columns in the Files Panel .................................................................................. 699
“All Info” Design Notes in Column Views ..................................................................................... 701

Part Five: Dreamweaver CS4 Power
Chapter 18: Snippets and Libraries ....................................................... 707
Snippets Basics ....................................................................................................................................... 707
Using Snippets ........................................................................................................................................ 708
Creating Snippets ................................................................................................................................... 710
Organizing Snippets ........................................................................................................................ 711
Built-In Snippets ..................................................................................................................................... 712
Library Basics .......................................................................................................................................... 713
Creating and Using Library Items ........................................................................................................ 714
Adding Library Items to a Page ...................................................................................................... 716
Editing Library Items .............................................................................................................................. 717
Renaming Library Elements ........................................................................................................... 719
Deleting Library Elements ............................................................................................................... 719
Snippets and Library Tutorial ............................................................................................................... 719
Creating a Snippet ........................................................................................................................... 720
Creating a Library Item ................................................................................................................... 723

xiv

Dreamweaver CS4: The Missing Manual


Chapter 19: Templates............................................................................ 727
Template Basics ...................................................................................................................................... 727
Creating a Template .............................................................................................................................. 730

Turning a Web Page into a Template ........................................................................................... 730
Building a Template from Scratch ................................................................................................. 732
Defining Editable Regions ..................................................................................................................... 732
Adding a Basic Editable Region ..................................................................................................... 733
Adding a Repeating Region ............................................................................................................ 736
Repeating Tables .............................................................................................................................. 738
Making a Tag Attribute Editable .................................................................................................... 741
Adding Optional Regions ...................................................................................................................... 744
Locking Optional Regions ............................................................................................................... 745
Repeating Optional Regions ........................................................................................................... 746
Optional Editable Regions .............................................................................................................. 746
Advanced Optional Regions ........................................................................................................... 746
Editing and Removing Optional Regions ...................................................................................... 750
Nested Templates .................................................................................................................................. 751
Customizing Nested Templates ..................................................................................................... 754
Using Nested Templates ................................................................................................................. 755
Building Pages Based on a Template .................................................................................................. 756
Working with Repeating Regions .................................................................................................. 756
Changing Properties of Editable Tag Attributes .......................................................................... 757
Hiding and Showing Optional Regions ......................................................................................... 758
Applying Templates to Existing Pages ........................................................................................... 758
Updating a Template ............................................................................................................................. 761
Updating Nested Templates ........................................................................................................... 762
Unlinking a Page from a Template ................................................................................................ 763
Exporting a Template-Based Site ................................................................................................... 764
Template Tutorial ................................................................................................................................... 765
Creating a Template ........................................................................................................................ 765
Creating a Page Based on a Template .......................................................................................... 769
Creating Another Template-Based Page ...................................................................................... 773
Updating a Template ....................................................................................................................... 774

Chapter 20: Automating Dreamweaver................................................ 777
The History Panel Revisited .................................................................................................................. 777
Replay Your Steps ............................................................................................................................ 778
Exceptions and Errors ..................................................................................................................... 779
Copying and Pasting Actions .......................................................................................................... 779
Save Steps as Commands ............................................................................................................... 780
Recording Commands .................................................................................................................... 781
Find and Replace .................................................................................................................................... 782
Find and Replace Basics ................................................................................................................. 783
Basic Text and HTML Searches ...................................................................................................... 783
Advanced Text Searches ................................................................................................................. 788
Advanced Tag Searches .................................................................................................................. 792
A Powerful Example: Adding Alt Text Fast ................................................................................... 794
Table of Contents

xv


Chapter 21: Customizing Dreamweaver ...............................................799
Keyboard Shortcuts ................................................................................................................................ 799
Make Your Own Shortcut Set ......................................................................................................... 800
Changing Keyboard Shortcuts ....................................................................................................... 801
Create a Shortcut Cheat Sheet ....................................................................................................... 804
Dreamweaver Extensions ...................................................................................................................... 804
Browse the Exchange ...................................................................................................................... 805
Find a Good Extension .................................................................................................................... 807
Other Extension Sources ................................................................................................................. 808
Download and Install Extensions ................................................................................................... 808
Extension Manager .......................................................................................................................... 809

Make Your Own Extensions ............................................................................................................ 810

Part Six: Dynamic Dreamweaver
Chapter 22: Getting Started with Dynamic Web Sites ........................ 815
Pieces of the Puzzle ................................................................................................................................ 817
Understanding Server Models ....................................................................................................... 818
Picking a Server Model .................................................................................................................... 821
Dynamic Web Sites: The Setup ............................................................................................................ 821
Setting Up a Testing Server ............................................................................................................ 822
Localhost and the htdocs Folder ................................................................................................... 823
Setting Up Dreamweaver ................................................................................................................ 824
Creating a Dynamic Page ...................................................................................................................... 828
Databases: A Quick Introduction ......................................................................................................... 829
Tables and Records .......................................................................................................................... 830
Relational Databases ....................................................................................................................... 831
Loading a Database ............................................................................................................................... 833
Connecting to a Database ..................................................................................................................... 838
Exploring the Databases Panel ....................................................................................................... 841

Chapter 23: Adding Dynamic Data to Your Pages ...............................843
Retrieving Information ........................................................................................................................... 843
Understanding Recordsets .............................................................................................................. 843
Creating Recordsets ......................................................................................................................... 844
Filtering Information ........................................................................................................................ 847
Comparison Operators for Filters .................................................................................................. 849
Getting Comparison Values ............................................................................................................ 850
Advanced Recordsets and SQL ...................................................................................................... 855
Reusing Recordsets .......................................................................................................................... 861
Editing Recordsets ............................................................................................................................ 861
Deleting Recordsets ......................................................................................................................... 862

Adding Dynamic Information ............................................................................................................... 862
The Bindings Panel .......................................................................................................................... 864
Formatting Dynamic Information .................................................................................................. 864
Deleting Dynamic Information ....................................................................................................... 866
xvi

Dreamweaver CS4: The Missing Manual


Displaying Multiple Records ................................................................................................................. 866
Creating a Repeating Table ............................................................................................................ 866
Creating a Repeat Region ............................................................................................................... 868
Editing and Removing a Repeat Region ....................................................................................... 870
Recordset Navigation ............................................................................................................................. 870
Recordset Navigation Bar ............................................................................................................... 871
Recordset Navigation Status .......................................................................................................... 873
Viewing Live Data ................................................................................................................................... 875
Live Data View Settings ................................................................................................................... 876
Master Detail Page Set .......................................................................................................................... 879
Passing Information Between Pages ................................................................................................... 882
Tutorial: Displaying Database Info ...................................................................................................... 884
Creating a Recordset ....................................................................................................................... 885
Live Data View and Creating Repeating Regions ........................................................................ 887
Editing a Recordset and Linking to a Detail Page ........................................................................ 889
Building the Detailed Product Page .............................................................................................. 893
Filling in the Details ......................................................................................................................... 896
Operators Standing By .................................................................................................................... 900

Chapter 24: Web Pages That Manipulate Database Records..............905
Adding Data ............................................................................................................................................ 905

Dreamweaver’s Record Insertion Form Wizard .......................................................................... 906
Using the Insert Record Behavior .................................................................................................. 910
Updating Database Records ................................................................................................................. 912
The Update Record Form Wizard .................................................................................................. 913
The Update Record Server Behavior ............................................................................................. 916
Dynamic Form Fields ............................................................................................................................. 920
Dynamic Text Form Fields .............................................................................................................. 921
Dynamic Checkboxes and Radio Buttons ..................................................................................... 922
Dynamic Menus and Lists .............................................................................................................. 925
Deleting Records .................................................................................................................................... 927
Deleting Records for ASP ................................................................................................................ 928
Deleting Records for PHP and ColdFusion ................................................................................... 929
Tutorial: Inserting and Updating Data ................................................................................................. 932
Adding an Insert Product Page ...................................................................................................... 932
Finishing the Insert Form ................................................................................................................ 939
Building a Page for Editing Database Records ............................................................................ 940
Creating and Linking to the Delete Page ...................................................................................... 948

Chapter 25: Advanced Dynamic Site Features .....................................953
Password-Protecting Web Pages .......................................................................................................... 953
The Users Table ............................................................................................................................... 954
Creating a Registration Form ......................................................................................................... 954
Creating the Login Page .................................................................................................................. 957
The Log Out User Behavior ............................................................................................................ 960
Protecting Individual Pages ............................................................................................................ 962

Table of Contents

xvii

Additional Data Sources ........................................................................................................................ 963
For PHP and ColdFusion ................................................................................................................. 964
For ASP .............................................................................................................................................. 965
URL Variables ................................................................................................................................... 966
Form Variables ................................................................................................................................. 966
Cookies .............................................................................................................................................. 967
Session Variables ............................................................................................................................. 968
Server Variables ............................................................................................................................... 970
Advanced Server Behaviors .................................................................................................................. 972
Recordset Paging .............................................................................................................................. 972
Show Region Server Behaviors ...................................................................................................... 974
Tutorial: Authentication ......................................................................................................................... 977
Building a Login Page ...................................................................................................................... 977
Password-Protecting the Administration Pages ........................................................................... 981
Displaying a Portion of a Page to Logged-In Users ..................................................................... 984

Chapter 26: Server-Side XML and XSLT ................................................987
Understanding the Technologies ......................................................................................................... 988
Creating Dynamic Pages with XSLT and XML ..................................................................................... 989
Inserting and Formatting XML .............................................................................................................. 992
Inserting a Repeat Region ............................................................................................................... 996
Inserting a Conditional Region .....................................................................................................1001
Using Multiple Conditional Regions ............................................................................................1003
Advanced XSLT Tricks ..........................................................................................................................1005
Sorting Data in a Repeat Region ..................................................................................................1005
Using XSLT Parameters .................................................................................................................1006

Part Seven: Appendixes
Appendix A: Getting Help .....................................................................1013

Appendix B: Dreamweaver CS4, Menu by Menu ...............................1017
Index ...................................................................................................... 1039

xviii

Dreamweaver CS4: The Missing Manual


The Missing Credits
About the Author
David Sawyer McFarland is president of Sawyer McFarland Media,
Inc., a Web development and training company in Portland, Oregon. He’s been building Web sites since 1995, when he designed his
first Web site: an online magazine for communication professionals. He’s served as the Webmaster at the University of California at
Berkeley and the Berkeley Multimedia Research Center, and he has
helped build, design, and program numerous Web sites for clients
including Macworld.com, among others.
In addition to building Web sites, David is also a writer, trainer, and instructor.
He’s taught Dreamweaver at the UC Berkeley Graduate School of Journalism, the
Center for Electronic Art, the Academy of Art College, Ex’Pressions Center for
New Media, and the Art Institute of Portland. He currently teaches in the Multimedia Program at Portland State University. He’s written articles about Dreamweaver and the Web for Practical Web Design, MX Developer’s Journal, Macworld
magazine and CreativePro.com.
David is also the author of CSS: The Missing Manual, and JavaScript: The Missing
Manual.
David has used Dreamweaver since version 2, and has been a member of the
Dreamweaver Advisory Council. He welcomes feedback about this book by email:
(If you’re seeking technical help, however, please refer to the
sources listed in Appendix Getting Help.)

About the Creative Team
Peter Meyers (editor) is the managing editor of O’Reilly Media’s Missing Manual

series. He lives with his wife, daughter, and cats in New York City. Email:

Sohaila Abdulali (copy editor) is a freelance writer and editor. She has published a
novel, several children’s books, and numerous short stories and articles. She
recently finished an ethnography of an aboriginal Indian woman. She lives in New
York City with her husband Tom and their small but larger-than-life daughter,
Samara. She can be reached through her Web site at www.sohailaink.com.
Nellie McKesson (production editor) lives in Jamaica Plain, Mass., and spends her
spare time making t-shirts for her friends to wear (mattsaundersbynellie.etsy.com),
and playing music with her band (myspace.com/drmrsvandertrampp). Email:

xix

Dreamweaver CS4: The Missing Manual, eMatter Edition
Copyright © 2009 O’Reilly & Associates, Inc. All rights reserved.


Ron Strauss (indexer) is a full-time freelance indexer specializing in information
technology. When not working, he moonlights as a concert violist and alternative
medicine health consultant. Email:
Deborah Pang Davis (Chia Vet Web site designer) created Cococello, a print and
Web design boutique in beautiful Portland, Oregon. Before launching Cococello,
she had the privilege of working at, among others, National Geographic Traveler,
The Chicago Tribune, Toronto’s Globe and Mail, and The Seattle Times. She knew
early on that life for her never included pantyhose or the pantsuit. She can be
reached through her Web site at www.cococello.com.
John C. Bland II (technical reviewer) is co-founder of Katapult Media Inc. (www.
katapultmedia.com) which focuses on software and Web development using technologies such as ColdFusion, the Flash platform, PHP, Java, and the .NET platform. Through Katapult, he works diligently on custom software and Web
products. As the manager of the Arizona Flash Platform User Group, John continues to put back into the community which helped mold him into the developer he
is today. John blogs regularly on his blog: Geek Life (www.johncblandii.com).

Murray Summers (technical reviewer), a biochemist by training, has spent the last
20 years working in the computer industry. In 1998, Murray started his Web site
production company, Great Web Sights (www.great-web-sights.com). He’s an
Adobe Community Expert, and previously a Team Macromedia member, a Macromedia Certified Web Site Developer, and Dreamweaver Developer. Murray has
also contributed chapters and authored books about Web development.

Acknowledgements
Many thanks to all those who helped with this book, including Deb Pang Davis,
the design mastermind behind ChiaVet.com, and my technical editor, Murray
Summers, whose prolific critiques have provided a comfortable safety net to protect me from any embarrassing gaffes. Thanks also to my students who’ve helped
me understand Dreamweaver better and always seem to come up with at least one
question that I have no answer for.
Finally, thanks to David Pogue whose unflagging enthusiasm and boundless energy
never fails to inspire; to my editor, Peter Meyers, who has helped make my words
sharper and my writing clearer (and who also has had to endure long weekends of
work to make sure this book got finished on time); to my wife, Scholle, for being
such a strong supporter of my writing and a wonderful partner in my life; my
mom and Doug; Mary, David, Marisa and Tessa; Phyllis and Les; my son, Graham, who has taught me that robots, spaceships, Star Wars, and Legos are much
more important than writing books; and to my daughter, Kate, who helped the
most by graciously agreeing to sleep through the night while I was writing this
book.
—David Sawyer McFarland

xx

Dreamweaver CS4: The Missing Manual
Dreamweaver CS4: The Missing Manual, eMatter Edition
Copyright © 2009 O’Reilly & Associates, Inc. All rights reserved.

The Missing Manual Series
Missing Manuals are witty, superbly written guides to computer products that
don’t come with printed manuals (which is just about all of them). Each book features a handcrafted index and cross-references to specific pages (not just chapters).
Recent and upcoming titles include:
Access 2007: The Missing Manual by Matthew MacDonald
AppleScript: The Missing Manual by Adam Goldstein
AppleWorks 6: The Missing Manual by Jim Elferdink and David Reynolds
CSS: The Missing Manual by David Sawyer McFarland
Creating a Web Site: The Missing Manual, Second Edition by Matthew MacDonald
David Pogue’s Digital Photography: The Missing Manual by David Pogue
Dreamweaver CS3: The Missing Manual by David Sawyer McFarland
eBay: The Missing Manual by Nancy Conner
Excel 2003: The Missing Manual by Matthew MacDonald
Excel 2007: The Missing Manual by Matthew MacDonald
Facebook: The Missing Manual by E.A. Vander Veer
FileMaker Pro 8: The Missing Manual by Geoff Coffey and Susan Prosser
FileMaker Pro 9: The Missing Manual by Geoff Coffey and Susan Prosser
Flash CS3: The Missing Manual by E.A. Vander Veer and Chris Grover
Flash CS4: The Missing Manual by Chris Grover
FrontPage 2003: The Missing Manual by Jessica Mantaro
Google Apps: The Missing Manual by Nancy Conner
The Internet: The Missing Manual by David Pogue and J.D. Biersdorfer
iMovie 6 & iDVD: The Missing Manual by David Pogue
iMovie ’08 & iDVD: The Missing Manual by David Pogue
iPhone: The Missing Manual by David Pogue
iPhoto ’08: The Missing Manual by David Pogue
iPod: The Missing Manual, Seventh Edition by J.D. Biersdorfer
JavaScript: The Missing Manual by David Sawyer McFarland
Mac OS X: The Missing Manual, Tiger Edition by David Pogue
Mac OS X: The Missing Manual, Leopard Edition by David Pogue

The Missing Credits
Dreamweaver CS4: The Missing Manual, eMatter Edition
Copyright © 2009 O’Reilly & Associates, Inc. All rights reserved.

xxi


Microsoft Project 2007: The Missing Manual by Bonnie Biafore
Office 2004 for Macintosh: The Missing Manual by Mark H. Walker and Franklin
Tessler
Office 2007: The Missing Manual by Chris Grover, Matthew MacDonald, and E.A.
Vander Veer
Office 2008 for Macintosh: The Missing Manual by Jim Elferdink
PCs: The Missing Manual by Andy Rathbone
Photoshop CS4: The Missing Manual by Lesa Snider King
Photoshop Elements 7: The Missing Manual by Barbara Brundage
Photoshop Elements 6 for Mac: The Missing Manual by Barbara Brundage
PowerPoint 2007: The Missing Manual by E.A. Vander Veer
QuickBase: The Missing Manual by Nancy Conner
QuickBooks 2008: The Missing Manual by Bonnie Biafore
QuickBooks 2009: The Missing Manual by Bonnie Biafore
Quicken 2008: The Missing Manual by Bonnie Biafore
Quicken 2009: The Missing Manual by Bonnie Biafore
Switching to the Mac: The Missing Manual, Tiger Edition by David Pogue and
Adam Goldstein
Switching to the Mac: The Missing Manual, Leopard Edition by David Pogue
Wikipedia: The Missing Manual by John Broughton
Windows XP Home Edition: The Missing Manual, Second Edition by David Pogue
Windows XP Pro: The Missing Manual, Second Edition by David Pogue, Craig

Zacker, and Linda Zacker
Windows Vista: The Missing Manual by David Pogue
Windows Vista for Starters: The Missing Manual by David Pogue
Word 2007: The Missing Manual by Chris Grover
Your Brain: The Missing Manual by Matthew MacDonald

xxii

Dreamweaver CS4: The Missing Manual
Dreamweaver CS4: The Missing Manual, eMatter Edition
Copyright © 2009 O’Reilly & Associates, Inc. All rights reserved.


Introduction

The World Wide Web continues to evolve, growing in scope and complexity, with
new features popping up every year to make the Web look and work better. Even
people building personal Web sites now use various programming languages and
server technologies to dish up content. Throughout its history, Dreamweaver has
managed to keep pace with this changing landscape with each new version.
Dreamweaver CS4 is no exception: It’s capable of doing more than any previous
version. Whether you’re creating database-enabled PHP pages, adding your favorite site’s XML-based news feeds directly to your home page, using Cascading Style
Sheets (CSS) for cutting-edge design effects, dipping into the dynamic world of
JavaScript and AJAX, or simply sticking to straightforward HTML pages, Dreamweaver has just about all the tools you need.
Any enterprising designer can create Web pages, Cascading Style Sheets, and even
JavaScript programs with a simple text editor. In fact, Dreamweaver CS4 provides
powerful text-editing abilities for creating basic text files or complex databasedriven Web pages. But why go to all that trouble when Dreamweaver’s visual
page-building approach makes your job of creating beautiful and complex Web
sites so much easier? Whether you’re new to building Web pages or a hard-core,
hand-coding HTML jockey, Dreamweaver is a powerful tool that lets you build

Web sites quickly and efficiently, without compromising the quality of your code.

What Dreamweaver Is All About
Dreamweaver is a complete Web site production and management program. It
works with Web technologies like HTML, XHTML, CSS, and JavaScript.

1