Keeping Local and Remote Sites Synchronized

[ LiB ]

During your life as a web designer/programmer, you are sure to spend a late night or two trying to get a project done on time. It is possible that as the sun is rising and you are working away furiously, you might lose track of whether you have uploaded the most recent version of a document to the remote site. How can you keep track of the most recent files and whether they have been placed on the remote site? Dreamweaver offers two ways to do this: manually and automatically. The next section covers the old-fashioned manual method. Then the discussion turns to the powerful Synchronize command, which enables you to do this automatically.

Select Newer Local/Remote Files

You can use the Select Newer Local command or the Select Newer Remote command to manually synchronize your sites. This function compares the modified date on the local machine for each file with the modified date on the remote server for each file.

Select Newer Local

To select the newer files on the local site, right-click in the Site panel and choose Select > Newer Local, or choose Site > Select Newer Local from the Site panel menu bar. After Dreamweaver has compared the modified dates on both the local and remote sites, it highlights all the files in the local window that are more current than those on the remote site. From here, you can simply click the Put button, and all the files that are more current on your local site are uploaded to the remote site.

Select Newer Remote

If you are working as part of a team on a single site, it is possible that the remote site has a more current version of a document than you have on your local site. In this case, before you make any changes on a document, you should check to see if there is a more recent version on the remote server. You can do this by right-clicking in the Site panel and choosing Select > Newer Remote, or choosing Site > Select Newer Remote from the Site panel menu bar. In this case, the files that have a more recent modification date on the remote side, as compared to your local site, are highlighted. Then all you need to do to get the most recent versions is click the Get button, and they are downloaded to your local site.

The first time you upload your files to the server, you might notice that your local modified dates are not accurate. With the initial upload, Dreamweaver changes the local timestamp so that it matches the server time. That way, in the future, it can compare timestamps and calculate what files have been changed and should be synchronized.

If Dreamweaver cannot determine the timestamp on the server, you'll get a warning that synchronization can't occur. You can still get and put files, but you will be unable to find the newer files, on either the local or remote sites.

Because Dreamweaver highlights only files that are newer, those that are exactly the same (that is, those that have the same modification date and time) are not selected. If your site is already synchronized, no files are selected after running both of these commands. You might think that nothing happened , but it's just that the sites are already up-to-date.

Be aware that because Dreamweaver checks all the files of a site, the Select Newer Remote command could take a long time. This is the case if you have a slow connection to the remote server. Sometimes this might be mistaken as Dreamweaver "freezing." Be patient, especially if you are connecting via a modem.

The Synchronize Command

To access the Synchronize command, choose Site > Synchronize. The Synchronize command provides a much better way to synchronize your files than the method of manually selecting newer files. Part of the beauty and power of this command is that you can choose to synchronize as much or as little as you want. This means that you can synchronize just one folder, just one file, or the entire site. You also can choose to remove any file on the remote site that is not located on the local site copy, or vice versa. This is not possible with the previous (manual) method.

To synchronize your site using the Synchronize command, follow these steps:

Unless you want to synchronize the entire site, select the files you want to synchronize.
Choose Site > Synchronize. The Synchronize Files dialog box displays (see Figure 18.6).

Figure 18.6. The Synchronize Files dialog box.
From the Synchronize pull-down menu, choose whether to update the entire site or just the selected files.
From the Direction pull-down menu, select what you want to do from these options:
- Put only those files that are newer locally to the remote site. (You will only send files.)
- Get only those files that are newer remotely to the local site. (You will only receive files.)
- Synchronize both the local site and the remote site with each other. (You will both send and receive files.)
If you select Get and Put Newer Files from the Direction menu, go straight to step 6. If you select one of the other two directions, you can specify one additional option. If you are putting newer files to the remote site, you can choose to delete remote files not on the local drive by checking the appropriate box. If you are getting newer files from the remote site, you have the option to delete any local files that aren't on the remote site. To select the delete option, check the box on the lower left. Remember that deleting a file is final and cannot be undone. Use this option with great care. The server often has files that need to be there, such as logs, scripts, and such, that don't have corresponding files in your local site. Similarly, you might have local files, such as PNGs, FLAs, and Template and Library folders, that haven't been uploaded to the server but that are still needed.
Press Preview. This processes your files for synchronization and opens the Synchronize window (see Figure 18.7). This gives you a preview of what will happen when you click OK, showing how many files are to be updated, the action that will be taken on that file (get, put, or delete), and the filename.

