Customising NAV.

First, how to make your life easier.

I told you that I'd show you an eaier way of inputting to NAV, so here it is. Presently, we are using <@NAV DATA="foo.html,bar.html..."> However, you can take out the DATA attribute and put in a SRC attribute. The SRC attribute points to a file that conains the NAV data. The file does, however, have to be formatted in a special way - but it's very intuitive. Basically, it looks like this:

Entry1=entry1.html Entry2=entry2.html Menu1= MenuEntry1=menuentry1.html MenuEntry2=menuentry2.html SubMenu= SubMenuEntry1=submenuentry1.html SubMenuEntry2=submenuentry2.html MenuEntry3=menuentry3.html Entry3=entry3.html

As you can see, the file has each entry in the NAV on a separate line. If you want to define a menu, you leave the line blank after the equals sign. Then you indent everything that is in that menu by one space. If you want a submenu in that, you indent everything by another space.

Customizing your NAV.

We have seen the three styles of NAV that you can specify - FLAT, OPEN and FOLDED. These styles are very useful for quickly putting a page together, and look good too.

Sometimes, however, you want to make your navigation bar more personal. In this session, we are going to make our own version of an OPEN NAV, but make it turn the name of the page we are on red.

It doesn't sound complicated, does it? Well, it is a little bit... I'm assuming here that you folks have some idea of basic if loops. These are a simple programming concept - if such and such is true, do this. We also need to know about else, which does as you'd expect - if such and such is true, do this, else do this. We'll see them soon.

The other thing to mention is that from now on, I won't be leading you through creating new files to do the tutorial with. By now you'll be sick of me saying how to do these things, so I'll just let you get on and do them. So, either make new files to your own satisfaction, or just alter some of our old ones from now on.

Right, lets get started. We'll be putting our changes into the template file. The first step is to tell the NAV that we want to use our own method of formatting the links. We do this by adding other attributes. There are three attributes that we could add at this point. They are PREGROUP, ENTRY and POSTGROUP. PREGROUP tells hitop what to do before the start of each level (i.e. before each menu, each submenu and so on) while POSTGROUP tells hitop what to do after each level. Entry tells hitop what to do for each entry.

We don't need to do anything special for each group, so we can leave the PREGROUP and POSTGROUP attributes out. We do want to do something with the entries though, so we need to tell hitop that. Your NAV tag should look something like this:

<@NAV src="nav_data.nav" entry="makered" format="open">

So, what does the entry="makered" mean, I hear you ask? Well, makered is the name of a procedure that will be called for every entry. What is a procedure? Well, anything inside a <@DEF> and a </@DEF> is. So, if you are using the a template similar to our earlier ones, the body text is contained in a procedure which is called once, by the template. If you wanted, you could set this to be the procedure called for each entry, but all it would do is print out the body text as many times as there are entries, so best not.

Now, we will create our procedure. But first, an important note - the procedure must be defined earlier in the file than the first time it is called. I hope that makes sense. If it doesn't, why don't you go and ride your fusion powered car to JET? I hope you get my point. Well, the physicists will, anyway...

Right, this is where we look at the procedure. First, we define the procedure.

<@DEF name="makered"> </@DEF>

Note that we have called it the same name as the procedure we are calling. On the whole, this is a good idea. The procedure itself goes inbetween the two tags. What we want the procedure to do is simple. If that entry is the present page, don't make it a link, and make the text red. Otherwise, make it a link to the appropriate page. So how do we do this?

What we need is some arguments passed to us. Luckily, NAV does just this, almost as if by design... The ones we need to know about now are NAME, HREF and OPEN. NAME gives you the label you have given that entry, HREF gives you the address / file name you have given that entry, and OPEN returns a number - 0 if that entry is not selected, 1 if it is. These are the only three we need at the moment, and are referred to in two different ways. I've put the example if loops below.

<@IF name="open" value="1"> <@get name="name"> <@ELSE> <a href="${href}"><@get name="name"></a> </@IF>

If you pop this in-between the <@DEF> tags, you will get a NAV that gives you what we wanted! Of course, it doesn't handle indenting of submenus yet, but we can add that easily. Look at the example below:

<@SET name=space value="   "> <@DEF name="makered"> <@GET name="space:REPEAT(${LEVEL})"> <@IF name="open" value="1"> <@get name="name"> <@ELSE> <a href="${href}"><@get name="name"></a> </@IF> </@DEF> <@UNSET name="space">

Coo, we have introduced quite a lot of new things here, haven't we? You've probably guessed LEVEL is another argument given by NAV to our procedure. It is a number relating to how many levels are between the present one and the start. REPEAT is an inbuilt function that means the variable space is repeated the right amount of times.

This is just one example of how you can customise NAV. But to learn more, we really need to have a look at what some of the inbuilt functions can do. This is what we will do next session.