Using a Navigation Banner across your pages

Navigational banners a great way to ease the navigation around your Interest Space, it allows you to give visitors easy access to the key areas of your space without them having to dig around in the space content list. I usually use two table to create the banner, which is made up of images, text and links.

Example of banner on Safer Schools site

1. Create your pages
First off you will need pages for the banner to link to, in this example the pages are:
- Home
- Information
- Video
- Teacher Zone
- Student Zone
- Reporting

2. Create the lists and libraries
Make sure you hide the lists and libraries from the Space Content List when you are creating it, as they will be displayed as web parts on the page.
e.g. for the Information page you may want to create a Documents Library and a Links list to display as web parts.

3. Design your banner
For a starting point, create a table with 3 columns and 1 row, width 100%

- In the left column insert a picture
- in the right column insert a logo
- in the middle column insert a heading
Directly beneath the first table, create a second table. 1 column per page and 1 row, width 100%

- In each cell type in the name of the page
Play around with cell widths, colours, padding image sizes until it looks how you want.
You can use the table properties to put background colours for the table.


4. Link your banner
Grab the URL address of each page you have created and create a link from the banner cell you have created for it. E.g. link the text 'Noticeboard' to the URL address for the noticeboard. Repeat this for all pages.

5. Put your banner on other pages
When you are happy with your banner press the html button in the page editor and copy ALL of the code
Edit each page you have created, press the html button and PASTE in the copied code.

6. Modify pages
You can then go back an modify any text you may have in the banner to suit each page, or you could change any images or logos for each seperate page, keeping them the same size

7. Put in the web parts
Go onto each page and insert your webparts
You can have multiple web parts per page e.g. Information could have a Documents Library and a links list


Tips: 
- By putting the table width at 100%, it will stretch the banner across the top of the page. 
- I usually use 2 tables but you can play around with cells and rows depending on the site 
- Use graphics software or Powerpoint to create buttons for the page links or a more graphical header 


I've not created the extra pages or set the links, but the idea is that you'll have a page for each header in the banner, and you'll be able to get to each page just by clicking across the banner.
Examples of where this has been used. (you may not have access to all of these)
- PVE
- SIS
- ICTDS
- Education Policy Development