Различия

Здесь показаны различия между двумя версиями данной страницы.

@@ Строка 1: / Строка 1: @@
+====== Налаштування меню домену ======
+У блок-меню в розділі "Дизайн" треба скопіювати:
+<code>
+<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>
+</code>
+===== Налаштування кнопок у меню =====
+Кнопки перераховані у розділі **items**, один рядок - одна кнопка.
+Перші дві кнопки видно завжди.
+Кнопка Профіль додається автоматично.
+==== Посилання на сторінки домену ====
+Наприклад, сторінку із запитаннями, які часто ставляться - треба заповнити самостійно. Можна вказати інший id, якщо потрібно декілька таких сторінок.
+<code>
+  {name: 'F.A.Q.', url:'page.php?id=faq'},
+</code>
+==== Посилання на зовнішні сторінки ====
+Наприклад, посилання на telegram-чат або канал із **target:'_blank'** - означає, що треба відкривати у новій вкладці.
+<code>
+  {name: 'TELEGRAM', url:'https://t.me/qeng_authors', target:'_blank'},
+</code>
+===== Налаштування класів =====
+Можна міняти набір класів у рядку:
+<code>
+classes: 'navbar-expand-lg navbar-light bg-light mb-2',
+</code>
+Класи зазначаються через пробіл.
+==== Авто-згортання тулбару ====
+Для того, щоб на широких екранах було видно всі кнопки, можна додати **один із цих класів**:
+  * **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**.
+Ось так можна додати картинку:
+<code>
+  logo: '<img style="height:36px;" class="mr-3" src="https://qeng.org/apple-touch-icon.png"></img>',
+</code>