Microsoft Publisher - Twin navigation bars for big website

Author

Twin navigation bars for big website

Publisher_rookie

2007-04-19, 6:18 pm

I am having difficulty inserting nav bars. I have an approximately 60 page
site and wanted to split the links on either side versus having one long nav
bar. Can someone advise please because when I add new pages, it adds to both
nav bars.

Mike Koewler

2007-04-19, 6:18 pm

Rookie,

If you have 60 items in a Nav Bar, that's at least 50 too many. The
whole idea of a Nav bar is to make navigation to key pages quick and
easy. Having to go through 60 of them is neither.

Mike
Publisher_rookie wrote:
> I am having difficulty inserting nav bars. I have an approximately 60 page
> site and wanted to split the links on either side versus having one long nav
> bar. Can someone advise please because when I add new pages, it adds to both
> nav bars.

DavidF

2007-04-19, 10:17 pm

One of the most difficult and most important parts of building a large site
is the navigation system. And the larger the site gets the harder it is to
manage, and the more you should consider moving to another program.
Publisher is a DTP with limited web building capability, and is primarily
good for small, static, simple web sites.

In your case you need to take a step back and figure out how you want to
organize your site. As Mike suggested your main menu should probably not be
60 links long. It should be links to your primary pages or sections, and
then you use submenus to get around in those sections.

As I see it you can live with the long menus, or abandon the navbar wizard
and build your own textual or graphic navbar...or perhaps break your site up
into more than one Publisher file. I use many Publisher files for the many
different sections, and build my own. Reference: Building a web site with
multiple Publisher web publication files:
http://msmvps.com/blogs/dbartosik/a...1/16/81264.aspx
I approach this a bit different as I create subfolders on my host to hold
the different sections and output from the different Publisher files.

DavidF

"Publisher_rookie" <Publisherrookie@discussions.microsoft.com> wrote in
message news:80EF0BC9-76D4-415D-ACFF-38ECCB18D342@microsoft.com...
>I am having difficulty inserting nav bars. I have an approximately 60 page
> site and wanted to split the links on either side versus having one long
> nav
> bar. Can someone advise please because when I add new pages, it adds to
> both
> nav bars.

Publisher_rookie

2007-04-21, 10:15 pm

OK, I have split the nav bar into 30 per side, one is to each of the 50 state
resource pages, one to federal, the rest to nonprofits and statististical
data. This is just a preliminary design And will be modified or programmed in
another web authoring software. I understand people may not get it, but it is
necessary for the template to be as complete as possible before sending
somewhere else to do final workup.

"DavidF" wrote:

> One of the most difficult and most important parts of building a large site
> is the navigation system. And the larger the site gets the harder it is to
> manage, and the more you should consider moving to another program.
> Publisher is a DTP with limited web building capability, and is primarily
> good for small, static, simple web sites.
>
> In your case you need to take a step back and figure out how you want to
> organize your site. As Mike suggested your main menu should probably not be
> 60 links long. It should be links to your primary pages or sections, and
> then you use submenus to get around in those sections.
>
> As I see it you can live with the long menus, or abandon the navbar wizard
> and build your own textual or graphic navbar...or perhaps break your site up
> into more than one Publisher file. I use many Publisher files for the many
> different sections, and build my own. Reference: Building a web site with
> multiple Publisher web publication files:
> http://msmvps.com/blogs/dbartosik/a...1/16/81264.aspx
> I approach this a bit different as I create subfolders on my host to hold
> the different sections and output from the different Publisher files.
>
> DavidF
>
> "Publisher_rookie" <Publisherrookie@discussions.microsoft.com> wrote in
> message news:80EF0BC9-76D4-415D-ACFF-38ECCB18D342@microsoft.com...
>
>
>

Mike Koewler

2007-04-22, 6:18 pm

