Press the Add new Server button. This opens up the Basic tab where you will need to add the required information to access your server. 4 Enter your specific FTP information in the text fields, as shown in the example figure. The Server Name should be a common sense label that will help you identify which site you are modifying. The FTP Address, Username and Password are the mandatory pieces of information. 549 Sample remote connection information. Your information should include an FTP address, login, and password, with a possible folder name. 5 Click the Test Connection button at the bottom of the panel to verify that Dreamweaver can connect to your server. If the information you’ve provided is valid and you have a live Internet connection, a dialog box appears, confirming that Dreamweaver has successfully connected to your web server. 550 A dialog box lets you know if your connection was successful. If you receive an FTP error, double-check your FTP information, and make any necessary corrections. Certain servers may require a passive FTP connection to connect successfully. If you are certain your FTP information is correct, but experience a long delay or failure when connecting, check the Use Passive FTP checkbox in the Advanced tab, Remote Info category, and try again. 6 Press the Save button and you will see your site listed in the Server window. 551 Your site is now listed in the Server window. 7 Press the Save button in the Site Setup window. This may trigger an activity window that updates your site settings. Press Done in the Manage Sites dialog box, as you’re now finished editing the site definition. Viewing files on a remote web server Once you’ve established a connection to your web server, you can expand the Files panel for a split view that displays both your remote and local files. You can easily drag and drop between both sides to upload or download files and update existing files. 1 If necessary, choose Window > Files to open the Files panel. Click the Expand button ( ) at the top of the Files panel to ungroup and expand it to full view. 2 Locate and click the Connect button ( ) above the left-hand column at the top of the panel. Dreamweaver attempts to connect to your remote server, and, if successful, displays all its files on the left side of the Files panel. It’s important to note that web servers can be configured in many different ways, and you may need to edit your site settings again once you have made a successful connection (in particular, the folder information). A discussion of the different ways that web servers might be configured is outside the scope of this book; if you have specific questions regarding your site, you should contact an IT professional or your web-hosting company. 552 Click the Connect button to view files on your remote server in the left column of the Files panel. Transferring files to and from a remote server with Get and Put The built-in FTP and file transfer functionality of the Files panel makes it a snap to place files on your remote server or download files onto your local machine. This can be accomplished using the Get and Put buttons, or by dragging and dropping files between the Remote and Local file listings in the Files panel. Please note again, this exercise involves publishing your sample documents to a remote server, and therefore publishing them to the Internet; be very careful not to overwrite any pre-existing files that may be crucial to your web site. 1 Make sure you’ve connected to the remote server as described in the previous exercise, and that you can see your remote files in the left-hand column of the Files panel. 2 Select the index.html file from the local file listing on the right side of your Files panel, and press the Put button ( ) at 553 the top of the panel. Choose No when asked if you would like to include dependent files. Select a file and click the Put button to upload it to the remote server. When you transfer a document between a local and remote folder, a window may open, offering you the option of transferring the document’s dependent files. Dependent files are images, external style sheets, and other files referenced in your document that a browser loads when it loads the document. This feature can be very useful: think of it as a way to make sure that any files which are linked to a particular document come along for the ride, however, for the purposes of this 554 exercise, it will be unnecessary to transfer dependent files. Alternatively, you can click and drag a file from the right (local) column to the left (remote) column. Drag a file from the right column to the left to upload it to the remote server. To get (download) a file from the remote server: 1 Make sure you’ve connected to the remote server as described in the previous exercise, and that you can see your remote files in the left-hand column of the Files panel. 2 Select the index.html file from the remote file listing on the left side of your Files panel, and press the Get button ( ) at the top of the panel. Note that in your case this does not make a lot of sense since you just uploaded your index.html document. 555 Using Check In/Check Out and Design Notes If you’re collaborating with others on a project, you’ll want to set up an environment where everyone can edit files independently without overlapping or overwriting someone else’s work. For these situations, the Check In/Out and Design Notes features can help you to manage workflow and communicate with others on a Dreamweaver site project. Check In and Check Out Dreamweaver’s Check In/Check Out feature is a way of letting others know that you are working on a file and don’t want it disturbed. When Check In/Check Out is enabled, a document that you’re editing becomes locked on the remote server to prevent others from modifying the same file at the same time. If you attempt to open a file that’s been checked out by another user, you see a warning that lets you know that the file is in use and who is currently working with it. Check In/Check Out doesn’t require any additional software to run, and other Dreamweaver users can check out files if they also have Check In/Check Out enabled in their site definition. The Check In/Check Out system does not work with a testing server. To transfer files to and from a testing server (if one is set up), use the standard Get and Put commands. 556 1 Choose Site > Manage Sites. Select the Dreamweaver site that you want to enable Check In/Check Out for and choose Edit. 2 In the Site Setup window, click on the Servers button, then select your site and click on the pencil icon at the bottom to edit the server settings. 3 Click on the Advanced button and then click on the Enable file check-out checkbox. Type your name and email. This information will appear to other users who attempt to retrieve a file that you have checked out (as long as they are using Dreamweaver). Press Save and then press Save again to exit. 557 Enable check in/check out in the Site Definition panel to manage workflow between several users. How does Check In/Check Out work? Dreamweaver creates a lock (LCK) file for every document that is checked out; this basic text file contains the name and e-mail address of the user who has checked out the file. LCK files are written to both the remote server and local folder using the same name as the active file. When files are checked back in, the LCK files are deleted from both the remote server and local folder. Although LCK files are not visible in the Files panel, they work behind the scenes to let Dreamweaver know what’s checked out and what isn’t. Checked-out files appear on both the local and remote file listings with a check mark next to them. Note that a colleague not using Dreamweaver can potentially overwrite a file that’s checked out—however, LCK files are visible in applications other than Dreamweaver, and their appearance alone can help avoid any overwriting issues. A user will be allowed to override your lock and switch checkout status to themselves. Make sure you establish rules with others about how to share and manage locked files. 558 [...]... is used to set the document status; this can be useful in letting other collaborators know the revision stage of the current document 56 1 4 Press OK to create the Design Note To view a Design Note, choose File > Design Notes when a file is open in the document window As mentioned earlier, you can also choose to have Design Notes automatically appear when the file is first opened Design Notes can also... and choose Design Notes from the left 3 Under the Design Notes panel, check Enable Upload Design Notes for sharing Design Notes are now copied and updated on the remote server so that other users can share them 56 2 4 Choose Save to update the site definition, then press Done to close the Manage Sites dialog box Displaying Design Notes in the Files panel A convenient way to view and access Design Notes... 55 9 Check files out before modifying them so that others won’t accidentally overwrite your work at the same time When you transfer a document between a local and remote folder, a window may open offering you the option of transferring the document’s dependent files Dependent files are images, external style sheets, and other files referenced in your document that a browser loads when it loads the document... will automatically check out and get the latest copy from the server 5 Collapse the Files panel to return it to the dock Using Design Notes Design Notes store additional information about a file or media object in your Dreamweaver site These notes can be 56 0 for your own use, or they can be shared with others using the same root folder Design Notes can be set to appear automatically when the file is opened,... enabling the Design Notes column in the Files panel An icon that can be used to open and edit Design Notes accompanies documents that have an associated Design Note This feature also allows you to see all available Design Notes at a glance 1 Choose Site > Manage Sites Select your site from the Sites panel and choose Edit In Advanced Setting options, choose File View Columns from the left 56 3 Use the... viewed directly from the Files panel; right-click (Windows) or Ctrl+click (Mac OS) a document in the files list and choose Design Notes from the contextual menu Sharing Design Notes By default, Design Notes are stored only in the local site folder, and are not automatically copied to the remote server However, you can share Design Notes with other collaborators by having Dreamweaver automatically upload... CSS issues found and displayed in the Results panel 1 To use the CSS Advisor, from the Files panel, locate and open the ex5_water.html document for editing 2 Choose File > Check Page > Browser Compatibility 57 5 Choose File > Check Page > Browser Compatibility to run the BCC for this document 3 The Results panel opens and displays any errors or issues in the Browser Compatibility Check tab Items returned... page Titling your documents with the tag Each document’s head area contains a tag, which Dreamweaver automatically inserts with any new HTML/ 57 8 XHTML document At its most basic, the tag sets a display title for a page that appears at the top of the browser window You can modify the tag contents using the Title text field that sits at the top of your document window By... pages in your local site and will identify orphaned files that are not linked to or used by any document within the site 1 From the Files panel, double-click and open the index.html document 56 4 2 Choose File > Check Page > Links Choose File > Check Page > Links to check for broken links in the current document 3 The Link Checker panel appears; you see one listing here A link to the exhibits.html page... making it easy to display up-to-date information to others working on the same site All Design Notes are stored as separate files in a _notes folder inside of your site’s root directory What can be put in Design Notes? Design Notes can contain any information that is important to the file or project; you can store design instructions, updates about the project, or contact information for project managers . this does not make a lot of sense since you just uploaded your index.html document. 55 5 Using Check In/Check Out and Design Notes If you’re collaborating with others on a project, you’ll want. server. 5 Collapse the Files panel to return it to the dock. Using Design Notes Design Notes store additional information about a file or media object in your Dreamweaver site. These notes can be 56 0 for. to set the document status; this can be useful in letting other collaborators know the revision stage of the current document. 56 1 4 Press OK to create the Design Note. To view a Design Note,