Figure 18.7. The Synchronize window showing one file needing to be uploaded.
By default, all check boxes are checked in the Action column of this dialog box. Deselecting a check box removes the file from being processed . This enables you to ensure that you know exactly what is happening and lets you change what Dreamweaver does, just in case you know something that it doesn't.
Click OK to close the dialog box.

When synchronizing with the Direction option Get Newer Files from Remote, you can delete files locally that aren't found on the remote server. When synchronizing the other way, with Get Newer Files from Local, you can delete files on the remote server that aren't found locally. Be extremely careful with both of these options, however. For convenience, it is common to keep source files, such as Photoshop (.psd) files or Fireworks (.png) files, in folders within your local site that shouldn't be uploaded or deleted. Similarly, you might have necessary files on the web server (the remote site) that don't have counterparts in your local sitescript files or website stats, for instance.

After you have completed the synchronization, you can see the actions that Dreamweaver performed. Dreamweaver shows the progress of the synchronization and, after it's done, enables you to save a text file of the procedure for future reference.

Cloaking

Because it is so common to keep assets in your local site folder that you never want to upload to your remote site, Dreamweaver enables you to cloak certain files and folders. Site cloaking enables you to exclude folders or file types in a site from certain site operations, such as a get or a put. Note that you can cloak file types, such as PNGs, but not individual files. The items that you choose to cloak are site-specific, meaning that each site on which you work can cloak different folders or file types. You can cloak folders or file types on either the local site or the remote site.

When a folder is cloaked, it is excluded from the following operations:

Put/Get
Check In/Check Out
Undo Checkout
Reports
Select Newer Local/Select Newer Remote
Check Links Sitewide/Change Links Sitewide
Synchronize
Find/Replace Sitewide
Asset Panel Contents
Template Updating/Library Updating

Disabling and Enabling Cloaking

The capability to use the cloaking feature is enabled by default. To turn it off, open the Site Definition dialog box (choose Site > Manage Sites, use the Site drop-down menu in the Site panel), right-click in the Site panel and choose Cloaking > Settings, or choose Site > Cloaking > Settings from the Site panel menu bar. Go to the Cloaking category (see Figure 18.8), and select or deselect the Enable Cloaking option. If you disable cloaking, all cloaked files will be uncloaked. But Dreamweaver won't forget that they were once cloaked. If you later choose to use cloaking again, previously cloaked files become cloaked.

Figure 18.8. Enabling cloaking in the Preferences dialog box.

Cloaking Files and Folders

To cloak or uncloak a folder, right-click it in the Site panel and choose Cloaking > Cloak, or select the folder and choose Site > Cloaking > Cloak from the Site panel menu bar. A cloaked folder appears with a diagonal red line through it (see Figure 18.9).

Figure 18.9. A cloaked folder in the Site panel.

Cloaking individual files is a little different. Instead of cloaking a specific file, you cloak a certain type of file, defined by its filename extension. To do this, open the Site Definition dialog box (choose Site > Manage Sites, or use the Site drop-down menu in the Site panel) and go to the Cloaking category. Enable cloaking based on file type by clicking the Cloak Files Ending With check box. By default, Dreamweaver offers to cloak PNG and FLA files, the authoring files for Fireworks and Flash.

Specify the types of files to cloak by typing the three-letter extension belonging to the file type you want to cloak. Separate the entries with a space. If you don't want to cloak PNG or FLA files, just delete those entries.

From now on, all files belonging to the type you designated show up in the Site panel with a red line through them.

Uncloaking

To uncloak all cloaked filesregardless of whether they were cloaked by file type or by locationright-click in the Site panel and choose Cloaking > Uncloak All, or choose Site > Cloaking > Uncloak All from the Site panel menu bar. Dreamweaver makes sure you really want to perform this task by bringing up a dialog box that asks "Are You Sure You Want to Do This?" Click Yes. Now all files and folders are uncloaked, regardless of the technique used to cloak them.

