Налаштування меню домену [wiki.qeng.org]

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
====== Налаштування меню домену ======

У блок-меню в розділі "Дизайн" треба скопіювати:

<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**, один рядок - одна кнопка.

Перші дві кнопки видно завжди.

Кнопка Профіль додається автоматично.

===== Локалізація кнопок у меню =====
Переклад для кнопок буде застосовано, якщо у блок-меню в розділі "Дизайн" **зверху** додати:
<code>
<script>
// English (en)
addTranslation('en', 'АВТОРАМ', 'ABOUT');
addTranslation('en', 'ТЕСТ ДВИЖКА', 'EXAMPLES');
addTranslation('en', 'РЕЙТИНГ АВТОРОВ', 'BEST AUTHORS');
addTranslation('en', 'РЕЙТИНГ ДОМЕНОВ', 'BEST DOMAINS');
addTranslation('en', 'СТАТИСТИКА', 'STATS');

// Ukrainian (uk)
addTranslation('uk', 'АВТОРАМ', 'АВТОРАМ');
addTranslation('uk', 'СТАТИСТИКА', 'СТАТИСТИКА');
addTranslation('uk', 'ТЕСТ ДВИЖКА', 'ТЕСТ ДВИГУНА'); 
addTranslation('uk', 'РЕЙТИНГ АВТОРОВ', 'РЕЙТИНГ АВТОРІВ');
addTranslation('uk', 'РЕЙТИНГ ДОМЕНОВ', 'РЕЙТИНГ ДОМЕНІВ');
</script>
</code>

==== Посилання на сторінки домену ====

Наприклад, сторінку із запитаннями, які часто ставляться - треба заповнити самостійно. Можна вказати інший 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>