How to set current "active" page in php

Hi, I have a menu on my site on every page, I want to put it in my menu.php file, but I'm not sure how to set class = "active" for any page that I'm on. Here is my code: please help me

menu.php:

<li class=" has-sub"> <a class="" href="javascript:;"><i class=" icon-time"></i> Zeiten<span class="arrow"></span></a> <ul class="sub"> <li><a class="" href="offnungszeiten.php">Öffnungszeiten</a></li> <li><a class="" href="sauna.php">Sauna</a></li> <li><a class="" href="frauensauna.php">Frauensauna</a></li> <li class=""><a class="" href="custom.php">Beauty Lounge</a></li> <li><a class="" href="feiertage.php">Feiertage</a></li> </ul> </li> 
+12
css php
source share
13 answers

It would be easier if you built an array of pages in your script and passed it to the view file along with the current active page:

 //index.php or controller $pages = array(); $pages["offnungszeiten.php"] = "Öffnungszeiten"; $pages["sauna.php"] = "Sauna"; $pages["frauensauna.php"] = "Frauensauna"; $pages["custom.php"] = "Beauty Lounge"; $pages["feiertage.php"] = "Feiertage"; $activePage = "offnungszeiten.php"; //menu.php <?php foreach($pages as $url=>$title):?> <li> <a <?php if($url === $activePage):?>class="active"<?php endif;?> href="<?php echo $url;?>"> <?php echo $title;?> </a> </li> <?php endforeach;?> 

When using a template engine like Smarty , your menu.php would look even better:

 //menu.php {foreach $pages as $url=>$title} <li> <a {if $url === $activePage}class="active"{/if} href="{$url}"> {$title} </a> </li> {/foreach} 
+11
source share

