Getting Started with Dreamweaver Trademarks 1 Step RoboPDF, ActiveEdit, ActiveTest, Authorware, Blue Sky Software, Blue Sky, Breeze, Breezo, Captivate, Central, ColdFusion, Contribute, Database Explorer, Director, Dreamweaver, Fireworks, Flash, FlashCast, FlashHelp, Flash Lite, FlashPaper, Flex, Flex Builder, Fontographer, FreeHand, Generator, HomeSite, JRun, MacRecorder, Macromedia, MXML, RoboEngine, RoboHelp, RoboInfo, RoboPDF, Roundtrip, Roundtrip HTML, Shockwave, SoundEdit, Studio MX, UltraDev, and WebHelp are either registered trademarks or trademarks of Macromedia, Inc. and may be registered in the United States or in other jurisdictions including internationally. Other product names, logos, designs, titles, words, or phrases mentioned within this publication may be trademarks, service marks, or trade names of Macromedia, Inc. or other entities and may be registered in certain jurisdictions including internationally. Third-Party Information This guide contains links to third-party websites that are not under the control of Macromedia, and Macromedia is not responsible for the content on any linked site. If you access a third-party website mentioned in this guide, then you do so at your own risk. Macromedia provides these links only as a convenience, and the inclusion of the link does not imply that Macromedia endorses or accepts any responsibility for the content on those third-party sites. Opera ® browser Copyright © 1995-2002 Opera Software ASA and its suppliers. All rights reserved. Copyright © 1997-2005 Macromedia, Inc. All rights reserved. This manual may not be copied, photocopied, reproduced, translated, or converted to any electronic or machine-readable form in whole or in part without written approval from Macromedia, Inc. Notwithstanding the foregoing, the owner or authorized user of a valid copy of the software with which this manual was provided may print out one copy of this manual from an electronic version of this manual for the sole purpose of such owner or authorized user learning to use such software, provided that no part of this manual may be printed out, reproduced, distributed, resold, or transmitted for any other purposes, including, without limitation, commercial purposes, such as selling copies of this documentation or providing paid-for support services. Part Number ZDW80M100 Acknowledgments Management: Charles Nadeau Writing: Jon Michael Varese Editing: Rosana Francescato, Lisa Stanziano, Evelyn Eldridge, Mark Nigara Production and Editing Management: Patrice O'Neill and Rosana Francescato Media Design and Production: Adam Barnett, Aaron Begley, Paul Benkman, John Francis, Geeta Karmarkar, Paul Rangel, Arena Reed, Mario Reynoso Localization Management: Melissa Baerwald Special thanks to Sheila McGinn, Jennifer Rowe, Jay Armstrong, Sally Sadosky, Jennifer Taylor, Paul Gubbay, Melissa Baerwald, Masayo Noda, Kristin Conradi, Yuko Yagi, and the entire Dreamweaver engineering and QA teams. First Edition: September 2005 Macromedia, Inc. 601 Townsend St. San Francisco, CA 94103 Contents PART 1: INTRODUCTION TO DREAMWEAVER Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .11 What you can do with Dreamweaver 8 . . . . . . . . . . . . . . . . . . . . . . . . . . . .11 What's new in Dreamweaver 8 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12 Installing Dreamweaver 8 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13 Registering Dreamweaver 8 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13 Typographical conventions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14 Chapter 1: Learning Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . 15 Where to start . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15 Getting the most from the Dreamweaver documentation . . . . . . . . . . . 19 Using the Dreamweaver help system. . . . . . . . . . . . . . . . . . . . . . . . . . . . 24 Chapter 2: Dreamweaver Basics . . . . . . . . . . . . . . . . . . . . . . . . . .27 Getting to know the Dreamweaver 8 workspace . . . . . . . . . . . . . . . . . .27 Customizing the Dreamweaver 8 workspace . . . . . . . . . . . . . . . . . . . . 39 Accomplishing basic tasks in Dreamweaver 8 . . . . . . . . . . . . . . . . . . . 42 PART 2: TUTORIALS Chapter 3: Tutorial: Setting Up Your Site and Project Files . . . 49 Learn about Dreamweaver sites . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49 Set up your project files. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50 Define a local folder . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52 Chapter 4: Tutorial: Creating a Table-based Page Layout . . . . 55 Examine the design comp . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55 Create and save a new page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .57 Insert tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58 Set table properties . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62 Insert an image placeholder . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .67 Add color to the page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69 3 Chapter 5: Tutorial: Adding Content to Pages . . . . . . . . . . . . . . . 73 Locate your files. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73 Review your task . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 75 Insert images . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 76 Insert and play a Flash file . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83 Insert Flash Video . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 86 Insert text. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 89 Create links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94 Preview your page in a browser . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 96 Chapter 6: Tutorial: Formatting Your Page with CSS . . . . . . . . .99 Locate your files. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 100 Review your task . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .101 Learn about CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102 Create a new style sheet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 104 Attach a style sheet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 106 Explore the CSS Styles panel. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 109 Create a new CSS rule . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 111 Apply a class style to text. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .113 Format the navigation bar text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .114 (Optional) Center the contents of the page . . . . . . . . . . . . . . . . . . . . . . 125 Chapter 7: Tutorial: Publishing Your Site. . . . . . . . . . . . . . . . . . . 129 Learn about remote sites . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 129 Define a remote folder . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 130 Upload your local files. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 133 Troubleshoot the remote folder setup (optional) . . . . . . . . . . . . . . . . . 134 PART 3: ADVANCED TUTORIALS Chapter 8: Tutorial: Working with Code. . . . . . . . . . . . . . . . . . . . 139 Look at the code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 140 Switch to the coding workspace (Windows only) . . . . . . . . . . . . . . . . 142 Add a tag with the Tag Chooser . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 142 Edit a tag . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 145 Look up information about a tag . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 147 Add an image with code hints . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 148 Check your changes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .151 Print your code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 152 4 Contents Chapter 9: Tutorial: Creating a CSS-based Page Layout . . . . . 153 Learn about CSS-based page layout . . . . . . . . . . . . . . . . . . . . . . . . . . .153 Examine the design comp . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .154 Create and save a new page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .156 Insert layers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 157 Add color to the page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 171 Chapter 10: Tutorial: Displaying XML Data . . . . . . . . . . . . . . . . . 173 Locate your files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 174 Review your task. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 175 Learn about using XML and XSL with web pages . . . . . . . . . . . . . . . . 176 Learn about XSLT pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 178 Convert an HTML page to an XSLT page . . . . . . . . . . . . . . . . . . . . . . . 179 Attach an XML data source to the XSLT page . . . . . . . . . . . . . . . . . . .180 Alter the XSLT page layout . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 181 Bind XML data to the XSLT page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .183 Apply styles to the XML data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .185 Create a dynamic link . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .186 Add a Repeat Region XSLT object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 188 Attach the XSLT page to the XML page . . . . . . . . . . . . . . . . . . . . . . . . . 191 Learn about other deployment options . . . . . . . . . . . . . . . . . . . . . . . . . .194 Chapter 11: Tutorial: Developing a Web Application . . . . . . . . . . 197 Before you begin . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .198 Review your task. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .198 Open a document to work in . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 200 Define a recordset . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .201 Display the database records . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 204 Add dynamic fields to the table . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 206 Set a repeated region . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 207 View your page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208 Create a record insert form. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208 Copy files to the server . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .214 Further reading . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .214 Contents 5 PART 4: APPENDICES Appendix A: Understanding Web Applications . . . . . . . . . . . . . . 217 About web applications . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 217 How a web application works . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 219 Authoring dynamic pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .224 Choosing a server technology . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .226 Web application terminology . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 227 Appendix B: Installing a Web Server . . . . . . . . . . . . . . . . . . . . . . 231 Getting started . . . . . . . . . . . . . ...