Client-side or browser-side menu systems are quite common. A look at sites such as www.dynamicdrive.com reveal quite a few. But what is more of a pick these days are menu systems which can be built at the server side-a concept largely brought in by ASP.NET, and menu systems which are supported by a wide variety of Web browsers (ideally browser independent). If you are a PHP developer and missing a cool server-side menu system, here is PHPLM, ie, PHP Layers Menu. This PHP-based menu system supports wide variety of Web browsers including IE, Mozilla, Netscape and Opera.
Get started
We will build a simple menu system (as shown in the screenshot) using a text file that describes the menu items. We will use PCQLinux 2004. (We proceed with the assumption that you have already installed PHP on PCQLinux 2004.) On this month's PCQuest Essential CD, you will find the PHPLM package. Extract the archive named phplayersmenu-3.2.0-rc.tar.gz, which will produce a directory, phplayersmenu-3.2.0. Under this directory you will find numerous files, which are examples of how to use the package. We will start on a clean slate.
|
Create a directory say, menutest under the /var/www/html directory. Copy the sub-directories named libjs, menuimages, templates, lib and menuicons in the directory phplayersmenu-3.2.0, to the menutest directory. Also copy the file named layersmenu-gtk2.css to the menutest directory.
The menu items
What follows is the content of a text file, defining the menu items, for our menu system.
.|PCQuest|https://www.pcquest.com/|PCQuest||_blank
.|Articles||PCQuest Articles
..|Developers
...|.Net|dotnet.php|.Net|sourceforge.net_images_favicon.png
...|Java|java.php|Java|sourceforge.net_images_favicon.png
..|Linux
...|Desktop|desktop.php|Desktop Linux|sourceforge.net_images_favicon.png
...|Server|server.php|Server Linux|sourceforge.net_images_favicon.png
The lines above follow the syntax mentioned below:
Here in the syntax, dots define the hierarchical placement of the item in the menu. Note that the menu items 'PCQuest' and 'Articles' are at the top level and hence a single dot for them. Now 'Developers' and 'Linux' are below 'Articles' and hence prefixed with two dots. Very obviously, the menu items '.Net', 'Java', 'Desktop' and 'Server' which are at the third level are prefixed by three dots. The
|
.|PCQuest|https://www.pcquest.com/|PCQuest||_blank
Save the above contents in a file named menuitems.txt in the directory /var/www/html/menutest
PHP code for the menu system
Next we need to write the PHP code to display the menu system comprising the menu items, defined in the menuitems.txt.
require_once ("lib/phplib.php");
require_once ("lib/layersmenu-common.inc.php");
require_once ("lib/layersmenu.inc.php");
$menu = new LayersMenu();
$menu->setMenuStructureFile("menuitems.txt");
$menu->parseStructureForMenu('testmenu');
$menu->newHorizontalMenu('testmenu');
$menu->printHeader();
?>
$menu->printMenu('testmenu');
?>
-- page content goes here --
$menu->printFooter();
?>
The page starts with including a number of JavaScript and PHP files. Note the lines:
$menu->setMenuStructureFile("menuitems.txt");
$menu->parseStructureForMenu('testmenu');
$menu->newHorizontalMenu('testmenu');
The above lines pick the menu structure from the file named menuitems.txt and set up a horizontal menu system as specified by the function newHorizontalMenu( ). Save the above file as menu.php and access it using the
URL http://
To turn this horizontal menu system into a vertical one, you only need to substitute the following line in menu.php
$menu->newHorizontalMenu('testmenu');
with
$menu->newVerticalMenu('testmenu');
PHPLM does not stop here. It supports picking up the menu items from a database and a tree like menu system similar to Windows Explorer or any file manager.
Shekhar Govindarajan IT4Enterprise