Setting Up a Website in Dreamweaver

*You must do this each time you use Dreamweaver on a NEW computer in order

to access your files.

  1. Open Dreamweaver
  2. In the panel on the right, click on the drop down menu and choose “Manage Sites”
  3. type a name for you site and click “next”
  4. Select “No, I do not want to use a server technology” and click “next”
  5. Select “Edit directly on server using local network”
  6. Then click on the file icon and navigate to your web drive (go to “My Computer” and select “Webhome on yourusername”) and then click “next”
  7. Click Done.
  8. Any previous files you have saved will load in the panel on the right and you can double-click on any of them to open them

Starting a New Page

  1. In the upper left-hand corner of Dreamweaver, Click on the “File” menu.
  2. Select “New.” A box titled “New Document” will pop up.
  3. To design the page completely on your own, select “Basic page”
  4. To use a template, choose one of the designs that appear under one of the “Page Designs” options or the “Framesets” option
  5. Immediately save the document with a description (but short!) name. Make sure not to use any spaces in the filename. If you need a space, use and underscore _

Making a Link to a website outside of your site

  1. Type the text you want to appear as the link. Highlight that text.
  2. Without clicking off of the text, go below the design screen to the “Properties” panel and place your cursor in the box titled “Link”
  3. Type or copy the URL for the website (make sure to include the full URL, including http://)
  4. To test the link, SAVE THE DOCUMENT and then hit the F12 button (or Select “File” then “Preview in Browser”
  5. Remember, the links do not work inside Dreamweaver. You must preview the page in a browser window to see the links

Making a Link to Another Page or File within your website

  1. First, create the page that you want to link to & save it
  2. Go back to the page you want to create the link on
  3. Type the text you want to appear as the link. Highlight that text.
  4. Without clicking off of the text, go below the design screen to the “Properties” panel and click and hold on the small compass symbol directly to the right of the “link” box
  5. While holding the mouse button down, drag the cursor and hover over the name of the file you want to link to in the list of files in the right-hand panel
  6. Once over the file, let go of the mouse

Changing the Appearance of the Page, Links, or Text

  1. In the menu bar for Dreamweaver, select “Modify”
  2. Choose “Page Properties”
  3. A box will pop up with navigation on the left listing (Appearance, Links, Headings, Title/Encoding, and Tracing Image)
  4. Select the type of change you want to make (Appearance, Links, or Headings) and then see the types of changes you can make for that property

Adding Images to Your Website

  1. If the right-hand panel that lists all the file names, right-click on the root folder of your site (hint: it will be named the name you gave it when you set up your site)
  2. Select “New folder”
  3. Name the folder “images”
  4. Go find the images you want to use on your website and save a copy of these images to the folder named “images”
  5. You must do this so a copy of the images is in your web folder! Otherwise, the images will not work!
  6. Once you have the images saved in the “images” folder, go to the navigation on the top of the page and click “Insert”
  7. Select “Image”
  8. In the box that pops up, open your “images” folder, select the image you want to be on the page, and click “OK”
  9. Resize the picture as needed by holding down the “shift” key, placing the cursor in the corner of the image until the double-sided arrow appears, and resize.