Удалите двойное меню в мобильном режиме и оставьте только одно меню.

Вопрос или проблема

На мобильной версии следующего сайта www.plotterpro.com/newsite появляется двойное меню введите описание изображения здесь. Я пытался его скрыть, но оно просто не уходит.

Меню можно удалить следующими методами:

  1. CSS – display:none;
  2. Проверьте в разделе меню WordPress, отметили ли вы несколько меню
  3. Измените файл functions.php и удалите меню

.

Ответ или решение

Для решения проблемы с дублирующимся меню в мобильном представлении на сайте www.plotterpro.com/newsite, предлагаю следовать поэтапно трем методам, представленным ниже. Обратите внимание, что эти шаги требуют некоторых технических знаний в области веб-разработки и управления платформой WordPress.

1. Использование CSS для скрытия дублирующегося меню

Если вы хотите убрать одно из меню с помощью CSS, выполните следующие действия:

  • Зайдите в административную панель WordPress.
  • Перейдите в раздел «Внешний вид» -> «Настроить» -> «Дополнительные стили CSS».
  • Вставьте следующий код:
/* Скрытие второго меню на мобильной версии */
@media (max-width: 768px) {
    .your-second-menu-class {
        display: none !important;
    }
}

Замените .your-second-menu-class на фактический класс второго меню. Вы можете использовать инструменты разработчика в браузере (например, Chrome DevTools) для нахождения правильного селектора.

Этот метод прост, однако он не решает основную проблему с дублированием меню на уровне структуры.

2. Проверка настроек меню в WordPress

Иногда дублирование меню может быть вызвано настройками самой платформы WordPress. Чтобы проверить это:

  • Войдите в админку WordPress.
  • Перейдите в раздел «Внешний вид» -> «Меню».
  • Убедитесь, что у вас создано только одно активное меню для мобильного отображения. Иногда может быть выбрано несколько меню для одного положения. Убедитесь, что на мобильном устройстве используется только одно меню.

Если у вас несколько меню, удалите лишние или измените настройки отображения для правильного функционирования.

3. Модификация файла functions.php

Если предыдущие методы неэффективны или если вы хотите настроить отображение меню глубже, можно добавить пользовательский код в файл functions.php вашей темы. Выполните следующие шаги:

  • Откройте файл functions.php вашей активной темы (не забудьте создать резервную копию файла, прежде чем вносить изменения).
  • Добавьте следующий код:
function remove_duplicate_menu() {
    if (wp_is_mobile()) {
        remove_menu('your_menu_slug');
    }
}
add_action('init', 'remove_duplicate_menu');

Замените 'your_menu_slug' на "slug" вашего дублирующегося меню. Этот код будет проверять, если пользователь просматривает сайт с мобильного устройства, и удалять указанное меню.

Заключение

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

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

Оцените материал
Добавить комментарий

Капча загружается...