In that case, what I would do - to make navigating easier, not to
mention keeping the site less cluttered, is what most sites that have
dozens of links on a page do:
Set them up alphabetically.
A B C D E F G H, etc., with a note telling viewers to click for
that state's page. Under A you would have Alabama, Alaska, Arkansas, etc.
Remember, your first goal should be to make it easy for a user to find
what they are looking for. Having 30 links in one Nav bar is not going
to accomplish that. Plus, there are search engines that will not spider
Nav Bars unless they are text only (no JS).

Mike

Publisher_rookie wrote:[color=darkred]
> OK, I have split the nav bar into 30 per side, one is to each of the 50 state
> resource pages, one to federal, the rest to nonprofits and statististical
> data. This is just a preliminary design And will be modified or programmed in
> another web authoring software. I understand people may not get it, but it is
> necessary for the template to be as complete as possible before sending
> somewhere else to do final workup.
>
> "DavidF" wrote:
>
>

DavidF

2007-04-22, 6:18 pm

And if the OP does want to use javascript, a drop down list for the states
would work. Here is something I copied from somewhere:

"Two kinds of drop-down lists hyperlink to other pages: one, the page
changes when the selection changes; two, the page changes when the visitor
clicks a button. Both of these kinds are shown in the following sections.
Both use the same function, goToPage, to open the new page.

The following code shows the goToPage function that the drop-down lists
shown in this section use. This code uses the open method to open the page
specified in the url parameter, but you could also use the navigate method.

<script language="JavaScript">
function goToPage(url)
{
if (url != "")
{
window.open(url);
}
}
</script>

Page Changes When the Selection Changes
With a drop-down list that automatically opens a new page, the user doesn't
need to do anything except select the item from the drop-down list to open
the page. The following code contains the HTML for creating a drop-down
list. In this example, the onchange event for the list calls the goToPage
function shown previously and passes the value attribute of the selected
item (OPTION element).

<form>
<label><u>S</u>earch Engines</label>
<select accesskey="S"
onchange="goToPage(this.options(this.selectedIndex).value)">
<option selected>Please select one</option>
<option value="http://search.msn.com/">MSN Search</option>
<option value="http://www.google.com/">Google</option>
<option value="http://www.search.com/">Search.com</option>
<option value="http://www.dogpile.com/">Dogpile</option>
</select>
<form>
Page Changes When the User Clicks a Button
Creating a drop-down list that uses a Go button is just as simple. The user
selects an item from the drop-down list and clicks Go, and the new page
opens. The following code contains the HTML to create this drop-down list.
The main differences between this code and the code in the previous example
are as follows:

The SELECT element in this code doesn't contain the onchange event.
This code contains a BUTTON element for the Go button.
This code provides a value for the name attribute of the FORM and SELECT
elements, which are necessary for the script to function properly.

<form name="dropdown">
<label>Search <u>E</u>ngines</label>
<select name="list" accesskey="E">
<option selected>Please select one</option>
<option value="http://search.msn.com/">MSN Search</option>
<option value="http://www.google.com/">Google</option>
<option value="http://www.search.com/">Search.com</option>
<option value="http://www.dogpile.com/">Dogpile</option>
</select>
<button onclick="goToPage(document.dropdown.list.options(
document.dropdown.list.selectedIndex).value)">Go</button>
</form>

To use this code, paste the script in the HEAD section of a page and paste
the form (with the nested elements) where you want the drop-down list to
appear on your page. However, do not nest the form inside another FORM
element.

After you place the drop-down list where you want it to appear, you can
change text displayed and the value attribute for each OPTION element in the
SELECT element as needed. The value attribute for each OPTION element should
contain a valid URL, including the "http://" prefix"

DavidF

