Intro & Account Setup | Getting Started With Dreamweaver MX | Program Layout | Making a Page | Page Properties
Text and Text Properties | Cascading Style Sheets | Tables | Images | Links
Publishing | Templates | Collaborating | Outside Resources

When you make web pages or a website in Dreamweaver MX, it doesn't just automatically appear on the web. You need to publish—or upload—your files to the web. While that might sound difficult, fortunately Dreamweaver MX comes with a built-in publishing feature that allows you to put your files on to the web with little effort. However, there are a few steps you need to learn in order to complete the process of publishing. This part of the tutorial will discuss issues related to putting your web pages on the web.

Managing Your Workspace
One of the downfalls of Dreamweaver MX is its confusing and non-intuitive Site Files window. When you first load Dreamweaver MX, the “Files” panel, which you will need for uploading your web site files to the Internet, is grouped with the rest of the panels on the right side of the screen.

As you can see, this panel is only displaying the remote view. For our purposes, we will want to view both the Remote Site and the Local files. This part of the tutorial will explain how to make the “Files” panel more manageable.

First, use your mouse to click on the patch of small dots next to the word “Files” on the “Files” panel. While holding down your mouse button, drag the entire panel to the middle of the screen. This will detach the “Files” panel from the rest of the panels, and will allow the panel to exist as its own window.

Now, on the row of icons listed underneath the “Files” panel’s menu bar, you will see an icon on the far right called “Expand/Collapse.” Click on this button. This will allow the panel to become a window called “Site” and is organized by a split screen. On the left is where the files on the Remote Site will be listed. The right site contains a list of the files you are currently working on in your computer.

This is the most practical way to work with your files. We will now explain how to get those files online by defining a site and uploading your work.

Creating a New Site
When uploading your web page files for the first time in Dreamweaver MX, you will be asked to define what is called a "New Site." Defining you Site means telling the program where you will be publishing your files on the web as well as where your files are located locally on your computer. You will only be asked to make a New Site once, but if you ever want to make additional web sites, you'll need to go and define a whole new site using this feature. To get to New Site, click "Site" on the menu bar, and select "New Site."

The window that appears is the “Site Definition” window. The default view for this window is “Basic.”

There are two modes you can use to define or edit a site: Basic and Advanced. Basic takes you through all of the steps of setting up a site, one by one, while Advanced gives you more flexible This part of the tutorial will explain how to define a site in the “Basic” view. If you wish to define your site using the “Advanced” mode (this view will be familiar to those who have used Dreamweaver 4), then skip this section, and move on to “Defining a New Site in Advanced Mode.”

Defining a New Site in Basic Mode
In the “Site Definition” window, make sure you’re in the “Basic” mode. You’ll be able to tell you’re in the right place by noting the “Basic” tab at the top of the window.

On the first screen, enter a name for your site, such as “My Web Site” or something that describes the main idea for your site. Then, click on the “Next” button.

The next screen will ask if you want to use a server technology. This means that Dreamweaver MX wants to know if a database technology will be included in your site. Since you will most likely be making a simple site, click on “No” and then click on the “Next” button to continue to the next step.

Now, you’ll be asked how you want to edit your site files, and how you want to upload them to the web. Your safest bet is to select the first option, which allows you to edit your site files that you have saved in a folder in your computer, and upload them later whenever you are ready.

You’ll have to locate on your computer the folder where all of your site files are located. Next to “Where on your computer do you want to store your files?,” you’ll see a small folder icon. Click on this icon to browse your computer to find the desired folder.

Click on the “Next” button when you are done.

The next section is one of the most important. Here, you will define where you will be uploading your site files online, and how you will connect to it. Assume you are going to be uploading your site to your Eden space. Input the following information:

• Make sure that "How do you connect to your remote server" is set to FTP
• For “What is the hostname or FTP address of your Web server?,” enter in "ftp.eden.rutgers.edu". If you are uploading files to different web space, fill in the information as necessary
• For “What folder on the server do you want to store your files in?,” type in "public_html"
• For “What is your FTP Login:,” type in your Eden account user name. Don't put your actual name—put your username—without "@eden.rutgers.edu"
• Leave the Password text box blank. You will get to the password later

When all of the proper information is entered in this window, click on the “Next” button.

The next screen will ask if you want to enable check in / check out. Click NO for now. We will discuss what checking in and checking out means later on in the “Collaborating” section.

Select “No” and click on the “Next” button.

The last screen gives a summary of all of the specifications for the site you just defined. If everything looks correct, click “Done.”

There are some disadvantages to using the “Basic” site definition wizard. The “Basic” view actually makes some of the steps more confusing than they should be. In fact, you may not even need many of the steps the “Basic” set up takes you through, so you may fill in information that is not necessary for the site definition. In the “Advanced” view, all of the sections are clearly defined for you. It is recommended that you learn to define a site in “Advanced” mode, but you can still use the “Basic” set up if you wish. To learn how to use the “Advanced” site definition mode, please continue reading the next section.

