View the class server:


Uploading your website using FTP (File Transfer Protocol)

Using the site window in Dreamweaver
Define a site in Dreamweaver

ftp local

    1. With the SITE window of Dreamweaver open, select SITE>MANAGE SITES.
    2. Select NEW > SITE
    3. With SITE selected
      Set SITE NAME to “website” or “mysite”(or whatever you want)
      Set LOCAL SITE FOLDER to where you the main folder where your files are located. Do Not set this folder to the folder where your web files are. If you do, you will be unable to move the entire folder. Always set the Local Root Folder to a folder above your project folder at least.

ftp plus

In the next window, click on the plus “+” sign indicated above.

ftp remote

  1. With SERVERS selected
    Set FTP ADDRESS to: ftp.smcgrdes.com
    Set USERNAME to: smc_cavanaugh
    Set PASSWORD to: WebDev4grdes (remember, this is case-sensitive)
    Set ROOT DIRECTORY to: cavanaugh.smcgrdes.com/grdes67/
  2. Select SAVE to complete the creation of a new site
  3. CONNECT to the server using the “plug” icon

ftp expand

The window will probably appear collapsed on the bottom right hand side of the stage. Click on the expand/collapse window button (It’s circled in the image below). This will expand the window so there is a left and right pane.
Select the CONNECT button to access your FTP account (at the top-left of the site window, to the right of the site name — it looks like a plug. In the image above it the the first icon in the same row as the expand/collapse icon.
The left side of the SITE window (remote) will show all files currently on the server in the directory. The right side of the SITE window (local) will show your files on your computer.
On the server, any files you want available on the web should go in the [web] directory.
Files can be viewed at:

Once you’ve connected to the server, you can upload your site files (or download files from the server to your local computer).

Uploading Files

To upload files to the server, click on the folder or file you want to upload, and drag it from the right side to the left side. Or you can select “put” by right clicking to upload the files.

In most cases, you will upload the complete web site as a directory. Drag this folder to the left hand side, and drop it when you’ve placed it over the top folder .

Dropping the folder on the/export folder ensures that you place the folder in the correct place. If you drop a file or folder onto another folder, the file will be placed inside of that folder rather than replacing it. Note that dragging the top level folder from the right side of the window will not copy that folder, it will only copy the files inside the top level folder. This is why it’s important to set the Local Root Folder to “D:\” so that you have access to all folders on the disk.

If you want to move a single file up to the server, then drag this file and drop it onto the correct directory on the server (or you can drop it on top of an old version of the same file).

When you move HTML files in the Site Files window, Dreamweaver will ask if you want to Include Dependent Files? If you say yes, Dreamweaver will look in your HTML files, and copy any images in referenced in those files, even if you don’t select them for the copy. In general, if you are copying a folder of a complete site, there is no reason to copy dependent files, since you are already copying all the files needed for the site (because they are all in the folder). But if you are copying an individual HTML file, then in general it’s good to answer yes to including dependent files, to make sure that any images in that page are properly uploaded.

Uploading existing files on the server:

When you upload and replace files that are already on the server, there are several issues you should note:

  • Be sure you save the new file before you upload it, so your changes get to the server.
  • Dreamweaver (and other FTP programs) will not ask you if you want to replace them. It will just write over the old files. Be sure you want to replace the files on the server before you upload the new files.
  • After you upload the new versions of the files, you should check to make sure they are on the server. View the web pages on the Internet at their real web address, and don’t rely on the Dreamweaver preview of the local file. If the web page is already open on the browser, use the Reload/Refresh button to view the page.
  • Sometimes when you replace a file and view it, you don’t see the changes. This is because the browser has cached the file, and you are looking at an old copy stored on the local computer, not the new one on the server. To fix this, try using the Reload/Refresh button. If this doesn’t work, hold the shift key and press Reload/Refresh to force a newer version. If that doesn’t work, you will have to clear the cache. This is usually in Edit>Preferences>Advanced>Cache. If this doesn’t work, you probably didn’t upload the file correctly, or to the right location.
Rules for the Shared server

Please be courteous to your fellow students by following the guidelines below:

  • Be sure to disconnect from the server when you are done uploading files (especially when we are in the class room since we can’t all connect to the server at one time.)
  • Be careful not to overwrite a fellow student’s files or the index file for the shared site.
  • All student files are considered private and you cannot view or download other student’s files from the server without permission.
Video Demonstrations
FTP (File Transfer Protocol)

File Organization (Website Directory Structure)