"Mike Koewler" <wordwiz@fuse.net> wrote in message
news:c4188$462b741c$453d95d5$17237@FUSE.NET...[color=darkred]
> In that case, what I would do - to make navigating easier, not to mention
> keeping the site less cluttered, is what most sites that have dozens of
> links on a page do:
> Set them up alphabetically.
> A B C D E F G H, etc., with a note telling viewers to click for
> that state's page. Under A you would have Alabama, Alaska, Arkansas, etc.
> Remember, your first goal should be to make it easy for a user to find
> what they are looking for. Having 30 links in one Nav bar is not going to
> accomplish that. Plus, there are search engines that will not spider Nav
> Bars unless they are text only (no JS).
>
> Mike
>
> Publisher_rookie wrote:

Mike Koewler

2007-04-22, 6:18 pm

David,

Great idea. I knew there was some way of using a combo box to create
links, I just couldn't think of how at the moment. That would keep the
page uncluttered, it will load quicker and viewers who have JS turned
off will still be easy to find everything!

Mike

DavidF wrote:

> And if the OP does want to use javascript, a drop down list for the states
> would work. Here is something I copied from somewhere:
>
> "Two kinds of drop-down lists hyperlink to other pages: one, the page
> changes when the selection changes; two, the page changes when the visitor
> clicks a button. Both of these kinds are shown in the following sections.
> Both use the same function, goToPage, to open the new page.
>
> The following code shows the goToPage function that the drop-down lists
> shown in this section use. This code uses the open method to open the page
> specified in the url parameter, but you could also use the navigate method.
>
> <script language="JavaScript">
> function goToPage(url)
> {
> if (url != "")
> {
> window.open(url);
> }
> }
> </script>
>
> Page Changes When the Selection Changes
> With a drop-down list that automatically opens a new page, the user doesn't
> need to do anything except select the item from the drop-down list to open
> the page. The following code contains the HTML for creating a drop-down
> list. In this example, the onchange event for the list calls the goToPage
> function shown previously and passes the value attribute of the selected
> item (OPTION element).
>
> <form>
> <label><u>S</u>earch Engines</label>
> <select accesskey="S"
> onchange="goToPage(this.options(this.selectedIndex).value)">
> <option selected>Please select one</option>
> <option value="http://search.msn.com/">MSN Search</option>
> <option value="http://www.google.com/">Google</option>
> <option value="http://www.search.com/">Search.com</option>
> <option value="http://www.dogpile.com/">Dogpile</option>
> </select>
> <form>
> Page Changes When the User Clicks a Button
> Creating a drop-down list that uses a Go button is just as simple. The user
> selects an item from the drop-down list and clicks Go, and the new page
> opens. The following code contains the HTML to create this drop-down list.
> The main differences between this code and the code in the previous example
> are as follows:
>
> The SELECT element in this code doesn't contain the onchange event.
> This code contains a BUTTON element for the Go button.
> This code provides a value for the name attribute of the FORM and SELECT
> elements, which are necessary for the script to function properly.
>
> <form name="dropdown">
> <label>Search <u>E</u>ngines</label>
> <select name="list" accesskey="E">
> <option selected>Please select one</option>
> <option value="http://search.msn.com/">MSN Search</option>
> <option value="http://www.google.com/">Google</option>
> <option value="http://www.search.com/">Search.com</option>
> <option value="http://www.dogpile.com/">Dogpile</option>
> </select>
> <button onclick="goToPage(document.dropdown.list.options(
> document.dropdown.list.selectedIndex).value)">Go</button>
> </form>
>
> To use this code, paste the script in the HEAD section of a page and paste
> the form (with the nested elements) where you want the drop-down list to
> appear on your page. However, do not nest the form inside another FORM
> element.
>
> After you place the drop-down list where you want it to appear, you can
> change text displayed and the value attribute for each OPTION element in the
> SELECT element as needed. The value attribute for each OPTION element should
> contain a valid URL, including the "http://" prefix"
>
> DavidF
>
> "Mike Koewler" <wordwiz@fuse.net> wrote in message
> news:c4188$462b741c$453d95d5$17237@FUSE.NET...
>
>
>

Publisher_rookie

2007-04-24, 10:15 pm

Thanks for the great tips guys. Much appreciated, and I will check back if I
need further assistance.