Defining a New Site in Advanced Mode
In the “Site Definition” window, click on the “Advanced” tab. You will then see the following screen:

On the left side of the window, you will see an area called "Category." You should be in the "Local Info" category. “Local Info” is the step when you tell Dreamweaver MX where the site you are working on is located on your computer. Next to "Site Name," type in a name for your site, which can be anything you want it to be. Make your "Local Root Folder" the folder in which all of your web site files are saved on your computer. You can select the folder by clicking on the folder icon next to the "Local Root Folder" text box. Leave the rest of the information blank, and “Enable Cache” checked.

Now, click on the "Remote Info" in the Category column. In this area, you enter the information Dreamweaver MX needs to locate and log into the web server that stores your pages on the web. Fill in the information as follows, and see the image below to see how it should look (this is assuming you are uploading your site to your Eden account):

• Make sure that "Access" is set to FTP
• Next to "FTP Host," type in "ftp.eden.rutgers.edu". If you are uploading files to different web space, fill in the information as necessary
• Next to "Host Directory," type in "public_html"
• Next to "Login," type in your Eden account user name. Don't put your actual name—put your username—without "@eden.rutgers.edu"
• Leave the Password text box blank. You will get to the password later

Leave everything else as it looks in the image above. Notice how there is a check box called "Enable File Check In and Check Out." For our case, and generally, you will not need to touch this. However, if you'll be working on collaborative projects, this feature is essential, since it helps to prevent people from overriding each other’s work.

When you are done putting in all the information, click the “OK” button. After that, a window called “Edit Sites” will appear. You don’t need to do anything in this window, since you just created a new site, so click “Done.”

When you get past this screen, you will be taken to the main “Site” window (which you should have rearranged in the above steps at the beginning of this section). Click on the "Connect" icon to connect to your web space. The Connect icon can be found at the top of the Site window, next to the "Site" drop-down menu. "Connect" can also be found by clicking the "Site" menu (third option down).

Next, a window will appear asking you to type in your password. Enter in your Eden account password (if you are uploading files to your Eden space), but DO NOT click the “Save Password” checkbox. Click on “OK.”

You will know you have connected to your web space when they gray dot on the “Connect” icon turns green.

Uploading Your Files to the Web
Before you begin uploading your files to your web space, you must first learn the icons listed in the “Site” window that will help manage your files.

1. Site:
This drop down menu contains a list of all of the sites you have defined. The site you are currently working on is the one that is displayed.

2. Connect:
Click on this icon to connect to the server where you will be uploading your site files.

3. Refresh:
Click on this icon to get the most up-to-date listing of the files contained in your local or remote site.

4. FTP Log:
Keeps track of your current actions taking place within your FTP connection.

5. Get:
Click on the Get button to download (hence, the down arrow icon) selected files from the remote site to your computer.

6. Put:
Click on the Put button to upload (hence, the up arrow icon) selected files from your computer to your web space. This is how you put your site online.

7. Expand/Collapse:
Expanding the window gives you a split-screen view of your current site, containing both the Remote Site and the Local files. Collapsing the window reverts the window into a single-screen mode.

Now you can learn how to put your files online. To publish your website and its related files to your Eden account, select all of the files you want to upload on the right side of the screen, and click the "Put" icon. If you are asked "Include Dependent files?," click "Yes." Dependent files are generally images.

You know your files have been published to your Eden account when you see the files appear on the left side of the screen. This means that the files have been transferred to your web space.

Now, you have a site that you can find on the Web. To view it in a browser, just type in the following:

http://www.eden.rutgers.edu/~yourusername/your_file_title.html

You type in your own Eden account user name where it says "your_username" and your file name and extension (that is, the name you saved your file under, such as "index.html"). If you did not publish your files to your Eden space, just put in the URL of wherever you uploaded your site index.

Edit Sites
During your time working in Dreamweaver MX, you may want to go back and edit the web site information you entered when you established your Site. You can do this by going to the menu bar and selecting “Site” and then “Edit Sites.”

The “Edit Sites” window will now appear. It contains a number of options that will allow you to modify the properties of selected sites.

New:
This does the same function as the "New Site" feature. From this window, you can define a whole new site.

Edit:
When you need to change information about a preexisting site, click "Edit" and you can modify site information from there. For example, if you need to change a folder, a password, or initiate the “Check In / Check Out” feature, you will need to click on the “Edit” button. You will then be taken to a window that looks the same as the one you used when you first defined your site.

Duplicate:
Makes an exact copy of a previously existing site, retaining all of its properties and settings that you have defined.

Remove:
If there is a site that you do not want to have listed any more, click on the "Remove" button, and its information will be removed from Dreamweaver MX (though local files stored on your computer will remain).

Export:
Lets you to save the exported site as an XML file.

Import:
Lets you to select an XML file for a site to import.

Done:
Click on the "Done" button when you are finished working with this window.

Help:
Brings up the help documentation if you need assistance editing your site definitions.

>> next