Uploading to the Remote Server

If any one aspect of Dreamweaver MX 2004 seems to cause the most problems, it is getting the files from your computer to the remote server (the server that hands up the files the world will see).

Part of the problem is the way Dreamweaver actually thinks about remote sites. When you upload your sitecalled " putting " in DreamweaverDreamweaver will mirror the site on the local machine to that of the remote site. This approach has a few advantages:

1. Updating and maintaining the site are much easier.

2. It assists in the prevention of broken, orphaned, or otherwise incorrect links on the site.

3. The file/folder structure between the local and remote sites is such that a change locally can be instantly reflected remotely.

4. Backing up a site becomes routine and automatic.

Using FTP in Dreamweaver MX 2004

The first thing you need to do is tell Dreamweaver MX 2004 you will be using FTP to upload the files to a remote site. Though you can use one of the commercial products mentioned earlier, Dreamweaver can also function as an FTP client.

To use Dreamweaver MX 2004 to FTP your files to a remote server, follow these steps:

1. Open the Manage Sites dialog box, select the site to be uploaded, and click the Edit button to open the Site Definitions.

2. Select the Advanced tab and select the remote Info category to open the Remote Info dialog box, which will ask you a few questions:

   • Access: Select FTP from the pop-down menu. When you select FTP, the dialog box will change to that shown in Figure 20.1.

     Figure 20.1. To post files from Dreamweaver MX 2004 to a remote server, you have to set the Remote Info in the Advanced area of the Site Definitions.

     

   • Host Directory: Enter the directory on the server where the files are uploaded. A lot of servers have the site root set to www.htdocs or public_html/. If you are unsure of the directory, contact your ISP or refer to the documentation provided by your ISP.

   • Login: This is the username assigned to your account.

   • Password: This is the password used to gain entry to the FTP server.

   • Use Passive FTP: Certain firewalls require this feature, and selecting this option enables Dreamweaver MX 2004 to set up the FTP session, rather than having the FTP server do it. Your network administrator can give you all the necessary details.

   • Use Firewall: If firewall preferences have been set in the Dreamweaver MX 2004 preferences, the values will be used. Clicking the Firewall settings button will simply open the Dreamweaver preferences, and you will have to input the Firewall host. If you are unsure of the host, contact the network administrator.

   • Use Secure FTP (SFTP): Select this if this protocol is available.

   • Check In/Out: Select this if you are using Macromedia Contribute for file management or if Check In/Check Out is needed for subsequent work. The last option is dangerous for obvious reasons and should be carefully considered .

Working with a Remote Site in Dreamweaver MX 2004

With the remote site defined, you can now move files to and from the remote server in Dreamweaver MX 2004. This involves connecting to and disconnecting from the remote server. All this can be done using the expanded version of the Files panel in Dreamweaver MX. To view the site's remote information, follow these steps:

1. If it isn't open, open the Files panel.

2. Click the Expand/Collapse button, the icon that looks like a split pane at the top of the panel.

3. The panel will expand to fill the screen, as shown in Figure 20.2. On the left side of the pane that opens are the files sitting on the remote server, and the right side of the pane shows the files on the local server. If this arrangement bothers you because you are used to the reversed order used by certain FTP applications, simply click the Expand/Collapse button and select Edit, Preferences (PC) or Dreamweaver, Preferences (Mac). When the preferences open, select the Site category and select Always show: Local Files on the "Left." Close the preferences, and the panels will swap sides.

   Figure 20.2. The Site panel from previous versions of Dreamweaver MX 2004 is now found in the Files panel.

   

4. To connect to the remote server, click the Connect/Disconnect button beside the site's name . If the remote server is local, or if you haven't specified a remote server in the site definition, this button will be grayed out. When you connect, the Connect "light" in the button will turn green. Click it again and you are disconnected.

