web-dev-qa-db-fra.com

Comment définir la page actuelle "active" en php

Salut, j'ai un menu sur mon site sur chaque page, je veux le mettre dans son propre fichier menu.php mais je ne sais pas comment définir le class = "active" pour la page sur laquelle je suis sur . Voici mon code: aidez-moi s'il vous plaît

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>
10
jenny

Il serait plus facile de construire un tableau de pages dans votre script et de le transmettre au fichier de vue avec la page actuellement active:

//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;?>

Avec un moteur de template tel que Smarty votre menu.php serait encore plus joli:

//menu.php
{foreach $pages as $url=>$title}
   <li>
       <a {if $url === $activePage}class="active"{/if} href="{$url}">
         {$title}
      </a>
   </li>
{/foreach}
10
package

cette méthode obtient la page en cours en utilisant php qui passera un mot dans ce cas actif et le placera dans le paramètre class pour définir la page active.

<?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>
13
iraqi_love4ever

Créez une variable dans chacun de vos fichiers php comme:

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

puis vérifiez cette variable dans votre page html comme ceci

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

Mettez tout le code ci-dessous dans menu.php et tout sera pris en charge.

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

$current_page = PageName();

Utilisez ce qui précède pour obtenir le nom de la page actuelle, puis mettez-le dans votre 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>

active est le nom de la classe qui mettra en évidence votre élément de menu

5
asprin

Je l'ai fait avec php de cette façon, 

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;
}

Et ensuite appeler cette fonction

echo createTopNav("about");

et la sortie sera comme ça 

<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
Angela Taylor

il y a deux choses que vous pouvez faire.

tout d'abord, vous pouvez lire le nom de fichier actuel du fichier php que vous avez demandé en utilisant $_SERVER['PHP_SELF'] ou $_SERVER['REQUEST_URI'] ou toute autre variable globale $ _SERVER que vous pouvez utiliser pour lire votre page actuelle et la comparer à l'URL du lien.

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

la seconde consiste à créer une variable lisible globalement qui stockerait le nom actuel de la page actuelle, comme ceci

<?php
$cur_page ="offnungszeiten"
?>

<a href="offnungszeiten.php" <?php if($cur_page=='offnungszeiten'){ ?>class="activatepage" <?php } ?> >
 Öffnungszeiten
</a>
1
Mp de la Vega

Solution Simplere:

Emprunter le code de asprin ci-dessus;

Créez un nouveau fichier menu.php où vous allez stocker la seule et unique copie du menu. Dans ce fichier, vous allez créer une fonction addMenu($pageName) qui prend un paramètre comme nom de page et retourne une chaîne constituée du menu après avoir ajouté la balise en cours.

Dans votre code HTML, vous utiliseriez include(menu.php), puis appelez la fonction addMenu avec le nom de la page actuelle. Votre code ressemblera à ceci:

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;
    }
        ?>

Et dans votre code HTML, dites ceci:

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

J'ai résolu ce problème en utilisant jQuery/javascript en exécutant le code ci-dessous chaque fois que ma page est chargée: 

 $(document).ready(function () {    
    //Get CurrentUrl variable by combining Origin with pathname, this ensures that any url appendings (e.g. ?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');
            }
        });
 });

Cette implémentation suppose que votre menu a l'ID 'NavMenu' et utilise les attributs http://hostname/scriptname.php href comme suit:

 <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>

Lisez les commentaires javascript pour voir ce qui se passe. Si vous préférez utiliser une présentation href différente (comme dans votre exemple d'origine), vous devez jouer un peu avec la variable CurrentUrl pour qu'elle utilise la même présentation que vos attributs href.

Pour moi, c’était la solution la plus simple, car j’avais un site existant avec un grand menu et de nombreuses pages et je voulais éviter de modifier toutes les pages. Cela me permet d'ajouter un morceau de code javascript dans le fichier d'en-tête (qui était déjà un fichier central), ce qui résout le problème pour toutes les pages existantes.

0
Alex

Cela a fonctionné pour moi:

    function active_page($script){

    $actual = basename($_SERVER['PHP_SELF']);

  if($script == $actual){
      return 'active-page'; //class name in css
  }
}
0
mrmut

Vous pouvez utiliser

<?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
iraqi_love4ever

Envoyez le nom de la page dans la chaîne de requête et vérifiez-le sur chaque page en récupérant la variable.

0
Ajeet Singh

Un peu tard, mais je devais résoudre le problème moi-même et finis par utiliser cette méthode Javascript , avec une petite modification. Cela présente l'avantage de ne pas nécessiter beaucoup de modifications du code actuel, il suffit d'exécuter le script et le tour est joué.

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
jimmy