FrontPage 2003 - The Basics

At this point, you should have:

A trial or registered version of FrontPage 2003
A sample template downloaded from our web site
An existing web site that you will be converting
All pages in your web site "prepped"

2. Import the DWT folder.

Unzip the .zip that you downloaded to a folder on your computer.
Inside the folder is a folder called something like "productname_dwt."
Import the folder into your web site by dragging and dropping it into the FrontPage folder list. (Learn more about this.)
You should now have the "productname_dwt" folder in your existing web site.

3. Attach the DWT to the pages of your web site.

Open a page in your web site. Then, go to Format > Dynamic Web Template > Attach Dynamic Web Template.
Browse into the "productname_dwt" folder and select the DWT you wish to attach. Click "Open."
A prompt window will open so that you can assign the Editable Regions. Double-click the (Body) line, and change the drop-down to "body1". Then, click OK.
Your selected DWT will apply, with your prepped page content dropped into the "body1" field. You may cut and paste as necessary from your original content into the other editable regions.
Repeat this for the other pages. (You may select multiple files in your Folder List if you wish to attach a DWT to multiple pages.)

4. Edit your pages.

Double-click on a page in the Folder List to open it for editing. The page will open in your main window area. You will be able to see the table lines that define the structure of the layout, which may offset the layout and images a little bit so that they look slightly skewed. This is normal - don't worry!
Adding your own content to the page is as easy as highlighting the text you want to replace and typing over it. You may edit any include pages that are inside the Editable Regions. You'll notice that you won't be able to edit anything that is outside of the Editable Regions - don't worry, you'll learn that soon!

Figure 1

Figure 2
You will notice that the file name in the tab now has an asterisk (*) by it - this means that you have made changes but have not yet saved.
Go to File > Save (Ctrl-S) to save your document.

Notes and hints...

To get "headings," use the style drop-down menu. This is the first dropdown menu in your toolbar.
Use "bold" and "italics," but stay away from underlining text. This makes the text look like it's a link, which is confusing to users.
To get sub-bullets, click the "indent" toolbar button twice.

5. Preview your page in a browser to view your changes.

Go to File > Preview in Browser.
Choose the browser you wish to use to preview your page. You may click the "Add" button to add more browsers (Netscape, Opera, various versions, etc.)
A browser will open with your web page in it. This is what your page will look like on a live server! The only exception is with forms, hit counters, and other special components that need a web server to function. You can click on the buttons to browse your web site and to see what the other pages look like. At this point, you might want to read the content in the other pages of the site because they have a lot of helpful information.
You may have noticed that in FrontPage, there is a "Preview" button at the bottom of the screen. This is a "quick" preview; however, you must realize that some things may look funny in FrontPage's preview, and that rollover buttons will not work. If you want to see what your web will look like on a live server, you should always go to File / Preview in Browser.
It is probably a good idea to keep the browser window open while you are working on your web. When you make changes, save in FrontPage, then go to the browser window and hit the Refresh button to reload the page with your changes.

6. Edit the DWTs to add your own copyright info and logo or name

If you want to edit the logo image, copyright statement, or some other aspect of the underlying Dynamic Web Template, you will have to actually open the .dwt file. Please note that changing the underlying .dwt will change ALL OTHER pages that are based on that .dwt file, so you should only make changes like adding your logo image or changing the copyright statement.

In the upper right corner of the page, FrontPage displays which DWT is being used and where it is located.
Browse to this file and open it in FrontPage. You'll notice that the layout is there, but the Editable Regions only show comments.
Make changes to the logo/name area, copyright statement, and any other areas that you want to modify with your own information.
Save your file. A dialog box may appear asking if you want to update the attached pages. Click Yes.
After updating attached pages, another dialog box will show that the pages have been updated. Click the Close button.
If you have pages open that have this DWT attached, you may also need to save them for the changes to apply. You may edit the other DWTs as necessary.

7. Make a hyperlink

If you are typing a url such as "www.yoursite.com" and "http://www.yoursite.com," or an email address like "youremail@youremail.com," FrontPage will usually automatically create a hyperlink out of it. However, you can also create hyperlinks out of words, phrases or images.

Select/highlight the word, phrase, or graphic that you wish to hyperlink. Then go to Insert/Hyperlink or click the "Insert Hyperlink" button on the toolbar.
The "Insert Hyperlink" dialog box will appear.
- Click the buttons on the left to link to a web page, a bookmark, a new page, or an email address.
- Or, browse your current web or the internet to find the page you want to link to, or simply type in the url or path name.
- Click "Target Frame" to specify if you want your link to open up in the same window, a new window, or a specific frame (if your web uses frames).
After specifying your link parameters, click "OK." You may always right-click on your link and select "Hyperlink Properties" to change them.

Next: Navigation