this method gets the current page using php, which will pass the word active in this case and place it inside the class parameter to set the active page.

 <?php function active($currect_page){ $url_array = explode('/', $_SERVER['REQUEST_URI']) ; $url = end($url_array); if($currect_page == $url){ echo 'active'; //class name in css } } ?> <ul> <li><a class="<?php active('page1.php');?>" href="http://localhost/page1.php">page1</a></li> <li><a class="<?php active('page2.php');?>" href="http://localhost/page2.php">page2</a></li> <li><a class="<?php active('page3.php');?>" href="http://localhost/page3.php">page3</a></li> <li><a class="<?php active('page4.php');?>" href="http://localhost/page4.php">page4</a></li> </ul> 
+14
source share

Create a variable in each php file, for example:

 $activePage = "sauna"; (different for each page) 

then check this variable on your html page like this

 <?php if ($activePage =="sauna") {?> class="active" <?php } ?> 
+11
source share

Put all the code below in menu.php and everything will take care.

 // function to get the current page name function PageName() { return substr($_SERVER["SCRIPT_NAME"],strrpos($_SERVER["SCRIPT_NAME"],"/")+1); } $current_page = PageName(); 

Use the above to get the name of the current page, then put this on your menu

 <li><a class="<?php echo $current_page == 'offnungszeiten.php' ? 'active':NULL ?>" href="offnungszeiten.php">Öffnungszeiten</a></li> <li><a class="<?php echo $current_page == 'sauna.php' ? 'active':NULL ?>" href="sauna.php">Sauna</a></li> <li><a class="<?php echo $current_page == 'frauensauna.php' ? 'active':NULL ?>" href="frauensauna.php">Frauensauna</a></li> <li><a class="<?php echo $current_page == 'custom.php' ? 'active':NULL ?>" href="custom.php">Beauty Lounge</a></li> <li><a class="<?php echo $current_page == 'feiertage.php' ? 'active':NULL ?>" href="feiertage.php">Feiertage</a></li> 

where active is the name of the class that will highlight your menu item

+5
source share

There are two things you can do.

first you can read the current file name of the requested php file using $_SERVER['PHP_SELF'] or $_SERVER['REQUEST_URI'] or any other $ _ SERVER global variables that you can use to read the current page and compare it with the URL link address, something like this

  <a href="offnungszeiten.php" <?php if($_SERVER['PHP_SELF']=='offnungszeiten.php'){ ?>class="activatepage" <?php } ?> > Öffnungszeiten </a> 

the second is to create a variable that you can read globally to keep the current name of the current page, for example

 <?php $cur_page ="offnungszeiten" ?> <a href="offnungszeiten.php" <?php if($cur_page=='offnungszeiten'){ ?>class="activatepage" <?php } ?> > Öffnungszeiten </a> 
+1
source share

I did it with php this way

 function createTopNav($active) { $pages = array( array( 'name'=>'Home', 'link'=>'index' ), array( 'name'=>'Smartphone', 'link'=>'smartphone' ), array( 'name'=>'Tablet', 'link'=>'tablet' ), array( 'name'=>'About Us', 'link'=>'about' ), array( 'name'=>'Contact Us', 'link'=>'contact' ) ); $res = "<ul>"; $activePage = ""; foreach($pages as $key=>$val) { if($val['link']==$active) { $res.= "<li><a href='".$val['link']."' class='active' >".$val['name']."</a></li>"; } else { $res.= "<li><a href='".$val['link']."'>".$val['name']."</a></li>"; } } $res.="</ul>"; return $res; } 

And then to call this function

 echo createTopNav("about"); 

and the conclusion will be like

 <ul> <li><a href="index">Home</a></li> <li><a href="smartphone">Smartphone</a></li> <li><a href="tablet">Tablet</a></li> <li><a href="about" class="active">About Us</a></li> <li><a href="contact">Contact Us</a></li> </ul> 
+1
source share

I solved this with jQuery / javascript by executing the code below every time any page loads:

  $(document).ready(function () { //Get CurrentUrl variable by combining origin with pathname, this ensures that any url appendings (eg ?RecordId=100) are removed from the URL var CurrentUrl = window.location.origin+window.location.pathname; //Check which menu item is 'active' and adjust apply 'active' class so the item gets highlighted in the menu //Loop over each <a> element of the NavMenu container $('#NavMenu a').each(function(Key,Value) { //Check if the current url if(Value['href'] === CurrentUrl) { //We have a match, add the 'active' class to the parent item (li element). $(Value).parent().addClass('active'); } }); }); 

This implementation assumes your menu has a NavMenu identifier and uses the attributes http://hostname/scriptname.php href:

  <ul id="NavMenu"> <li><a href="http://localhost/index.php">Home</a></li> <li><a href="http://localhost/smartphone.php">Smartphone</a></li> <li><a href="http://localhost/tablet.php">Tablet</a></li> <li><a href="http://localhost/about.php" class="active">About Us</a></li> <li><a href="http://localhost/contact.php">Contact Us</a></li> </ul> 

Read the javascript comments to see what happens. If you prefer to use a different href layout (for example, in your original example), you need to play a little with the CurrentUrl variable so that it uses the same layout as your href attributes.

For me, this was the easiest solution, as I had existing sites with a large menu and many pages, and I wanted to avoid the need to change all pages. This allows me to insert a piece of javascript code into the header file (which was already the central file), which solves the problem for all existing pages.

+1
source share

Send the name of the page in the query line and check it on each page, getting a variable.

0
source share

Simplified solution:

Borrowing code from asprin above;

Create a new menu.php file where you save one and only copy of the menu. In this file, you will create the addMenu($pageName) function, which will take the parameter as the name of the page and return the line consisting of the menu after adding the current tag.

In your HTML code, you would include(menu.php) , and then call the addMenu function with the name of the current page. So your code will look like this:

menu.php

  <?php function addMenu($pageName){ $menu = '<ul> <li><a href="Öffnungszeiten.php"' . ($pageName == "Öffnungszeiten" ? "class=\"current\"" : "") . '><span>Öffnungszeiten</span></a></li> <li><a href="sauna.php"' . ($pageName == "Öffnungszeiten" ? "class=\"current\"" : "") . '><span>Sauna</span></a></li> <li><a href="frauensauna.php"' . ($pageName == "Frauensauna" ? "class=\"current\"" : "") . '><span>Frauensauna</span></a></li> <li><a href="custom.php" ' . ($pageName == "lounge" ? "class=\"current\"" : "") . '><span>Beauty Lounge</span></a></li> <li><a href="Feiertage.php"' . ($pageName == "feiertage" ? "class=\"current\"" : "") . '><span>Feiertage</span></a></li> </ul>'; return $menu; } ?> 

And in your HTML, say this:

 <div id="menu"> <?php include('menu.php'); echo addMenu("index"); echo $hello; ?> </div> 
0
source share

A bit late at the ball, but I just had to solve it myself and ended up using this Javascript method with a little modification. This has the advantage of not requiring a lot of changes in the current code, just run the script and voila.

 window.onload = activateCurrentLink; function activateCurrentLink(){ var a = document.getElementsByTagName("A"); for(var i=0;i<a.length;i++) if(a[i].href == window.location.href.split("#")[0]) a[i].className = 'activelink'; } 
0
source share

you can use

 <?php function active($current_page){ $page = $_GET['p']; if(isset($page) && $page == $current_page){ echo 'active'; //this is class name in css } } ?> <ul> <li><a class="<?php active('page1');?>" href="?p=page1">page1</a></li> <li><a class="<?php active('page2');?>" href="?p=page2">page2</a></li> <li><a class="<?php active('page3');?>" href="?p=page3">page3</a></li> <li><a class="<?php active('page4');?>" href="?p=page4">page4</a></li> </ul> 
0
source share

This worked for me:

  function active_page($script){ $actual = basename($_SERVER['PHP_SELF']); if($script == $actual){ return 'active-page'; //class name in css } } 
0
source share

I have a simple example, see below:

 <?php function active($currect_page) { $url = $_SERVER['REQUEST_URI']; if($currect_page == $url){ echo 'active'; } } ?> <ul class="navbar-nav mr-auto"> <li class="nav-item <?php active('/');?>"> <a class="nav-link" href="/">Home</a> </li> <li class="nav-item <?php active('/other');?>"> <a class="nav-link" href="/other">Other page</a> </li> </ul> 
0
source share

All Articles