"Mike Koewler" wrote:

> David,
>
> Great idea. I knew there was some way of using a combo box to create
> links, I just couldn't think of how at the moment. That would keep the
> page uncluttered, it will load quicker and viewers who have JS turned
> off will still be easy to find everything!
>
> Mike
>
> DavidF wrote:
>
>

Publisher_rookie

2007-04-24, 10:15 pm

Mike, umm, as my name suggests, I am indeed a rookie. I am so out of my depth
here, that I would have no idea where to insert that code as when I open my
publisher file it is not in code but in web format. The cliparts, icons, nav
bars, backgrounds are there, well, what I have done, and I wouldn't want to
mess it up. So if you could instruct me on this I could possibly do it, or
could sent the file to you lol?? Thanks, John

"Publisher_rookie" wrote:
[color=darkred]
> Thanks for the great tips guys. Much appreciated, and I will check back if I
> need further assistance.
>
> "Mike Koewler" wrote:
>

DavidF

2007-04-25, 3:15 am

Since I gave you the code, I will reply...and tell you to forget that code.
It is designed to open the links in a new window, and you just want to open
a page on your site in the same window. So, instead use this:

----------------

<form name="jump">
<p align="center">
<select name="menu">
<option selected>Choose State</option>
<option value="http://yourdomain.com/index_files/Alaska.htm">Alaska</option>
<option value="http://yahoo.com">Yahoo</option>
<option value="http://microsoft.com">Microsoft</option>
</select>
<input type="button"
onClick="location=document.jump.menu.options[document.jump.menu.selectedIndex].value;"
value="GO">
</p>
</form>

-------------------

Copy all the code between the lines, and paste in Notepad. It will be easier
for you to rewrite it there, and then save it for future use.

But to get an idea of how it works and will look, just open your Pub file
and go to the page where you want to insert it. Then copy the code snippet,
go to Insert > html code fragment > and use CTRL + V to paste it in the code
fragment box. OK. Then resize the code fragment box so that it is a little
bigger than the drop down box that will be produced, and make sure it is
wide enough that the Go button is to the side. Then drag the box to where
you want it to appear on your page. Choose an empty spot...not in a text
box, picture or any other design element. Then do a web page preview. The
first link will not work, but try clicking on the Yahoo choice, and clicking
Go. You may need to do some webpage previews to figure out how big and how
wide to make the code fragment box.

I changed "Choose State" for your use, but you could put any text in that
part of the code. Then if you look at the first choice for Alaska, you
switch out 'yourdomain.com' for your domain. Be sure to use index_files and
not index files.

Now, I also made another change that will make it easier for you in the long
run. Right now when you publish to the web, each page of your site is given
an arbitrary page name such as "Page354.htm", but you have the option to
change that. Go to the page that has your Alaska details. Go to Tools > Web
Page Options. On that dialog, under Publish to the Web, and in the File Name
field put "Alaska". Now when you publish to the web, you will create a page
Alaska.htm instead of Page354.htm or some other hard to remember file name.
Go through each of your State pages and do the same, and then you are ready
to build your code snippet.

As I said open NotePad and work there rather than try to do this in the code
fragment box. After you change the domain name in the link to your Alaska
page, copy that line of code and paste it 49 more times below it, just as
you see the links to Yahoo and Microsoft, and of course delete those two
lines. Then go through them one at a time, and change out Alaska and
Alaska.htm for your other states. When you are done, save the NotePad file
so you don't have to redo all of this, copy all the code and paste it into
your Publisher page, and you should be good to go.

DavidF

"Publisher_rookie" <Publisherrookie@discussions.microsoft.com> wrote in
message news:9F3AE72B-667C-4BAD-9579-893FB0D0A8B2@microsoft.com...[color=darkred]
> Mike, umm, as my name suggests, I am indeed a rookie. I am so out of my
> depth
> here, that I would have no idea where to insert that code as when I open
> my
> publisher file it is not in code but in web format. The cliparts, icons,
> nav
> bars, backgrounds are there, well, what I have done, and I wouldn't want
> to
> mess it up. So if you could instruct me on this I could possibly do it, or
> could sent the file to you lol?? Thanks, John
>
> "Publisher_rookie" wrote:
>

