Dynamic Navigation Menu in PHP


Introduction

In general, a menu is a list of items. A menu is presented as a group of audible choices to which the user can respond by pressing a button or speaking aloud. A menu is a group of options presented to the user of a computer to help the user get information about any program or application. Menus are commonly used in graphical user interfaces such as Windows. 

The item of a menu is like the point on the map that says "you are here".

A menu is a set of commands or options from which you can select your choice. You can select an item from the menu by highlighting it and then pressing enter or by simply pointing to the item and clicking the mouse button.

There are many types of menus, some of them are:

  • Pop-up menu: A pop-up menu has only two choices i.e. Yes/No, that is called a dialog box. Once you make a selection from a pop-up menu, the menu usually disappears.
  • Cascading menu: A submenu that opens when you choose a choice from another menu.
  • Pull down menu: A pull-down menu like selecting an item from a combo box. A special type of pop-up menu that appears directly beneath the command you selected.
  • Dynamic navigation menu: A dynamic menu is a way to give users a reference point with which to navigate.
  • A dynamic menu with scrolling color glide following is appropriate for a personal entertainment blog and a website which requires new fashioned style and personalization.

    First of all we will create menu.php file.

    Code

    <?php
    function menu_item ($id, $title, $current)
    {
      $class = ($current == $id) ?
    "active" : "inactive";
    ?>
      <tr><td class=<?=$class?>>
      <a href="index.php?page=<?=$id?>"><?=$title?></a>
      </td></tr>
    <?php
    }
    function page_menu ($page)
    {
    ?>
      <table width="100%">
      <?php menu_item ('Home', 'Home', $page); ?>
      <?php menu_item ('About', 'About', $page); ?>
      <?php menu_item ('Browse', 'Browse', $page); ?>
      <?php menu_item ('Download', 'Download', $page); ?>
       <?php menu_item ('Contact Us', 'Contact Us', $page); ?>
    </table>
    <?php
    }
    ?>

    The above file is to be saved with the name menu.php, which will be called from the index.php file later.

    Now we will create another file in PHP, named index.php. In this file the menu.php file is called.

    <?php
    include_once ('menu.php');
    $page =
    isset($_GET['page']) ? $_GET['page'] : 'Home';
    ?>
    <html>
    <
    head>
    <
    title>Page - <?=$page?></title>
    <
    style type="text/css">
    .inactive, .active
    {
     
    padding:2px 2px 2px 20px;
    }
    .inactive
    {
     
    background:skyblue
    }
    .active
    {
     
    background:red;
     
    font-weight:bold;
    }
    .inactive a
    {
     
    text-decoration:none;
    }
    .active a
    {
     
    text-decoration:none;
     
    color:white;
    }
    </style>
    </
    head>
    <
    body bgcolor="pink">
    <h3><u>Dynamic Navigation Menu</u></h3>
    <
    table>
    <
    tr>
    <
    td width="200" valign="top">
    <?php page_menu($page); ?>
    </td>
    <
    td width="600" valign="top">
    Page: <?=$page?>
    </td>
    </
    tr>
    </
    table>
    </
    body>
    </html>

    Output

    When you will browse your index.php file then you will get the following image. When you click on home then the background of the home will be red and the message "Page : Home" will be printed.

    image1.jpg

    When you click on about then the background of about will be red and the message "Page : About" will be printed.

    image2.jpg

    In the same manner, when you will click on browse, download or contact us then the background of these items will be red and "Page : Browse", "Page : Download" or "Page : Contact Us" respectively, will be printed.

    image5.jpg

    Conclusion

    So in this article you saw, how to create a dynamic navigation menu in PHP. Using this article one can easily understand the concept of a dynamic navigation menu in PHP.

    Some Helpful Resources