Студія меню: створення меню перетягуванням

Menu studio (Baza Helper > Menu studio) це візуальний редактор меню сайту. Він працює з будь-якою темою. Baza Theme виводить меню власною розміткою шапки, а будь-яка інша тема може вивести його шорткодом, викликом PHP або блоком.

Створення меню

• Додавайте пункти й перетягуйте їх на полотні. Перетягніть пункт на іншу картку, щоб вкласти його, або змініть порядок, опустивши біля краю.
• Виділяйте кілька пунктів одночасно, масштабуйте полотно й користуйтеся мінікартою.
• Користуйтеся скасуванням і поверненням дій та починайте із шаблонів.
• Натисніть На весь екран, щоб отримати більше полотно. Esc або та сама кнопка виходить із нього.

Панель пункту

Виберіть пункт, щоб редагувати його. Дії є кнопками-значками: додати дочірній, дублювати, вгору, вниз і видалити. Поля йдуть по два в рядку.

• Назви різними мовами: до трьох мов показуються як мітки в рядку підпису, а більше перетворюють підпис на перемикач. Картки на полотні показують крапки для заповнених мов.
• Іконка, класи й атрибути (акордеон): значок (немає, вставлений SVG із живим переглядом або зображення з бібліотеки), його положення, класи CSS пункту й посилання, HTML id, заголовок, мітка ARIA, значення rel, нова вкладка та власні атрибути data-* і aria-*.
• Поля перевіряються під час введення: ідентифікатори CSS, унікальний id і дозволені атрибути. Хибне значення пояснюється й не зберігається. SVG, який санітайзер не може відновити, відхиляється з поясненням.

Редактор також попереджає про биті посилання й відсутні переклади. Мітки на панелі інструментів показують числа.

Мега-панелі

Пункт може відкривати мега-панель з 1–4 стовпцями. Панель складається з блоків: текст, зображення, група посилань і зали (послуги календаря бронювання, якщо його встановлено).

Кілька меню та місць

• Скористайтеся панеллю над полотном, щоб перемикати меню, Нове меню, Перейменувати і Видалити. Головне меню існує завжди й не видаляється. Меню може бути 30.
• Де показати перелічує місця меню теми прапорцями. Позначене місце виводить це меню там, де тема запитує це місце.
• Імпортувати меню WordPress перетворює меню, створене в розділі Вигляд > Меню, на меню студії. Меню WordPress залишається недоторканим. Коли відкрите меню студії порожнє, а на сайті є меню WordPress, панель імпорту з’являється сама.

Показ меню на сайті

[baza_menu id="main" class="my-nav" label="Main menu"]

 'main', 'class' => 'my-nav', 'label' => 'Main menu' ) ); ?>

Без id використовується головне меню. Результат це nav із вкладеними списками, справжні кнопки для мега-панелей, гамбургер на малих екранах і підтримка клавіатури (Esc, ArrowDown). Для блокових тем є блок Baza menu (baza-helper/menu) у розділі Вигляд > Редактор, а меню вибирається на бічній панелі. CSS і JavaScript завантажуються лише на сторінках, що виводять меню. Кольори й розміри це змінні CSS, що починаються з --baza-menu-.

Мови

Мови беруться з WPML, Polylang або TranslatePress, а інакше з власного налаштування мови сайту та cookie мови.

Збереження

Зберігайте панеллю сторінки або Ctrl+S. Для збереження потрібен дозвіл edit_theme_options. Меню очищується під час збереження: невідомі типи пунктів відкидаються, залишаються лише безпечні класи й атрибути.