EasyNav - Keeping navigation clean and current
EasyNav is a PHP script that allows you to automatically highlight the current section in a navigation.
All you need to do is:
- Create your navigation as a plain nested list with links.
- Include the script script in your documents via
<?php include('easynav.php');?>
where you want the navigation to appear.
EasyNav then does the following:
- Loads the navigation template
- Checks the location of the document that it got included into
- Compares each of the links inside the template, and see if they are part of that location
- If that is the case, replaces the link with strong element and sets the proper IDs
The IDs set by EasyNav are "active" for the current list item and "current" for the strong element. This allows you to use any CSS of Listamatic to style your navigation.
If your PHP installation has the domxl extension enabled, EasyNav offers even more.
- It adds the class "parent" to each list element and its first link containing the current version.
Depending on which ID is set on the root UL of your navigation template:
- It removes all the inactive sub sections of the navigation.
- It moves the current section to the top of the navigation.
- It moves the current section below the first item of the navigation.
- Or a mix and match of all of the above.
EasyNav Demos
- Only highlighting the current link and its parent list item.
- Removing all the inactive sub navigations.
- Making the current section the first.
- Making the current section the second after a home link.
- Removing all the inactive sub navigations and making the current section the first.
- Removing all the inactive sub navigations and making the current section the second after a home link.
Customising the script
All the ID names to trigger the different navigation types and the classes and IDs added to the HTML can be changed in the variables section of the script:
/* Variables */
// id added to the current LI
$listitem_id='active';
// id added to the current A
$link_id='current';
// navigation file
$nav='nav.html';
/* Variables dependent on DOMXML availability */
// class added to each LI containing the current one
// and the parent link
$parentclass='parent';
// ID to remove non-active sub navigations
$rsnID='navrsn';
// ID to remove non-active sub navigations and show the
// current sub navigation first
$rsncnoID='navrsncno';
// ID to remove non-active sub navigations and show the
// current sub navigation
// after the home link
$rsncnonhomeID='navrsncnohome';
// ID to show the current sub navigation after the home link
$cnonhomeID='navcnohome';
// ID to show the current sub navigation first
$cnoID='navcno';
Download
The zip downloadable here contains the script itself, this information page and the demos.
