Tutorials

Create and configure a Dreamweaver site

by Lucinda Dykes

You’ve decided to set up shop on the Web and have a site design in mind. But where do you start? After you have chosen a web server and an application server, the next step is to set up a Dreamweaver® 8 site. You don’t have to set up a site to create and edit web pages, particularly if you want to create and edit static pages, in which the content doesn’t change very often. But if you want to create and test web applications, which contain dynamic content, you’ll need a Dreamweaver site.

Having a Dreamweaver site provides another important advantage: You’ll be able to access Dreamweaver’s site-management features, which can save you time on tasks such as maintaining links, managing and synchronizing files, keeping track of extra information about the files, and creating site reports.

In this tutorial, you’ll learn how to create and configure a Dreamweaver site for dynamic content, a process that includes specifying a root folder for your web application, defining a remote folder, designating a testing server, and setting a URL prefix. You’ll also learn about individual site-management features and how to enable them.

Set up a Dreamweaver 8 site

Nearly all the steps you take to set up your Dreamweaver site involve working with the Site Definition dialog. When the dialog box first appears onscreen, the Advanced tab is selected by default (Figure 1). The Advanced tab gives you direct access to your site-definition settings and includes a few additional options for defining dynamic sites.

If you are defining a dynamic site, you will need to configure your site on the Local Info, Remote Info, and Testing Server panes on the Advanced tab of the Site Definition dialog. You also need to specify a root folder on the computer running the web server and specify a URL prefix. If you are defining a static site, you can do that either via the Site Definition wizard or by entering your site information on the Local Info pane on the Advanced tab. And if you want to upload and download your static-site files to a web server using Dreamweaver, you will also need to add remote-access information via the Site Definition wizard or the Remote Info pane on the Advanced tab.

The following sections of this tutorial walk you through the process of configuring the Local Info, Remote Info, and Testing Server panes. As you configure them, you’ll have the option of enabling certain site-management features. You can also enable these and other site-management features after you’ve set up your site.

As an experienced Dreamweaver user, you undoubtedly know that before you create a Dreamweaver site, you must first gather all the site files into a folder. You can choose to have other folders within this main site folder, such as a folder for image files, a folder for CSS files, and so forth.

Tip: The Basic tab in the Site Definition dialog is used to access Dreamweaver’s Site Definition wizard, which guides users step-by-step through the site-setup process. The Site Definition wizard is very useful for novice Dreamweaver users who are setting up static Dreamweaver sites and those who are setting up dynamic sites in which the testing server and the production server are the same. For more details on basic site setup using the Site Definition wizard, see the Dreamweaver 8 Visual QuickStart Guide, by Dori Smith (Peachpit Press), and Dreamweaver Help, which you can access by choosing Help > Dreamweaver Help, or pressing F1.

Figure 1: The Advanced tab of the Site Definition dialog box

Configure a connection without a Dreamweaver site

You can create and edit web pages in Dreamweaver and upload the pages to a web server without defining a Dreamweaver site. You won’t have access to any of Dreamweaver’s site-management features, and you won’t be able to test dynamic web pages in Dreamweaver, but you can create a connection to an FTP or a Remote Development Services (RDS) server to upload and download files. There are two ways to do this.

To configure a connection in the Site Definition dialog:

1. From the menu bar, choose Site > New Site (Figure 2).

Figure 2: Select New site from the Site menu.

2. On the Basic tab of the Site Definition dialog that appears, click the “Create an FTP or RDS server connection” link (Figure 3).

Figure 3: Click the link to create an FTP or RDS connection.

3. Enter the server information in the Configure Server dialog that appears (Figure 4).

Figure 4: Use the Configure Server dialog box to set up an FTP or RDS connection without defining a Dreamweaver site.

To configure a connection on the Manage Sites pane:

1. From the menu bar, choose Site > Manage Sites.
2. In the Manage Sites dialog that appears, click the New button, and then select FTP & RDS Server from the context menu (Figure 5).

Figure 5: Create an FTP or RDS connection in the Manage Sites dialog.

No server technology is required to preview static pages in a browser, so you can preview a static page without setting up a Dreamweaver site.

To preview static pages in a browser:

Choose File > Preview in Browser, and select a browser from the browser list. To preview dynamic pages, however, you need to enable dynamic site features by defining a root folder and by specifying local, remote, and testing server information for your site.

Designate a root folder

Once you have access to a web server, either locally or on a remote computer, you need to designate a root folder for your dynamic site on the computer that runs the web server and then store your site files in this folder. The root folder is created when the web server is installed, and as soon as you put a page in the root folder, you can “serve” it from the root folder. Having your site files in a root folder allows you to test your dynamic pages because it enables the web server to serve any file from this folder in response to an HTTP request from a browser. Most local web servers have a default root folder, as shown in the following table:

Default root folders
Web server	Default root folder
IIS	Inetpub/wwwroot
ColdFusion MX7	CFusionMX7/wwwroot
Apache (Windows)	/apache/htdocs
Apache (Mac)	Users: YourUserName: Sites

If you are using a web server on a remote computer, check with your ISP or web host for the location of the root folder.

To test your root folder:

• Create an HTML page and save it using the name testing.html.
• Place the page in your root folder.
• Open the test page by entering the URL in a browser.

If you’re using a local web server, you can use localhost instead of a domain name to access your page. For example, to access your test file (testing.html), you would use one of the following URLs, depending on your server type:

• IIS: http://localhost/testing.html
• ColdFusion MX 7: http://localhost:8500/testing.html
• Apache (Windows): http://localhost:80/testing.html
• Apache (Mac): http://localhost/~YourUserName/testing.html

Tips

• You can store your site files within the default root folder or create a separate folder within the root folder for your files. For example, if you create a folder named MySite within the wwwroot folder in IIS, the URL for your site is http://localhost/MySite/.
• If you’re using a local web server, you can use two separate root folders for your site: one root folder on the web server for testing dynamic pages, and a separate local root folder that contains all the site files, both static and dynamic.
• If you use a local web server, the URL and the file path are not the same. For example, if you’re using IIS on your computer, the URL for the test page is http:// localhost/testing.html, but the file path could be C:\Inetpub\wwwroot\testing.html. If you open the test page in a browser using the file path for the address or browse to the location of the file on your computer, you won’t be able to preview and test any dynamic features.
• The web server works with the application server to process dynamic content. The application server is usually on the same computer (local or remote) as the web server.

Define a local folder

In addition to creating a root folder on the web server, you must specify a local folder for your site. The local folder is the working folder for your Dreamweaver site and usually contains all the site files. Specifying the local information for your site also enables two Dreamweaver site-management features: link checking and site-cache building.

You define your site on the Local Info pane, which is found on the Advanced tab of the Site Definition dialog.

To define a local site:

1. From the Site menu, choose New Site. The Site Definition dialog appears. The Advanced tab and the Local Info pane are selected by default.
2. Enter a name for your site in the Site Name text box. Make sure you assign a name that will help you identify the site later.
3. Click the folder icon next to the Local Root Folder text box (Figure 6), and browse to the location of your root folder. Once you locate this folder, click the Select button (Windows) or Choose button (Mac OS) to choose it as the local root folder. If you use a local web server, you can use the root folder for the web server or choose a separate local folder that contains your site files.

Figure 6: Click the folder icon to browse to the location of the local root folder.

4. On the Local Info pane, click the folder icon next to the Default Images Folder field and browse to the location of your site images folder (if you have one). Once you locate this folder, click the Select button (Windows) or Choose button (Mac OS) to choose it. If you specify a default images folder, Dreamweaver will automatically open this folder whenever you insert an image on a page in this site.
5. On the Local Info pane, in the HTTP Address field, enter the URL for your domain to facilitate Dreamweaver’s link checking features (Figure 7). When you create a Dreamweaver site, Dreamweaver tracks every link on every page and ties this information into the site folders. If you move a file or rename a folder, Dreamweaver can automatically make the necessary changes in the links site wide, if you have entered the URL for your domain above.

Figure 7: Use the HTTP Address field to enter the URL of your site and enable Dreamweaver to verify site links.

6. When you’re finished making changes to the site setup, click OK on the Advanced tab to save your changes. Otherwise, select another category from the Category list on the left of the dialog.