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

Question

[Сергей Бурдужа]

Добрый день.
Есть сайт на wordpress https://euconsult.md/ru/
Меню одноуровневое.
Я уже подсветил активный пункт меню, стилизовал класс current-menu-item.
Но, у меня есть другая задача.
Когда нахожусь на страницу финансирования, если выберу элемент и перейду к нему, то пункт меню финансирования должен быть активным.

Я понимаю, что можно реализовать, если добавить пункты подменю, и задать родителю класс current-menu-active.

Но, у меня есть еще пункт меню новости, а если их будет 100шт, всех в меню не добавишь))

Подскажите какое-нибудь решение.
Я бы связал это с историей браузером.

Заранее благодарен за подсказку.

Comments

[BATPYIIIKOB]

Можно анализировать URL
https://euconsult.md/ru/finance/finantari-pentru-zootehnie/
и условие: если https://euconsult.md/ru/finance/ и т.д.. то подсвечивать Финанасы и т.д. для всех пунктов

[BATPYIIIKOB]

Для новостей придётся поменять URL
Основной:
https://euconsult.md/ru/category/news/

И отдельные новости
https://euconsult.md/ru/category/news/TramPampam

[Сергей Бурдужа]

Евгений Прозоров, то есть, настроить все вручную?
Я думал как-то автоматизировать.

[BATPYIIIKOB]

Сергей Бурдужа, с историей браузера сомневаюсь, что решение верное. По автоматизации не подскажу (с WP не работаю).

Подскажите какое-нибудь решение.

- подсказал :)
Не понимаю, почему новости лежат в категориях, и каждая новость выводится отдельным урлом - без привязки к родителю (news), хотя финансирование работает как надо

[BATPYIIIKOB]

Да и URI финансирования тоже хромают

https://euconsult.md/ru/finantari-nerambursabile/ ???
https://euconsult.md/ru/finance/finantari-pentru-producere/

Правильнее:

https://euconsult.md/ru/finance/
https://euconsult.md/ru/finance/finantari-pentru-producere/

Хотя зависит от ваших целей. Может для мегаСЕО оптимизации :). В чём сильно сомневаюсь... лишь усложняет

[BATPYIIIKOB]

Если все пункты привести в порядок, то проблем не будет с подсветкой и выявление родителя "каталога меню"

[Сергей Бурдужа]

Евгений Прозоров, Все сделал,

let mainMenuActiveElemOfSubMenu = function () {
		let url = location.href;
		let finance = 'finance';
		let news = 'news';
		let idea = 'idea';

		if(url.includes(finance)) {
			$('#js-main-menu li:nth-child(4)').addClass('current-menu-item');
		}

		if(url.includes(news)) {
			$('#js-main-menu li:nth-child(7)').addClass('current-menu-item');
		}

		if(url.includes(idea)) {
			$('#js-main-menu li:nth-child(6)').addClass('current-menu-item');
		}
	};
	mainMenuActiveElemOfSubMenu();

Спасибо вам за пинок.

Можете переответить, чтобы сделать ваш ответ отмеченный.
Столько каламбура))

[BATPYIIIKOB]

Сергей Бурдужа, Не понял где что переответить, ну да бог с ним, если помог то и хорошо :)

[Сергей Бурдужа]

Евгений Прозоров, Я задал тут на форуме вопрос. Вы внизу переответитьте, чтобы сделать ваш ответ отмеченным. За это вы получите очки, а я закрою вопрос. Я же не могу сам на него ответить?

Answer 1

[BATPYIIIKOB]

Можно анализировать URL
https://euconsult.md/ru/finance/finantari-pentru-z...
и условие: если https://euconsult.md/ru/finance/ и т.д.. то подсвечивать Финанасы и т.д. для всех пунктов

Для новостей придётся поменять URL
Основной:
https://euconsult.md/ru/category/news/

И отдельные новости
https://euconsult.md/ru/category/news/TramPampam

Сергей Бурдужа, с историей браузера сомневаюсь, что решение верное. По автоматизации не подскажу (с WP не работаю).
Подскажите какое-нибудь решение.- подсказал :)
Не понимаю, почему новости лежат в категориях, и каждая новость выводится отдельным урлом - без привязки к родителю (news)

Да и URI финансирования тоже хромают
https://euconsult.md/ru/finantari-nerambursabile/ ???
https://euconsult.md/ru/finance/finantari-pentru-p...

Правильнее:
https://euconsult.md/ru/finance/
https://euconsult.md/ru/finance/finantari-pentru-p...

Если все пункты привести в порядок, то проблем не будет с подсветкой и выявление родителя "каталога меню"

Comments

[Сергей Бурдужа]

Спасибо.