Exercise 18.2. Working with the e*Books Local and Remote Sites

In this exercise, you will get some practice uploading, downloading, and synchronizing between the local and remote e*Books sites. Before going through this exercise, make sure you've defined the local and remote sites, as outlined in Exercise 18.1.

Make sure e*Books is the active site. Expand your Site panel so you can view both local and remote file lists at the same time.
To start, the remote folder for e*Books is empty. That's the way you normally start out when you create a new website. There's nothing on the server.

To upload the entire site, select the folder at the top of your local Site Files list. This selects the entire site.
At the top of the Site panel, click Put. Dreamweaver will probably ask if you want to upload dependent files. Choose No. (Because you have all of your dependent files selected, it doesn't really matter what you choose in this dialog box.) Figure 18.10 shows the results of this.

Figure 18.10. The local and remote e*Books sites showing mirror structures.
But wait! The site files include several PNG files that don't need to be uploaded to the server because they're Fireworks source files that are not actually used in the web pages. That's not good.

First, select the PNG files in the list of remote files and delete them. Then open the Site Definition dialog box for e*Books (click twice on the name e*Books in the Site panel's site-selection drop-down menu). Go to the Cloaking category and choose to enable cloaking and cloak files ending with the .png filename extension. When you're done, click OK to close the dialog box.
Now you're going to test the Dreamweaver synchronization features by altering a few of the local files and seeing if Dreamweaver notices.

From your local Site Files list, double-click about.htm to open it.
Add a subheading for Programming Department, with a paragraph of text beneath it. When you're finished, save and close the file.

Now open available titles and add a few book titles to the listyour favorites, whatever you like. Save and close the file.
Right-click in the Site panel and choose Select > Newer Local from the contextual menu. Dreamweaver thinks for a split second and then highlights about.htm and titles.htm in the local Site Files list. Remember, the goal is to make the remote site a mirror of the local site. That's what synchronizing is all about.
Those are your two updated files. Now that they're selected, click the Put button to put them. (There's no need to upload dependent files.)
That was handy! Now, though, you'll try something a bit fancier. In the local Site Files list, right-click the local root folder and, from the contextual menu, choose New Folder. When the new folder appears, name it pages .

Still in the local Site Files list, move authors.htm, about.htm, order.htm and titles.htm into the pages folder. (You're tidying up your site organization.) When Dreamweaver asks if you want to update your links, click Update.
Now try synchronizing again. Right-click in the Site panel and choose Select > Newer Local from the contextual menu. When Dreamweaver makes its selection, click the Put button to upload all selected files.

How do your remote and local sites look (see Figure 18.11)? Are they still mirroring each other? No! Dreamweaver added a new pages folder and filled it with pagesbut it didn't remove the old HTML files. Why not? Because it doesn't realize that you haven't created any new filesyou've just rearranged existing files.

Figure 18.11. The e*Books site after manual synchronizationnot quite perfectly aligned anymore.

This is a good example of what happens quite frequently when dealing with local and remote sites. Slowly, over the course of editing and rearranging your files, old files start collecting on the web server; they're not doing any harm, but they're taking up vital storage space. Manual synchronization doesn't get rid of them.
Time to synchronize the automatic way! Choose Site > Synchronize. When the dialog box appears, choose to synchronize the entire local site, putting newer local files to remote. Enable the Delete Remote Files Not on Local Drive option.
When you've set your options, click the Preview button. Dreamweaver now compares the modified dates of the local site and remote site, and lists the items that are newer on the local site in the Synchronize window (see Figure 18.7). Notice that from this list you can choose whether you want to upload, or put, each item individually. This is an important safeguard, giving you every chance not to delete needed files from the server. For this exercise, don't deselect any files.

Also notice that the PNG files are not in the list of files to be uploaded. That's because they're cloaked.
Click Update. Now the list shows you that the extra files have been deleted and that the synchronization is complete (see Figure 18.12).

Figure 18.12. The Synchronize window showing the extra files that must be deleted.
Click OK. Your synchronization is done!