Как задать цвет шрифта строчки меню, соответствующий той странице, на которой пользователь сайта находится в данный момент?

Question

[Konstantin063]

Как правильнее и корректнее в меню:
- управленческий консалтинг
- стратегическое управление
- построение отдела продаж
- построение региональных продаж
- стратегический маркетинг
- систематизация бизнеса
- тренинги и обучение
- hr-менеджмент
расположенном на странице моего сайта (https://prodvizeniye.ru/price_list_management_cons...), задать цвет шрифта строчки меню, соответствующий той странице, на которой пользователь находится в данный момент. Для облегчения навигации пользователей по страницам прайс-листа сайта.

Сайт на WordPress + используется всем известный сайт-билдер «Elementor»

Из наиболее подходящих опций настроек непосредственно списка меню доступны только настройки динамических тегов на базе JetEngine (от разработчика Crocoblock):
- Кастомное поле
- Term Field
- Option
- User Field
- Dynamic Function
- Query Results Count

Из опций настроек всего блока меню доступны:
1. CSS ID
2. CSS классы
3. Пользовательские CSS, с добавлением своих собственных настроек
4. Изменение атрибутов, с ключами и значениями атрибутов

Answer 1

[Wispik]

// HEADER 
const urlPath = window.location.pathname
document.querySelectorAll('.header__menu a').forEach(a => {
  if (a.href.endsWith(urlPath)) {
      a.classList.add('header__menu-item-active')
  }
})

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

Answer 2

[Refguser]

Насколько я вижу класс li активной страницы соответствует current-menu-ancestor
Т,е. как-то так

.menu-item.menu-item-type-custom.menu-item-object-custom.current-menu-ancestor.current-menu-parent.menu-item-has-children{
	background: red;
}