pikabox

Итак, не будем расписывать долгие вступления, как это делают «долбанные «гуру» коих сейчас развелось не мало в нееерезиновом».
Задача:
Сделать один из пунктов в меню WP не кликабельным, и чтобы при клике не было перезагрузки страницы.
Идеи: Как у любого ленивого человека, сразу появляется желание сделать кастомное меню, и вставить вместо ссылки http://#. (большинство примеров в сети так и делают) Но нет, нам надо наоборот избавится от href в теге <a>, иначе будет переадресация на главную/текущую или в левых шаблонах просто будет открытие новой пустой страницы.
Как сделать:
Для решения вопроса рассмотрим пример

pikabox.com.ua некликабельный пункт меню в wordpress
1. Основной пункт меню, который раскрывает в себе остальные, является страницей где ранее была информация, но в данный момент нам необходимо, чтобы пользователь при нажимании на этот пункт никуда не попадал, а видел развернутый список.
2.Подпункт который содержит в себе перечень, и в данный момент не несет смысла его тоже необходимо сделать некликабельным.
Далее смотрим через любую софтину типа Firebug в код, нам интересно значение класса menu-item у тега <li>, которым представлено меню.

pikajq1

Для пункта 1, оно равно 28.

Далее идем в файл header.php и перед закрывающим тегом </head> вставляем следующий код:

<script type=»text/javascript»>
jQuery(function($) {
$(«li.menu-item-28»).children(«a»).attr(‘href’, «javascript:void(0)»);
});
</script>

Конечно можно сейчас возмутиться и сказать, что такое же можно прописать и в поле для ввода адреса ссылки, в панели редактирования пунктов меню, но нет: не везде так прокатывает, шаблоны разные и люди тоже.

Для другого пункта делаем все точно так же, или добавляем в код еще строку с id для этого пункта:
$(«li.menu-item-50»).children(«a»).attr(‘href’, «javascript:void(0)»);

Таким же не хитрым образом можно сделать все ссылки высшего уровня некликабельными:

<script type=»text/javascript»>
jQuery(function($) {
$(«li.page-item»).children(«a»).attr(‘href’, «javascript:void(0)»); });
</script>
Обрати внимание в темах по дефолту Ты можешь встретится со значением page-item

Как это работает:
JQuery (JavaScript фреймворк) используется, чтобы заменить значение href из формата HTML(<a href=»index.php»> … </a>) в значение javascript:void(0)
Далее код выбирает элемент li с значением $(«li.menu-item-28»). В этом случае число 28 — это номер элемента меню, который мы хотим, привести к нулевой ссылке.
Следующим важным моментом является функция children, которая выбирает всех непосредственных наследователей с тегом <а> — children(«a»).
После этого производим замену href на пустое значение линка attr(‘href’, «javascript:void(0)»)
Это превращает ссылку на нашу страницу в пустоту, теперь она никуда не направляет нас.

Конечно тебе никто не мешает играться с .removeAttr(‘href’); вместо .attr(‘href’, «javascript:void(0)»), но это уже твоя личная история…