Як у WordPress видалити порожнє посилання у меню з адресою #

Привіт:) У цьому пості покажу, як повністю прибрати порожнє посилання (з символом ґратки) у пунктах WordPress-меню.

Зазвичай така ситуація виникає, коли:

• ви створюєте пункт меню без сторінки, просто як "заголовок" для підменю;
• у шаблоні або темі за замовчуванням уставляється атрибут href="#" для елементів навігації.

Проблема в тому, що клік по такому пункту змушує сторінку прокручуватись нагору. Це незручно для користувачів і може негативно вплинути на юзабіліті.

Вирішення через functions.php

Найпростіший спосіб — замінити посилання із символом ґратки на "чистий" тег без атрибуту href.

Відкрийте файл functions.php вашої теми та додайте код:

add_filter( 'wp_nav_menu_items', function ( $menu ) {
    return str_replace( '<a href="#"', '<a', $menu );
});

Цей код проходить по всьому HTML меню і замінює <a href="#"> на звичайний <a>. Таким чином у вашому меню залишиться клікабельний елемент, але без посилання.

Альтернативний спосіб: через CSS

Якщо ви хочете зберегти структуру, але вимкнути дію посилання, можна використати CSS:

.menu-item a[href="#"] {
  pointer-events: none;
  cursor: default;
}

У цьому випадку клік на елемент із href="#" не працюватиме. Мінус у тому, що сам HTML-код залишиться, і пошукові системи можуть вважати це "порожнім посиланням".

Що краще?

• PHP-рішення — чистіше, бо прибирає сам атрибут href="#".
• CSS-рішення — швидше в застосуванні, якщо ви не хочете лізти у код теми.