Creating Shared Borders with Navigation Menu and Page Banner
Using FrontPage 2003


A shared border is a region that is common to one or more pages in a web. A shared border may appear at the top of the page (similar to a page header), at the bottom (similar to a page footer), at the left, and/or at the right. Use shared borders to place the same content on multiple pages in one step, rather than editing each page.

One advantage is using a shared border to create a page banner and a navigation menu.  The following directions are for creating a shared border page banner, which is displayed across the top of the web page; and a navigation menu, which is displayed on the left-hand side of the web page.

The option to use shared borders in FrontPage 2003 is not available by default. In order to create shared borders, you must first "turn them on."

To Turn on Shared Borders:

  • Open your website in FrontPage 2003.
  • Choose Tools from the menu bar.
  • Choose Page Options

  • From the Page Options box, choose the Authoring tab.
  • Click in the check box next to Shared Borders.
  • Choose OK.

 

To Create A Page Banner Using Shared Borders:

  • Open FrontPage.
  • Open the file default.htm. (Any page will work.)
  • From the menu bar, choose Format, Shared Borders.



  • In the Shared Borders dialog box, choose All Pages, choose Top, choose Left.  (Do not choose Include navigation buttons.)

  • Choose OK.
You will receive a message on your default page, like this:




 

  • From the menu bar, choose Table, Insert, Table.


 

  • From the Insert Table box, set Rows: size to 1, and set Columns: size to 2.
  • Under Layout, use the drop-down arrow and choose Center.
  • Click in the Specify width: box.  (A check mark should appear.)
  • Click in the In percent circle.  (A dot should appear.)  Make sure 100 appears in the box. (The 100 In percent may automatically come on when you click to Specify width.)
  • Make sure the Borders size is set to 0.
  • Choose OK.
  • Save the page.


 

  • FrontPage will insert a table, as such:


 

  • This table will be used to create the banner for your web pages.
  • In the first column of the table, insert the graphic you wish to use.
  • In the second column, type in the name of the website.
     

To Create A Navigation Menu Using Shared Borders:

  • Put the cursor on top of the message in the left border and click.  The message will then look like this:

  • From the menu bar, choose Table, Insert, Table.


     

  • From the Insert Table box, set Rows: size to 1, and set Columns: size to 1.
  • Uncheck the Specify width: box.
  • Set the Cell padding: to 3.
  • Set the Cell spacing: to 5.
  • Make sure Border size is set to 0.
  • Choose OK.
  • Save the page.

  • Your page will then have a very small cell, in which the cursor is blinking, like this:


  • Inside that cell, type your school name.  (Example: Lafayette.)
  • Tab one time.  This will create another blank cell beneath.  As such:


  • Inside that cell, type Home.
  • Tab one time to create another blank cell.
  • Inside that cell, type the name of the next web page.  (These remaining web pages should be typed alphabetically.)
  • Continue to Tab and type in names of pages until you have all your web pages included. As such:

  • Save the page.

Formatting the Table:

  • Highlight the entire table.
  • In the drop-down box for the Font Size, choose 2 (10pt). Or if you'd like an even smaller font, you may choose 1 (8 pt).


  • Put your cursor on the edge of the highlighted table until it turns into a two-ended arrow.  Then hold down your left button and drag the cells to the right until the words in all the cells are the on the same line.  As such:

(This will make all your cells the same height and make them appear more like navigation buttons.)

  • Right-click on top of the highlighted table and choose Cell Properties.

 

  • In the Cell Properties box, under Background, Color, choose the drop-down box.
  • Choose More Colors.



  • In the More Colors box, choose the color you want for your navigation bars.  (You can see how the color appears in the lower right-hand box called New.)
    TIP: Make sure the color you choose will work with blue hyperlinks.
  • Choose OK.


Now when you click on the page off of the shared borders, you will be able to see how your navigation menu will appear.  As such:

  • Save the page.

Creating the Hyperlinks:

  • In the first cell, highlight your school name. (Highlight the words only, not the entire cell.)
  • Choose the icon with the world and the chain link on it.

 

  • In the Insert Hyperlink box, next to Address: type in the URL of your school. 

  • Choose OK.
  • Save the page.

Now when you click on the page off of the shared borders, you will be able to see that you have created a hyperlink to your school.  As such:


  • Highlight Home.  (Highlight the word only, not the entire cell.)
  • Choose the icon with the world and the chain link on it.  (Same steps as above.)
  • In the Insert Hyperlink box, choose default.htm, which is located in the white box with the other pages on your web.  (Notice: default.htm will then appear in the Address: box.)

 

  • Choose OK.
  • Continue this process until you have created hyperlinks for all your web pages.  (Tip: After you choose the page each time from the list of web pages in the white box, make sure the file name of that page appears in the URL: box.)
  • Save the page.

The Finished Product:

After you have completed hyperlinking all your web pages, you will be finished.  Your navigation bar will appear as such:


This navigation bar will appear on all the pages of your website, including new ones which you create.  When you make a change to the navigation bar (shared borders), the change will automatically appear on all the pages of your website. 

 


"Contents of this web site are intended to be used for the enhancement of instruction only.”  
Contact Maggie Whittington