Активное меню на статичном сайте и сайте wordpress

Часто (всегда) на сайте надо вывести активные пункты меню. Если у вас статический сайт, то это не проблема. Просто отмечаете нужный пункт class=”active” , добавляете стили к этому классу и проблема решена.

Проблемы появляются если вы решили сделать динамическое меню.  Для того чтобы выделить активный пункт в динамическом меню есть два варианта: php и js. Я вам покажу оба варианта.

Вариант использовать php:

<section class="menu">
     <? $menu = array ("Главная"=>"/index.php", "Страница"=>"/page.php", "Блог"=>"/blog", "Контакты"=>"/contact.php",);
     echo "<ul class='nav '>";
     foreach ($menu as $title=>$url) {
         $class = strpos($_SERVER["PHP_SELF"], $url) !== false ? " class='active'" : "";
         echo "<li$class><a href='$url'>$title</a></li>";
     }
     echo "</ul>";?>
 </section>

Вариант использовать js(Jquery):

<script>
    jQuery(document).ready(function($) {
       var url=document.location.href;
       $.each($(".menu a"),function(){
          if(this.href==url){$(this).addClass('active');};
       });
    })(jQuery);
 </script>

Оба варианта работают. Какой использовать выбирать вам.

Вторая проблема с которой связываются «сайтоделы» это выделение активного пункта меню на wordpress.

В этом случае все упрощается в разы, так как создатели движка уже позаботились об этом. Активным пунктам присваиваются классы current-menu-item и current_page_item.

Поэтому в файле style.css вам потребуется просто добавить стили к данным классам и все должно заработать.

Если вы не справились, то пишите, мы с удовольствием поможем.