Активные пункты меню в WordPress

Проблема очень распространенная. Класс у активного пункта меню пропадает, когда мы проваливаемся в дочерний элемент. Будем исправлять!


WordPress своими алгоритмами создает верстку и классы. Нам надо вмешаться в процесс и подсказать, в каких случаях какие пункты оставлять активными.

Например, мы имеем:

  • Свой тип записей «Портфолио» в меню называется «Портфолио» (допустим, id=4);
  • Страница с постами находится в пункте меню «Блог» (допустим, id=1);
  • Если мы находимся в архиве записей «Портфолио», у нас подсвечивается пункт меню «Блог»;
  • Если мы находимся на подробной странице типа «Портфолио», у нас подсвечивается пункт меню «Блог»;

Нужно исправить:

  • Если мы в архиве или на подробной записи типа «Портфолио», то надо убрать подсветку пункта меню «Блог» (id=1, напомню);
  • Подсвечиваем пункт меню «Портфолио» (id=4), если мы в архиве записей этого типа, или на странице записи.

Решение:

if( !function_exists( 'global_navigation__active_classes' ) {
  function global_navigation__active_classes( $classes, $item ) {
  
    // Убирает активный класс у пункта меню "Страница записей" (id=1), если мы находимся на archive.php или single.php custom post_type="portfolio"
    if( ( is_post_type_archive( 'portfolio' ) || is_singular( 'portfolio' ) )  && $item->object_id == 1 ):
      $classes = array_diff( $classes, array( 'current_page_parent' ) );
    endif;

    // Добавляет активнвый класс к пункту меню с id=4, если мы находимся на archive.php или single.php custom post_type="portfolio"
    if( ( is_post_type_archive( 'portfolio' ) || is_singular( 'portfolio' ) ) && $item->object_id == 4 )
      $classes[]='current_page_parent';

    return $classes;
  }
  add_filter( 'nav_menu_css_class', 'global_navigation__active_classes', 10, 2 );
}

Код (разумеется, добавляем его в

functions.php

) будет запускаться при формировании связей пункта меню

$item

и принадлежащих ему классов

$classes

.

В первом случае мы убираем из массива с классами тот, который нам не нужен.

Во втором случае мы добавляем пункт

current_page_parent

в массив.

Оформляем стиль активного пункта на основе класса

current_page_parent

.

На основе этого кода можно написать любую логику, которая подходит для вашего проекта. Например, если нужно подсвечивать элементы категорий, меток, других таксономий, произвольных типов записей, подсветка вложенности страниц и все в таком духе.

Пользуйтесь на здоровье и не теряйте времени на мелочи!


admin

Share
Published by
admin

Recent Posts

Настройка Mercurial по HTTPS

Иногда mercurial, при скачивании и комитах ругается на https. Особенно на самоподписанные сертификаты. Чтобы заработал…

2 недели ago

Компиляция libvirt в Ubuntu

Компиляция libvirt Подробнее

2 недели ago

Ошибка libvirt permission denied: решение

Если возникает ошибка libvirt destroy lxc permission denied , при попытке остановить контейнер: _x000D_# virsh…

2 недели ago

Настройка редиректа в NGINX

Файлы с примерами редиректа для nginx Подробнее

2 недели ago

Включение gzip в NGINX

Как включить gzip сжатие в Nginx ? Подробнее

2 недели ago

Удаление postinst-скрипта в Linux

Иногда возникает ситуация, когда криво настроенные пакеты не устанавливаются в системе. У меня это произошло…

2 недели ago