Гайды на BBCode туллбар

---

📋 Содержание гайда

1. Основы форматирования текста
2. Выравнивание текста
3. Работа с цветами, размерами и шрифтами
4. Цитаты и блоки кода
5. Спойлеры и карточки
6. Ссылки и изображения
7. YouTube видео
8. Списки и специальные элементы
9. Прогресс-бары
10. Кастомные стили и продвинутые фишки

---

1. Основы форматирования текста ✨

Начнем с самого простого - базового форматирования текста. Эти теги помогут сделать твой текст более выразительным и читаемым!

Жирный текст
Тег `[b]` делает текст жирным и привлекает к нему внимание:

[b]Этот текст будет жирным![/b]

Результат:
Этот текст будет жирным!

Курсив
Тег `[i]` делает текст наклонным и элегантным:

[i]А этот текст станет курсивным и красивым[/i]

Результат:
А этот текст станет курсивным и красивым

Подчеркивание
Тег `[u]` подчеркивает текст снизу:

[u]Важная информация будет подчеркнута[/u]

Результат:
Важная информация будет подчеркнута

Зачеркивание
Тег `[s]` перечеркивает текст посередине:

[s]Эта информация больше не актуальна[/s]

Результат:
Эта информация больше не актуальна

Комбинирование стилей
Можно вкладывать теги друг в друга! Главное - закрывать их в правильном порядке:

[b][i][u]Супер стильный текст со всеми эффектами![/u][/i][/b]

Результат:
Супер стильный текст со всеми эффектами!

---

2. Выравнивание текста 📐

Правильное выравнивание делает твой пост более структурированным и приятным для чтения.

Центрирование
Тег `[center]` размещает текст по центру страницы:

[center]Этот текст будет в самом центре![/center]

Результат:


Выравнивание по левому краю
Тег `[left]` прижимает текст к левому краю:

[left]Текст прижат к левому краю[/left]

Результат:


Выравнивание по правому краю
Тег `[right]` размещает текст у правого края:

[right]А этот текст справа[/right]

Результат:


Выравнивание по ширине
Тег `[justify]` растягивает текст по всей ширине:

[justify]Этот длинный текст будет выровнен по ширине и займет всю доступную область, создавая ровные края с обеих сторон.[/justify]

Результат:

---

3. Работа с цветами, размерами и шрифтами 🌈

Здесь начинается настоящая магия! Ты можешь полностью изменить внешний вид своего текста.

Цвета
Тег `[color]` окрашивает текст в любой цвет! Можно использовать названия цветов или HEX-коды:

[color=red]Красный текст[/color]
[color=blue]Синий текст[/color]
[color=#ff6b35]Оранжевый текст (HEX-код)[/color]

Результат:
Красный текст
Синий текст
Оранжевый текст (HEX-код)

Размеры шрифта
Тег `[size]` изменяет размер текста в пикселях или других единицах:

[size=10px]Маленький текст[/size]
[size=16px]Обычный размер[/size]
[size=24px]Большой заголовок[/size]

Результат:
Маленький текст
Обычный размер
Большой заголовок

Шрифты
Тег `[font]` меняет семейство шрифтов:

[font=Arial]Текст шрифтом Arial[/font]
[font=Georgia]Элегантный шрифт Georgia[/font]
[font=monospace]Моноширинный шрифт для кода[/font]

Результат:
Текст шрифтом Arial
Элегантный шрифт Georgia
Моноширинный шрифт для кода

Комбо-удар!
Соединим все вместе:

[center][size=20px][color=#ff6b35][font=Georgia][b]🔥 ЭПИЧНЫЙ ЗАГОЛОВОК! 🔥[/b][/font][/color][/size][/center]

Результат:

---

4. Цитаты и блоки кода 💬

Цитаты и код нужно оформлять по-особому, чтобы они выделялись и были читаемыми.

Цитаты без автора
Простой тег `[quote]` создает красивую цитату с рамкой:

[quote]
Это важная цитата, которая привлечет внимание читателей!
[/quote]

Результат:

Это важная цитата, которая привлечет внимание читателей!

Цитаты с автором
Добавь автора цитаты после знака равенства:

[quote=Стив Джобс]
Инновации отличают лидера от последователя.
[/quote]

Результат:

Стив Джобс
Инновации отличают лидера от последователя.

Блоки кода
Тег `[code]` создает специальное оформление для кода (НЕ защищает от парсинга, только стилизует):

[code]
/give @p minecraft:diamond 64
/tp @p 100 70 200
/gamemode creative
[/code]

Результат:

/give @p minecraft:diamond 64
/tp @p 100 70 200
/gamemode creative

---

5. Спойлеры и карточки 📦

Спойлеры и карточки помогают организовать информацию и сделать посты более интерактивными.

Простой спойлер
Тег `[spoiler]` прячет текст за кнопку:

[spoiler]
Секретная информация, которую увидят только самые любопытные!
[/spoiler]

Результат:

Спойлер

Секретная информация, которую увидят только самые любопытные!

Спойлер с кастомным заголовком
Добавь свой заголовок к спойлеру:

[spoiler=🎁 Нажми для сюрприза!]
Поздравляю! Ты нашел секретный текст! 🎉
Теперь ты знаешь, как работают спойлеры!
[/spoiler]

Результат:

Спойлер

Поздравляю! Ты нашел секретный текст! 🎉
Теперь ты знаешь, как работают спойлеры!

Карточки
Тег `[card]` создает красивую рамку для информации:

[card title="💡 Полезный совет"]
Всегда сохраняй важные данные перед экспериментами!
Это поможет избежать потери прогресса.
[/card]

Результат:

---

6. Ссылки и изображения 🖼️

Ссылки и картинки оживляют твой пост!

Простые ссылки
Тег `[url]` создает кликабельную ссылку:

[url=https://lu-mora.ru]Официальный сайт LumoraSMP[/url]

Результат:
Официальный сайт LumoraSMP

Ссылки с автоматическим текстом:

[url=https://lu-mora.ru][/url]

Результат:


Изображения:

Лично я вам не советую использовать заготовленный тег из тулбара. Я и сам не докю конца понимаю как он работает, поэтому советую использовать загрузчик изображений ниже

---

7. YouTube видео 📺

Тег `[youtube]` встраивает видео с YouTube прямо в твой пост:

[youtube]https://www.youtube.com/watch?v=dQw4w9WgXcQ[/youtube]

[youtube]https://youtu.be/dQw4w9WgXcQ[/youtube]

[youtube]dQw4w9WgXcQ[/youtube]

Результат:

---

8. Списки и специальные элементы 📝

Списки помогают структурировать информацию, а специальные элементы добавляют профессиональности.

Маркированные списки
Тег `[list]` создает список с точками, каждый пункт начинается с `[*]`:

[list]
[*]Первый пункт списка
[*]Второй пункт с важной информацией
[*]Третий пункт для завершения
[/list]

Результат:

• Первый пункт списка
  
• Второй пункт с важной информацией
  
• Третий пункт для завершения
  

Верхний и нижний индекс
Теги `[sub]` и `[sup]` создают маленький текст снизу или сверху:

H[sub]2[/sub]O - вода
E=mc[sup]2[/sup] - знаменитая формула

Результат:
H₂O - вода
E=mc² - знаменитая формула

Клавиши
Тег `[kbd]` оформляет текст как клавиши на клавиатуре:

Нажми [kbd]Ctrl[/kbd] + [kbd]C[/kbd] для копирования
Используй [kbd]F3[/kbd] для отладочной информации

Результат:
Нажми Ctrl + C для копирования
Используй F3 для отладочной информации

Выделение маркером
Тег `[mark]` подсвечивает текст желтым цветом:

Это [mark]очень важная информация[/mark], не пропусти!

Результат:
Это очень важная информация, не пропусти!

Горизонтальная линия
Тег `[hr]` создает красивую разделительную линию:

Первая часть текста
[hr]
Вторая часть после разделителя

Результат:
Первая часть текста

---

Вторая часть после разделителя

---

9. Прогресс-бары 📊

Прогресс-бары показывают выполнение задач в красивом графическом виде!

Простой прогресс-бар
Базовая версия с автоматическим цветом:

[progress]75[/progress]

Результат:


Цветной прогресс-бар
Добавь `color=` для изменения цвета:

[progress color="green"]85[/progress]
[progress color="red"]25[/progress]
[progress color="blue"]60[/progress]

Результат:




Прогресс-бар с HEX цветом
Используй точные HEX-коды для уникальных цветов:

[progress color="#ff6b35"]90[/progress]
[progress color="#9b59b6"]45[/progress]

Результат:



Прогресс-бар с текстом
Добавь `text=` для описания прогресса:

[progress text="Строительство базы" color="blue"]72[/progress]
[progress text="Изучение редстоуна" color="red"]38[/progress]

Результат:

---

10. Кастомные стили и продвинутые фишки 🚀

Для самых продвинутых пользователей у нас есть особые возможности!

Кастомные Tailwind классы
Тег `[cls]` позволяет использовать CSS-классы напрямую:

[cls class="bg-gradient-to-r from-purple-500 to-pink-500 text-white p-4 rounded-lg shadow-lg"]
Текст с градиентным фоном и тенями!
[/cls]

Результат:

---

---

---