5. To send files to a remote server, you must first click the Connect button, and when you get a connection, you simply select the files on the local side of the screen and click the Put button (the blue Up arrow). To move files in the opposite direction, you click the Get button (the green Down arrow).

   There are other ways of doing "Getting" (download) and "Putting" (upload) of selected files:

   • Select Site, Put or Site, Get.

   • Press Control-Shift-D (PC) or Command-Shift-D (Mac) to "Get" a file.

   • Press Control-Shift-U (PC) or Command-Shift-U (Mac) to "Put" a file.

   • Right-click (PC) or Control-click(Mac) the file to be moved and select "Get" or "Put" from the Context menu.

   • Drag the files from one area and drop them in the other. This works but is not recommended because you could, inadvertently, upload a cloaked file.

   Tip

   You don't always have to click the Connect button before you move files around. Click the Get or Put button, and Dreamweaver will automatically connect to the remote site.

6. Regardless of the method chosenGet or Putthe Dependent Files dialog box will appear. You will be asked if all files linked to the document should also be included in the transfer.

Synchronizing Files

Though we presented some rather extensive naming conventions earlier in the book, we realize you are human. Eventually, you are going to forget which file on your hard drive is the most recent version that should be uploaded to the remote server.

Synchronizing files is done by selecting Site, Synchronize (PC) or selecting Synchronize from the Files panel's Option pop-down menu. What makes this command so neat is that you control how much of the site is synchronized at once. You can synchronize a file, a folder, or the entire site. It's your call. You can even remove files on the remote site that don't have local counterparts, and vice-versa.

To automatically synchronize the files in your site, follow these steps:

1. Select the files you want to synchronize.

2. Select Site, Synchronize (PC) or Synchronize in the panel options (Mac).

3. When the Synchronize Files dialog box opens, as shown in Figure 20.3, select whether to synchronize the entire site or selected files.

   Figure 20.3. The Synchronize Files dialog box.

   

4. The direction pop-down menu has three options:

   • Put newer files to remote: This means only the newest versions of the files are sent to the remote site.

   • Get newer files from remote: This means that if the files on the server are "newer" than those on the local site, they will be downloaded.

   • Get and Put newer files: Put the latest versions of each file on either the local machine or the remote server. Files move in both directions, unlike the previous two choices.

5. If you select Get and Put newer files, skip to the next step. The other two enable you to select one additional option at the bottom of the dialog box. If the files are being sent to the remote site, you can choose to have them replace the older files by selecting the Replace option at the bottom of the dialog box. If they are moving from the server to the local site, you can delete any files that aren't on the remote site.

6. Having made your choices, press Preview. This will open a window showing you the files to be synchronized.

7. Decide whether the file will be synchronized or not by either checking the box in the Actions column or deselecting the check. By default, all boxes in the Actions column are checked. Click OK.

Tip

Be extremely careful when deciding to delete files. There is a real risk of losing the source files. This is why it is a good practice to always keep the original files out of the local site folder.

Using Dreamweaver MX 2004 to Manage Contribute Sites

Here's a typical scenario. Your client professes that his people are what make his business so great. In fact, each week he wants to feature the "Employee of the Week," with a photo and bio on the site. It is hardly worth your while to do this rather mundane task weekly, but you can either do it out of loyalty to the account or give the client the "keys to the site" and let him do it. Contribute was designed to solve this dilemma and free you for the more important revenue-generating maintenance activities.

Combining a web browser with a basic web page editor, Contribute enables your team members or clients to browse to a page and to edit or update it according to some stringent rules that you set. This section isn't designed to fully explore Contribute. Instead, we will assume that the site is Contribute-compatible and that you will be using Dreamweaver MX 2004 to manage the Contribute site.

As the administrator of a Contribute site, you can use Dreamweaver MX 2004 to do any of the following:

• Change the sitewide settings. This would include such things as the administrator password or email.

• Change the permissions for the individuals with access to the Contribute site.

