How to generate navigation bar links
A common part of an HTML page template is a common navigation bar, just like the one above. If you're being nice to the user, then the navigation bar never includes a link to the current page. This HOWTO shows one way of achieving that using some server-side PHP code.
The approach I use is to
- use a single page template with common code for the navigation bar
- define a function that outputs a single link, taking parameters that specify the current page, and the link's destination, text and title
- code the function so that it navigation item text is not a hyperlink when the current page is the same as the link destination
- call the function, in the template, for each of the navigation bar links.
Here's what this looks like, in PHP, for these pages. First, the PHP function is
function InsertNavigationLink($page_basename, $url_basename, $label, $title) {
if (strcmp ($page_basename, $url_basename) == 0) {
echo "<strong>$label</strong>";
}
else {
echo "<a title=\"$title\" href=\"$url_basename\">$label</a>";
}
}
Then, in my page template, I output the navigation bar like this, having already populated the $base_name variable with the file name of the current page's URL.
<?php $base_name = basename($_SERVER['REQUEST_URI']); ?>
<?php InsertNavigationLink($base_name, 'index.html', 'HH home', 'Hilton Harbour main page'); ?> |
<?php InsertNavigationLink($base_name, 'new.html', 'what\'s new', 'what\'s newest on Hilton Harbour'); ?> |
<?php InsertNavigationLink($base_name, 'index.html?theme=contents', 'contents', 'Table of contents'); ?> |
<?php InsertNavigationLink($base_name, 'index.html?theme=index', 'index', 'Alphabetical index'); ?> |
<?php InsertNavigationLink($base_name, 'index.html?theme=photos', 'photo index', 'Alphabetical index'); ?> |
<?php InsertNavigationLink($base_name, 'about_hh.html', 'about', 'about Hilton Harbour'); ?> |
In this example InsertNavigationLink is a subroutine that outputs the label directly. It would probably be neater to make it a function that returns the HTML as a string, like this.
function NavigationItem($page_basename, $url_basename, $label, $title) {
if (strcmp ($page_basename, $url_basename) == 0) {
return "<strong>$label</strong>";
}
else {
return "<a title=\"$title\" href=\"discussion/$url_basename\">$label</a>";
}
}
This has the advantage that I can then use slightly neater code in the page template:
<?php
$links = NavigationItem($base_name, 'index.html', 'HH home', 'Hilton Harbour main page') . "|";
$links .= NavigationItem($base_name, 'new.html', 'what\'s new', 'what\'s newest on Hilton Harbour') . "|";
$links .= NavigationItem($base_name, 'index.html?theme=contents', 'contents', 'Table of contents') . "|";
$links .= NavigationItem($base_name, 'index.html?theme=index', 'index', 'Alphabetical index') . "|";
$links .= NavigationItem($base_name, 'index.html?theme=photos', 'photo index', 'Alphabetical index') . "|";
$links .= NavigationItem($base_name, 'about_hh.html', 'about', 'about Hilton Harbour');
echo $links;
?>
