Налаштування меню домену
У блок-меню в розділі «Дизайн» треба скопіювати:
<script> // https://wiki.qeng.org/doku.php?id=domain_menu add_navbar({ classes: 'navbar-expand-lg navbar-light bg-light mb-2', items: [ // Нові кнопки додавати у цей список: {name: 'ІГРИ', url:'index.php'}, {name: 'АРХІВ', url:'archive.php'}, {name: 'РЕЙТИНГ', url:'ratings.php'}, ], langs: {'EN':'en', 'UA':'uk', 'RU':'ru'}, // Вибір мови. Якщо не потрібен, можна видаляти цей рядок. username: '!username!', }); </script>
Налаштування кнопок у меню
Кнопки перераховані у розділі items, один рядок - одна кнопка.
Перші дві кнопки видно завжди.
Кнопка Профіль додається автоматично.
Посилання на сторінки домену
Наприклад, сторінку із запитаннями, які часто ставляться - треба заповнити самостійно. Можна вказати інший id, якщо потрібно декілька таких сторінок.
{name: 'F.A.Q.', url:'page.php?id=faq'},
Посилання на зовнішні сторінки
Наприклад, посилання на telegram-чат або канал із target:'_blank' - означає, що треба відкривати у новій вкладці.
{name: 'TELEGRAM', url:'https://t.me/qeng_authors', target:'_blank'},
Налаштування класів
Можна міняти набір класів у рядку:
classes: 'navbar-expand-lg navbar-light bg-light mb-2',
Класи зазначаються через пробіл.
Авто-згортання тулбару
Для того, щоб на широких екранах було видно всі кнопки, можна додати один із цих класів:
- navbar-expand-xl - всі кнопки на одному рядку, якщо екран ширший за 1200 пікселів.
- navbar-expand-lg - всі кнопки на одному рядку, якщо екран ширший за 992 пікселів.
- navbar-expand-md - всі кнопки на одному рядку, якщо екран ширший за 768 пікселів.
- navbar-expand-sm - всі кнопки на одному рядку, якщо екран ширший за 576 пікселів.
Кольоровий стиль
Для світлого тулбару треба додати класи navbar-light bg-light
Для темного тулбару треба додати класи navbar-dark bg-dark
Відступ під тулбаром
Для відступу під тулбаром треба додати один із класів mb-1 mb-2 mb-3 mb-4 mb-5. Чим більша цифра, тим більший відступ.
Логотип
На тулбар ліворуч можна додати логотип.
Для цього треба додати секцію logo після classes.
Ось так можна додати картинку:
logo: '<img style="height:36px;" class="mr-3" src="https://qeng.org/apple-touch-icon.png"></img>',