• Create Contribute users and send them connection keys.

To administer a Contribute web site in Dreamweaver MX 2004, follow these steps:

1. Select Site, Administer Site in Contribute from the Files panel's Options menu. This will open the Administrator Password dialog box. Enter the password and click OK.

   Note

   If there isn't an administrator, you will be asked if you want the job. Click Yes, enter a password, confirm the password, and click OK.

2. The Administer Web Site dialog box that opens, as seen in Figure 20.4, is divided into three areas:

   • Sitewide Settings: These are the settings such as email, password, and number of revisions saved that will affect the entire site.

   • Permission Groups: You change the permission granted to groups of users.

   • Set Up Users: This is where the connection keys are created.

   Figure 20.4. The Contribute administrator page in Dreamweaver MX 2004.

   

3. Click the Sitewide Settings button to open the Sitewide Settings dialog box shown in Figure 20.5. This dialog box is not as complex as it appears at first glance. The Administrator information contains your email address, and clicking the Change Password button opens a dialog box that enables you to set up a new administrator password. Enable rollbacks simply enables you to determine how many revisions of the changed pages are located on the server. The default value is 3. The Advanced Options provide a little extra information, such as the default home page the server uses and the primary and alternate addresses for the site.

   Figure 20.5. The Sitewide Settings dialog box for the Contribute site.

   

4. Select Users in the Permissions groups area and click the Edit Group button. This will open the Permissions Group dialog box (see Figure 20.6), which in many respects resembles the Site Definitions dialog box. On the left side are the permission categories, and it is here that you set exactly what Contribute users can and cannot do in the Contribute site. The categories are:

   • General: You can describe the group and identify the home page of the site to which they have access.

   • Folder/File Access: You can indicate the folders to which the group has access and whether or not they can delete files.

   • Editing: This dialog box sets how text is edited on the page. The choices range from the amount of text editing that can be done to the types of line breaks permitted.

   • Styles and Fonts: This area enables users' accesses to the HTML and CSS styles and whether they can apply them. You can also determine how the fonts are applied and the sizes used.

   • New Pages: This dialog box lets you decide if new pages or template-based pages can be added to the site.

   • New Images: This area controls the maximum file size of images that can be uploaded to the site. This way, you avoid a client trying to add a high-resolution photo that weighs in at 10 MB.

   Figure 20.6. The Permission Groups dialog box sets exactly what can or cannot be added to the site.

   

5. Click the Send Connection Key button. This opens the Export Wizard (see Figure 20.7), which in many ways resembles the Basic Site Definitions wizard. Your first choice is to send your settings or create a connection key. Select "No, I would like to customize the connection settings for other users," and click Next to create a custom key. The four screens you will see are:

   • Connection Information: Here, you identify how you connect to your remote site and the path to the site.

   • Connection Key Group: Select the group name of the users to receive the "key."

   • Export the Key: Determine whether the key will be emailed to the group or remain on a local computer. Also, this is where they receive a password granting them access to the Contribute site. This password should be different from the administrator password.

   • Summary: You are presented with a summary of the information provided. If everything is acceptable, click OK.

   Figure 20.7. The connection key to the Contribute site is created in the User Setup wizard.

   

Using a "Back-End" to Update Dynamic Pages

Many people tend to forget that when a database is online, it must be left alone. Rearranging the database or adding fields or columns to the database files poses a real risk of everything from data corruption to the loss of the entire database. In addition, MySQL database files are often kept away from the server's file access for security reasons.

The other aspect of page management to consider is the fact that you are dealing with templates. As you saw when we created the booking facility for the Oakbridge Community Center, the page itself doesn't contain the content shown in the browser. The page is merely a template, and its primary function is to pull the data from the database and place that data in its correct location on the page.

