Различия
Здесь показаны различия между двумя версиями данной страницы.
Предыдущая версия справа и слева Предыдущая версия Следующая версия | Предыдущая версия | ||
domain_menu [2021/08/17 10:41] admin |
domain_menu [2021/10/19 13:00] phaust удалено |
||
---|---|---|---|
Строка 1: | Строка 1: | ||
====== Настройка меню домена ====== | ====== Настройка меню домена ====== | ||
- | В блок меню в разделе Дизайн надо прописать: | + | В блок меню в разделе Дизайн надо скопировать: |
<code> | <code> | ||
Строка 11: | Строка 10: | ||
classes: 'navbar-expand-lg navbar-light bg-light mb-2', | classes: 'navbar-expand-lg navbar-light bg-light mb-2', | ||
items: [ | items: [ | ||
- | {name: 'АВТОРАМ', url:'authors.php'}, | + | // Новые кнопки добавлять в этот список |
- | {name: 'ТЕСТ ДВИЖКА', url:'index.php?'}, | + | {name: 'ИГРЫ', url:'index.php'}, |
- | {name: 'WIKI', url:'https://wiki.qeng.org', target: '_blank'}, | + | {name: 'АРХИВ', url:'archive.php'}, |
- | {name: 'СТАТИСТИКА', url:'qeng_stats.php'}, | + | {name: 'РЕЙТИНГ', url:'ratings.php'}, |
], | ], | ||
username: '!username!', | username: '!username!', | ||
Строка 20: | Строка 19: | ||
</script> | </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> | </code> |