Rehmat Alam A blogger who has fallen in love with coding! Here at SupportiveHands.net, I share things that relate to coding, servers, E-marketing, and other related fields.

How to Create a Dynamic Navigation in PHP for Your Website

1 min read

When you design your own website and use HTML for creating navigation, it frustrates when you need to edit something in navigation menu. You need to edit each and every page for even minor changes and this is really a very tough task. Today we will learn how to create a dynamic navigation for your website in PHP. After creating navigation using PHP, you will be able to update all pages dynamically by modifying the base file only.
php-navigation-dynamic
Image Source: IconArchive
Dynamic Navigation Using PHP
To create a dynamic navigation menu, first we need to compose a PHP file containing HTML code for navigation and name it navigation.php. If you don’t have any idea, how to build a navigation, follow below steps. Remember that these steps will create a navigation menu according to my provided CSS, so if you need to need any other style, then you will have to use your own CSS or customize below according to your site’s demands. To create navigation.php file, follow below instructions:
1. Open notepad, paste below code in it, edit the links and labels and save it as all file types. Then name it as navigation.php
2. After saving above file as navigation.php, now define a style for navigation menu. To define the navigation menu style, use following CSS code or define your one if you are expert enough. Paste below code in notepad and save it as menu_style.css. You can define the width and height of the menu according to your site’s layout

 #supportive_menu
{ width: 920px;
  height: 50px;
  text-align: center; font-weight:bold;
  margin: 0 auto;
  background: grey;   
ul#menu
{ margin:0;}

ul#menu li
{ padding: 0 0 0 0px;
  list-style: none;
  margin: 2px 0 0 0;
  display: inline;
  background: transparent;}

ul#menu li a
{ float: left;
  height: 25px;
  margin: 10px 0 0 20px;
  padding: 5px 20px 0 20px;
  text-align: center;
  color: #FFF;
  text-decoration: none;
  background: transparent;}

3. Save above file and name as menu_style.css
4. Now upload both navigation.php and menu_style.css files to the root directory of your website

5. Open the homepage or any other page of your website in an editor like notepad or Dreamweaver and paste below piece of code just after

6.Now in every page of your website, replace static navigation with below provided PHP code and save your all files with .php extension.

 
   

7. Now you have added a dynamic navigation to all of your pages. Edit the links in navigation.php file and save it. Links and labels will be updated on all pages.

To make it work, ensure that you name all your webpages as .php extension. For example if the name of your homepage file was index.html, after adding the dynamic navigation menu, change the name as index.php and do it for all other files.

I hope that this simple trick will make your tasks very easy when it comes to edit the navigation. If you need any help, just leave a comment below.

Rehmat Alam A blogger who has fallen in love with coding! Here at SupportiveHands.net, I share things that relate to coding, servers, E-marketing, and other related fields.

PHPMailer: Called Mail() without being connected cPanel/WHM

PHPMailer is the most trusted PHP class to send emails that provide a complete set of features to enable you to send emails the easy...
Rehmat Alam
1 min read

How to bulk delete posts by a user in…

vBulletin is the most powerful forum software out there but sometimes its complex (or I can say that the ugly) administration control panel makes...
Rehmat Alam
1 min read

How to Backup and Restore a Large MySQL Database

phpMyAdmin is the most familiar tool for database management on small and medium-sized websites and blogs. This free tool makes the task of database...
Rehmat Alam
1 min read

Leave a Reply

Your email address will not be published. Required fields are marked *