Because databases are essentially untouchable when a site goes live, and because the actual page used to display the data has a limited function, the back-end created in Chapter 8, "Building the Data," takes a significant role in keeping the site current. In fact, a good habit to get into is to always provide a back-end to clients when you build a dynamic site. It gives the clients immediate access to their data without interfering with the page structure.

Use of the back-end that we devised earlier will enable you to add, update, or delete data without worrying about the integrity of the database. The reason is simpleit already has access to the fields in the database and is designed to provide the database with the pointers to the needed data. Even more important than that, any changes to the page can be done in real time.

In the case of the Oakbridge site, if they were to add a golf driving range to the facilities, the images, descriptions, pricing, availability, and any other data can appear on the site from the moment the ribbon opening the facility is cut. There is no requirement for extra pages, design work, and so on. The data is simply added to the site through the back-end. It is a process that takes less than 15 minutes to accomplish. From your perspective as a developer, this is a "no brainer." From the client's perspective, though, it is a huge competitive advantage with significant public relations and revenue implications.

The back-end doesn't have to be pretty. It just needs to be functional and thorough. This is an important point. The addfacility page shown in Figure 20.8 is not going to win any design awards. Yet for the client, this is one of the most important pages developed for the project.

Figure 20.8. The pages for the administrative back-end don't have to be pretty. They have to be functional and usable.

When designing the various back-end pages, keep the needs and sophistication of the end user in mind. The user shouldn't need a manual explaining how to use the back-end. The user needs to be able to look at the screen and instantly know what to do. This could involve a short one-on-one training session, or in the case of a complex site, an all day hands-on training seminar.

Building the back-end isn't as time-consuming as it may seem. A rather complex back-end can quickly be put together using the Dreamweaver MX 2004 server behaviors for quick functionality.

The server behaviors are what make the site "dynamic." They can do anything from displaying data to authenticating users. They are also designed for all levels of experience from the "newbie" to the hard- core coder .

The server behaviors are actually quite different from the JavaScript behaviors used for buttons and so on in Dreamweaver. The primary difference between the two is that a server behavior, which can consist of a single line of code, is designed to be executed by the application server. The JavaScript behaviors, on the other hand, are executed by the browser.

The other fundamental difference between the JavaScript and server behaviors is that the server code can actually live outside of the HTML page. You saw this when you were building the tour in Chapter 10, "Assembling the Tour." The recordset had a section of code that sat above the <HTML> tag and another section of code sat below the </HTML> tag. This is because code placement is very important to the server.

The server behaviors are accessed through the Server Behaviors tab of the Application panel (see Figure 20.9). When you open the server behaviors, you see a listing of all the behaviors included in the current page, and they are listed in the order in which they are applied. Selecting one of the behaviors in the list will actually highlight the page element.

Figure 20.9. Server behaviors are applied to the page by making selections from the Server Behaviors panel.

Finally, although the simplest server behaviors can insert the necessary information without input from you, all of them have a dialog box for specifying the behavior's parameters. In addition, some server behaviors, such as Recordset, have their own Property Inspector.

Some of the server behaviors shown in the Server Behaviors panel are:

• Recordset Query: Defines the data to be used in a page.

• Repeat Region: Replicates the selected area on the page as many times as needed.

• Recordset Paging: This pop-down menu essentially moves the pointer to the indicated record in a specific recordset. There are five behaviors associated with this command.

• Show Region: Select this to show a specific area of the screen if a predefined condition is true. Depending on your server model, the items in the pop-down menu will change.

• Dynamic Text: Selecting this has the same effect as dragging a field from a recordset in the Bindings panel onto the page. All it does is place the contents of a database field on your page as text.

• Insert Record: This one adds a new record to the table in the database.

• Update Record: Use this one to modify or update the records in a database

• Delete Record: Use this one to remove a record from a database.

• Dynamic Form Elements: The pop-down menu associated with this command refers to form elements linked to a data source. These are typically used to update records.

• User Authentication: The four choices in the pop-down menu are used to restrict access to the site to a list of authorized users.