Setup Guide V1 (last updated January 4th, 2007)

Designed for the Focus Series Templates and Modules

Top link bar basic tutorials

What is it? Horizontal text menu buttons located at the top of the page.

The top link bar may contain 5-8 text links, or link buttons. The top link bar is embedded into each web page in your template using an 'include' page component, or Library file for Dreamweaver users. When you modify the top link bar include page, all pages in your web site using the embedded link bar will be updated as well. So you only need to made changes to one 'include page' in order to update all the pages in your web site. The appearance of the top link bar is controlled through a style sheet.


Add a button


It's best to add a new button, using the CODE or HTML window. The 'design' window of your HTML editor may not copy all the required code correctly. Follow the video for complete instructions.

INSTRUCTIONS:

  • open your web site

  • open the 'includes' folder - [FP] 'Library' folder - [DW]

  • open the 'top_links'  page

  • switch to code view

  • copy an existing line of button code

  • paste between two existing buttons, or at the end of the list

  • change the button link and name in the code

  • save


Remove a button


It's best to add a new button, using the CODE or HTML window. The 'design' window of your HTML editor may not copy all the required code correctly. Follow the video for complete instructions.

INSTRUCTIONS:

  • open your web site

  • open the 'includes' folder - [FP] 'Library' folder - [DW]

  • open the 'top_links'  page

  • switch to code view

  • highlight the button code you wish to remove

  • press delete on your keyboard

  • save


Edit the button name


It's best to add a new button, using the CODE or HTML window. The 'design' window of your HTML editor may not copy all the required code correctly. Follow the video for complete instructions.

INSTRUCTIONS:

  • open your web site

  • open the 'includes' folder - [FP] 'Library' folder - [DW]

  • open the 'top_links'  page

  • double click on a link to activate text edit mode

  • type in the new name for the link

  • change the hyperlink for a text link:

  • right click on a text link

  • select Hyperlink Properties

  • browse to the page you will be linking to and click to select this page as the new hyperlink

  • or - type the name of the page into the 'Address' text field

  • click OK once a new page has been selected


Edit a button hyperlink


It's best to add a new button, using the CODE or HTML window. The 'design' window of your HTML editor may not copy all the required code correctly. Follow the video for complete instructions.

INSTRUCTIONS:

  • open your web site

  • open the 'includes' folder - [FP] 'Library' folder - [DW]

  • open the 'top_links'  page

  • right click on a text link

  • select Hyperlink Properties

  • browse to the page you will be linking to and click to select this page as the new hyperlink

  • or - type the name of the page into the 'Address' text field

  • click OK once a new page has been selected

*NOTE* you can modify the appearance of the text for the links bars directly on the include page, but we recommend editing the style sheet if you want to do this.

 

Overview | Basic | Intermediate | Advanced