Dynamic CSS classes - php

Question

My website has a simple navigation using a styled <ul> list, with the current page's link highlighted. Currently, I do this by giving the <a> object a CSS class like this:
<ul class="bd-nav">
<li>Home</li>
<li>Contact</li>
</ul>
with the corresponding CSS:
.bd-nav-active {
background-color: #563a64;
}
This works perfectly. However, I would like to build the website with PHP and have a seperate file for the header/navigation and then just <?php include ?> that file on every other page.
Is there a way to dynamically set the class of the navigation links, depending on which page you're on? What would be the best approach here?
Solved after some fiddling! I simply put the class attribute into a variable like this: (make sure to escape the quotation marks!)
<?php
$nav_active = "class=\"bd-nav-active\""
?>
Then used that variable in my navigation like this:
<ul class="bd-nav">
<li><a href="index.html" <?php if ($pid == 1) echo $nav_active; ?>>Home</a></li>
<li><a href="contact.html" <?php if ($pid == 2) echo $nav_active; ?>>Contact</a></li>
</ul>
And then on the respective pages, I simply set the $pid variable:
<?php $pid = 1; ?>
Works perfectly! Thanks for the helpful answers!
#Arrabidas92 had a nice way to automatically do this by getting the page URL, but I think I'll be doing it like this to have better control over how the navigation looks.

Answer 1

The menu needs to be dynamically generated and each page needs to have a unique id or something at the top of the page.
When you dynamically generate the menu, insert and if clause that will echo the active class if generated menu item is the same with current page.

Answer 2

I have not coded in php for some time now but i use to do something like this, in each page give a unique file name at the top. For example in the home page:
<?php
$file_name = "index.php";
?>
and then in the included file apply a logic like this:
<?php
if($file_name == "index.php"){
//Your navigation for the home page
}
else if($file_name == "about.php"){
//Your navigation for the about page
}
?>

Answer 3

Alright so I will give you some tips. First, to know on wihch page of your website you are you can use in PHP a superglobal called $SERVER with this attribute : $_SERVER['REQUEST_URI'].
By calling this, PHP is going to return the parts of the url after your domain.com. For example, if the current url was domain.com/home, echo will return only '/home'.
Then, you can place your logic about highlighting your links :
if($_SERVER['REQUEST_URI' == '/home') {
//Add active class to the link HOME
}...

Answer 4

You can try this one, but this is a Jquery, just put the CDN in your file.
$(document).ready(function(){
if(window.location.href === "index.php") {
$(".bd-nav").addClass("active-bgRed");
}
else if(window.location.href === "about.php") {
$(".bd-nav").addClass("active-bgBlue");
}
else if(window.location.href === "contact.php") {
$(".bd-nav").addClass("active-bgGreen");
}
});
// CSS
.active-bgRed{
background-color: red;
}
.active-bgBlue{
background-color: blue;
}
.active-bgGreen{
background-color: green;
}
// JQuery CDN
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>