Adapting navbar in dreamweaver sample,starter page

  kiz 14:03 07 Jul 08
Locked

I want to use of the the starter webpages which come with dreamweaver CS3. (new >page from sample>starter page (theme)>health & Nuitrition home page etc.
My question is, how do I add extra nav bar buttons?There are only five there at the moment, I need 8.
thanks

  Taran 16:33 09 Jul 08

When you first create the page, go into split or code view.

Look for this (lines 58 - 72):

<tr>
<td width="165"><a href="javascript:;" class="navText">topics</a></td>
</tr>
<tr>
<td width="165"><a href="javascript:;" class="navText">guidelines</a></td>
</tr>
<tr>
<td width="165"><a href="javascript:;" class="navText">educators</a></td>
</tr>
<tr>
<td width="165"><a href="javascript:;" class="navText">special needs</a></td>
</tr>
<tr>
<td width="165"><a href="javascript:;" class="navText">food science</a></td>
</tr>

Highlight the above code and delete it, the paste this in its place:

<tr>
<td width="165"><a href="javascript:;" class="navText">topics</a></td>
</tr>
<tr>
<td width="165"><a href="javascript:;" class="navText">guidelines</a></td>
</tr>
<tr>
<td width="165"><a href="javascript:;" class="navText">educators</a></td>
</tr>
<tr>
<td width="165"><a href="javascript:;" class="navText">special needs</a></td>
</tr>
<tr>
<td width="165"><a href="javascript:;" class="navText">food science</a></td>
</tr>
<tr>
<td width="165"><a href="javascript:;" class="navText">Link 6</a></td>
</tr>
<tr>
<td width="165"><a href="javascript:;" class="navText">Link 7</a></td>
</tr>
<tr>
<td width="165"><a href="javascript:;" class="navText">Link 8</a></td>
</tr>

  Taran 16:36 09 Jul 08

I should have added that you will need to do that on all of your pages, or if you do it on one page you can then save that page using the File, Save As menu and rename it to each page you want.

Example:

Amend the code in the index.html page as detailed above.

Save it.

Now use File, Save As and call the page about_us.html, then repeat and call it contact_us.html and so on.

That way all of your pages will share the same structure.

If you taregt the hyperlinks on the index.html page before using the File, Save As menu, the links will each point to pages you save as.

I know what I mean anyway...

  kiz 15:54 10 Jul 08

Thanks Taran, it worked like a dream (and I did understand you)
I really think I need to get my head around javascript for navbars for the future. Can you point me in the direction of any good tutorials on the net?
thanks anyway

  Taran 16:40 10 Jul 08

I'd avoid straight JavaScript menus like the proverbial plague.

You could look into JavaScript combined with CSS to create styled lists.

That way, where JavaScript is turned off or not installed, the list of hyperlinks will 'degrade' properly and still appear in the browser as a list of links.

Straight JavaScript often doesn't degrade well at all.

Since you have Dreamweaver take a look at the Spry Framework: click here

Check your toolbars in Dreamweaver and see what the built-in Spry functions can do. The function list isn't as broad as some frameworks, but I've found Spry to be far more robust, if a little less flexible.

Make a test page not connected to your current site, or create a test site within the Dreamweaver site manager and start shoving Spry widgets into the pages.

The Spry menu bar offers you a multi-level JavaScript/CSS driven vertical or horizontal navigation bar, and the accordian and tabbed panels are impressive too.

They are readily customisable and you can style them to match your site if you like.

I only suggest this route because Spry is very robust, well documented, relatively simple to get to grips with and integrated into the program you are using.

Have fun !

  gerri-atrick 00:28 11 Jul 08

click on the botom table row in the menu,( or any really) in layout menu click on insert row below, then click in another menu item, where the tags are (starting <body> <table> etc etc ) click once on the <a.nav> tag, then edit at top of page, then copy, click in the row you have just added right click, then paste :)) do that as many times as you wish and your done :) ....a lot easier ;)

This thread is now locked and can not be replied to.

Surface Pro (2017) vs Surface Pro 4

20 groundbreaking 3D animation techniques

How to mine Bitcoin on Mac