Mike Koewler

2007-04-25, 3:15 am

John,

You could create a separate page or at the bottom of the current page
list the Alphabet a second time, but under the letter would be any state
that starts with that letter. You would insert an anchor next to the
letter (I think maybe Pub calls them Bookmarks?). Then at the top of the
page, where your first Alphabet is, create a link to that anchor. So if
a visitor clicks on W, they will see Washington, West Virginia,
Wisconsin and Wyoming. Each state would have a link to its page.

Mike

Publisher_rookie wrote:
[color=darkred]
> Mike, umm, as my name suggests, I am indeed a rookie. I am so out of my depth
> here, that I would have no idea where to insert that code as when I open my
> publisher file it is not in code but in web format. The cliparts, icons, nav
> bars, backgrounds are there, well, what I have done, and I wouldn't want to
> mess it up. So if you could instruct me on this I could possibly do it, or
> could sent the file to you lol?? Thanks, John
>
> "Publisher_rookie" wrote:
>
>

Publisher_rookie

2007-04-25, 6:16 pm

You guys rock, thanks for the help. Man this is gonna take some killer time,
as well the 250 man hours editing the background, ooof.

"Mike Koewler" wrote:

> John,
>
> You could create a separate page or at the bottom of the current page
> list the Alphabet a second time, but under the letter would be any state
> that starts with that letter. You would insert an anchor next to the
> letter (I think maybe Pub calls them Bookmarks?). Then at the top of the
> page, where your first Alphabet is, create a link to that anchor. So if
> a visitor clicks on W, they will see Washington, West Virginia,
> Wisconsin and Wyoming. Each state would have a link to its page.
>
> Mike
>
> Publisher_rookie wrote:
>
>

Mike Koewler

2007-04-25, 10:15 pm

John,

Remember Cut and Paste. Besides, you could have asked before you started
all this! Don't think I am insulting you or giving you a hard time, I'm
not. I did the same thing and I think David has also. We start off not
knowing anything about web design, learn a bit, start adding things,
then go - oops, why didn't I think of this six months ago. I went
through it back in December and it took about three weeks of work to
change over. But since then - a piece of cake and I'm grateful I spent
the time doing it.

One other thing to consider - breaking you pages up into sections. Yes,
more time, but it will make life more simple in the future. I know, it's
easy for me to say since I don't have to do the work, but I might
consider a separate file for each state. You can still link to it, you
just use the full address rather than a relative one.

Mike

Publisher_rookie wrote:
[color=darkred]
> You guys rock, thanks for the help. Man this is gonna take some killer time,
> as well the 250 man hours editing the background, ooof.
>
> "Mike Koewler" wrote:
>
>

Publisher_rookie

2007-04-25, 10:15 pm

Thanks again Mike and Dave for the help. Mike, I will keep that in mind. It
is on my many to do lists. Thanks again, and I really appreciate the help.
John

"Mike Koewler" wrote:

> John,
>
> Remember Cut and Paste. Besides, you could have asked before you started
> all this! Don't think I am insulting you or giving you a hard time, I'm
> not. I did the same thing and I think David has also. We start off not
> knowing anything about web design, learn a bit, start adding things,
> then go - oops, why didn't I think of this six months ago. I went
> through it back in December and it took about three weeks of work to
> change over. But since then - a piece of cake and I'm grateful I spent
> the time doing it.
>
> One other thing to consider - breaking you pages up into sections. Yes,
> more time, but it will make life more simple in the future. I know, it's
> easy for me to say since I don't have to do the work, but I might
> consider a separate file for each state. You can still link to it, you
> just use the full address rather than a relative one.
>
> Mike
>
> Publisher_rookie wrote:
>
>