Документация Сотбит: Розница. Настройки шаблона. Мобильное меню
Раздел настроек предназначен для гибкого управления составом, сортировкой и внешним видом нижнего навигационного меню в мобильной и планшетной версиях шаблона. Инструмент позволяет адаптировать навигацию под особенности вашего бизнеса без привлечения веб-разработчиков.
Рабочий стол > Сотбит > Сотбит: Розница > Настройки > [id сайта]
Настройка нижней навигационной панели выполняется в административной части сайта на вкладке Мобильное меню.
Включение и отключение меню
Вы можете полностью управлять видимостью нижней панели на мобильных устройствах:
- Включить нижнее мобильное меню (1) — главный чекбокс, активирующий или отключающий вывод панели на смартфонах и планшетах.
Удаление всех пунктов — администратор имеет возможность удалить абсолютно все пункты из списка. Если таблица меню пуста, нижняя навигационная панель на мобильной версии сайта автоматически скрывается. Обратите внимание: Если нижняя навигационная панель полностью отключена, пользователи мобильной версии будут перемещаться по сайту стандартными способами — через бургер-меню в шапке сайта, ссылки в футере (подвале) и разделы на самих страницах.
Управление пунктами и сортировка
В решении не накладывается жестких ограничений на редактирование структуры навигации. Любой элемент в таблице может быть изменен, перемещен или безвозвратно удален.
Изменение порядка пунктов (Drag-and-Drop)
Слева от каждой строки расположен маркер перемещения (2) (иконка с вертикальными точками). Чтобы изменить порядок вывода пунктов на мобильном экране:
1. Зажмите маркер левой кнопкой мыши.
2. Перетащите строку вверх или вниз на нужную позицию в таблице.
3. Новое расположение применится на сайте сразу после сохранения настроек.
Восстановление исходных настроек
Если вы случайно удалили важные разделы или хотите вернуть стандартный вид меню, предусмотренный в решении, нажмите кнопку Восстановить по умолчанию (5).
При подтверждении сброса все кастомные пункты, созданные вами вручную, будут безвозвратно удалены. Список вернется к стандартному набору элементов, заложенному в решение.
Копирование логики через типы пунктов
Каждый пункт меню имеет параметр Тип пункта, который определяет его функциональное поведение на сайте. Вы можете выбрать один из предустановленных типов, чтобы скопировать штатную системную логику решения:
- Корзина, Избранное, Сравнение товаров, Заказы — автоматически выводят числовой счетчик количества товаров над иконкой.
- Профиль — реализует динамическую смену контента. Если пользователь не авторизован на сайте, кнопка будет иметь название Войти. После авторизации название автоматически изменится на имя пользователя.
- Ссылка — стандартный переход по указанному URL-адресу без дополнительной динамической логики.
Описание полей настроек
В таблице представлена подробная конфигурация всех выводимых кнопок панели:
|
Поле
|
Описание
|
|
Иконка
|
Изображение элемента. При создании нового пункта ему автоматически присваивается картинка-заглушка. Клик по иконке открывает модальное окно выбора графики.
|
|
Название
|
Текст подписи, отображаемый под иконкой на мобильном экране.
|
|
Ссылка
|
URL-адрес страницы перехода.
|
|
Тип пункта
|
Выпадающий список выбора системного поведения кнопки.
|
|
Активность
|
Чекбокс, отвечающий за вывод кнопки на мобильном экране.
|
|
Текст
|
Флаг, скрывающий или показывающий текстовую подпись под иконкой.
|
|
Счётчик
|
Опция включения/отключения числового индикатора. Выводится только для тех типов пунктов, где технически предусмотрен счетчик (Корзина, Избранное, Сравнение, Заказы). Для типов Ссылка или Профиль эта опция не применяется.
|
|
Удалить
|
Иконка крестика (3) для безвозвратного удаления строки из таблицы настроек.
|
Добавление пунктов и валидация при сохранении
Создание нового пункта:
1. Нажмите кнопку Добавить (4) под таблицей. В конце списка появится новая строка с назначенной по умолчанию иконкой-заглушкой.
2. Кликните на изображение-заглушку, чтобы открыть окно Выбор иконки:
- Чтобы загрузить свой файл, нажмите Добавить файл (1) (поддерживаются форматы BMP, GIF, JPEG, JPG, PNG, SVG, WEBP размером до 2 МБ).
- Чтобы выбрать готовый вариант, кликните по иконке в блоке Системные иконки (2).
- Нажмите кнопку Применить (3).
3. Укажите название пункта в поле Название и ссылку для перехода в поле Ссылка.4. Выберите нужный тип пункта из списка и сохраните изменения кнопкой Сохранить (6).
Ошибки при сохранении
При сохранении настроек система проверяет корректность заполнения полей. Если у созданного пункта не заполнено поле Название или Ссылка, изменения не запишутся в базу данных. При попытке сохранения система выведет предупреждение об ошибке:
Ошибка. Настройки не были сохранены. Не сохранено 1 пункт(ов) меню — укажите название и ссылку.
При обновлении страницы все несохраненные новые строки будут потеряны. Перед сохранением обязательно убедитесь, что все созданные пункты полностью заполнены.
Отображение на мобильных устройствах
Поведение при большом количестве пунктов:
Количество одновременно выводимых кнопок в нижнем ряду ограничено размерами мобильных экранов:
- До 5 активных пунктов включительно — все элементы отображаются в один ряд и равномерно распределяются по ширине панели.
- 6 и более активных пунктов — на панель выводятся только первые 4 элемента из таблицы настроек. Пятым элементом автоматически становится кнопка Ещё с системной иконкой. Остальные активные пункты переносятся во всплывающее меню.
Всплывающая панель Ещё
При нажатии на кнопку Ещё (2) снизу плавно выдвигается дополнительная панель, содержащая все остальные настроенные вами пункты.
Всплывающая панель закрывается при следующих действиях пользователя:
- Нажатие на кнопку закрытия в виде крестика (3).
- Клик по затемненному фону за пределами всплывающего окна.
- Смахивание (свайп) панели вниз за маркер закрытия (2) на расстояние более 30% высоты экрана.
- Поворот экрана мобильного устройства.
Контроль настроек
Вы всегда можете быстро проверить активность мобильного меню и наличие иконок у добавленных пунктов через специальный инструмент Мастер внедрения. Если панель отключена или в ней допущены ошибки заполнения, мастер отобразит соответствующее предупреждение.
