Инструкция :: Как применять BB-коды для форматирования сообщения

Инструкция по использованию BB-кодов.

Различные мануалы, инструкции, видео и прочая документация по работе сайта.

dimassamid
Аватара пользователя
dimassamid
Admin
Admin
Сообщения: 3702
Стаж: 11 лет 5 месяцев
Настоящее имя: Dmitry
Откуда: Estonia, Tallinn
Благодарил (а): 2010 раз
Поблагодарили: 10206 раз
Возраст: 36
Estonia

Сообщение dimassamid » 

Инструкция :: Как применять BB-коды для форматирования сообщения.


BBCode (от англ. bulletin board code) — это специальные коды (теги) для оформления (форматирования) вашего сообщения, которые используются на форумах. С помощью тегов вы можете не только изменить вид вашего текста, но и также добавлять дополнительные элементы, такие как изображения, спойлеры, вкладки и т.д.
Существуют как базовые BB-коды, которые одинаково используются практически на любом сайте, так и специальные, созданные администратором форума для специфических задач.



Например, для выделения текста жирным используется BB-код [b][/b]. То есть, чтобы сделать текст жирным, нужно вставить текст между этими двумя тегами:

Пример:
[b]Текст вашего сообщения[/b]

Результат:
Текст вашего сообщения

Обратите внимание, что два этих тега отличаются.
Первый [b] - открывающий
Второй [/b] - закрывающий (с дополнительной косой чертой внутри скобок)
Открывающий тег задаёт, когда текст должен начать форматироваться (в нашем случае становиться жирным).
Закрывающий тег задаёт, когда форматирование текста должно завершиться (в нашем случае, когда текст должен перестать быть жирным). У закрывающего тега всегда косая черта в скобках.


В данной теме я хотел бы рассказать какие BB-коды есть на нашем форуме и как их можно использовать.




1. Простые теги: жирный, наклонный, подчёркнутый



[b] — жирный текст (от англ. bold)

Пример:
[b]Текст вашего сообщения[/b]

Результат:
Текст вашего сообщения



[i] — наклонный текст (от англ. italic)

Пример:
[i]Текст вашего сообщения[/i]

Результат:
Текст вашего сообщения



[u] — подчёркнутый текст (от англ. underline)

Пример:
[u]Текст вашего сообщения[/u]

Результат:
Текст вашего сообщения



Вы можете комбинировать несколько разных тегов, но обязательно проверйяте, чтобы один тег всегда был вложен в другой. Т.е. должно быть так:

[тег1][тег2][тег3]Текст вашего сообщения[/тег3][/тег2][/тег1]

Обратите внимание, что тег3 находится внутри тег2, а тот в свою очередь внутри тег1

Давайте попробуем скомбинировать сразу 3 тега - жирный, наклонный, подчёркнутый:

Пример:
[b][i][u]Текст вашего сообщения[/u][/i][/b]

Результат:
Текст вашего сообщения





2. Шрифт:

[font] — шрифт (от англ. font)

Данный тег считается уже чуть более сложным по той причине, что ему задаётся параметр после знака равенства.

[тег1=параметр]Текст вашего сообщения[/тег1]

Поскольку шрифтов может быть несколько, чтобы не создавать отдельный тег на каждый шрифт, мы указываем название шрифта в качестве параметра тегу [font]. Без параметра данный тег не работает.

Пример:
[font=Comic Sans MS]Текст вашего сообщения[/font]

Результат:
Текст вашего сообщения





3. Размер шрифта:

[size] — размер шрифта

По аналогии с предыдущим тегом, размер шрифта задаётся в качестве параметра и указывается не в пикселях, а в процентах.

Пример:
[size=160]Текст вашего сообщения[/size]

Результат:

Текст вашего сообщения

Шрифт нельзя установить менее 70% и более 200%. Это сделано для того, чтобы сообщения выглядели читабельно.




4. Цвет шрифта:

[color] — цвет шрифта

Цвет шрифта задаётся тегу в качестве параметра в форме шестнадцатеричного кода.

Пример:
[color=#FF0000]Текст вашего сообщения[/color]

Результат:
Текст вашего сообщения

Если вам недостаточно цветов, представленных на панели инструментов, то вы всегда можете подобрать нужный цвет с помощью палитры цветов, например, на этом сайте: https://colorpicker.me/. Шестнадцатеричный код можно скопировать из графы "Hex code".





5. Ссылка


[url] — ссылка на страницу (от англ. Uniform Resource Locator)

Наш форум умеет распознавать и обрабатывать ссылки без каких-либо тегов. Однако, бывают случаи, когда данный тег нужно применить. Например, вы размещаете ссылку на видео в youtube и не хотите, чтобы форум преобразовывал эту ссылку в видео. В таком случае, воспользуйтесь тегом [url], чтобы форум отобразил этот URL-адрес именно как ссылку (т.е. в виде текста), а не как видео.

Пример:
[url]https://www.youtube.com/watch?v=IRUzTOCQHGQ[/url]

Результат:
https://www.youtube.com/watch?v=IRUzTOCQHGQ

Также вы можете указать название этой ссылке. Для этого внутри тега должно содержаться ваше название, а URL-адрес нужно указать в качестве параметра.

Пример:
[url=https://www.youtube.com/watch?v=IRUzTOCQHGQ]Интересное видео[/url]

Результат:
Интересное видео
Изображение
dimassamid
Аватара пользователя
dimassamid
Admin
Admin
Сообщения: 3702
Стаж: 11 лет 5 месяцев
Настоящее имя: Dmitry
Откуда: Estonia, Tallinn
Благодарил (а): 2010 раз
Поблагодарили: 10206 раз
Возраст: 36
Estonia

Re: Инструкция :: Как применять BB-коды для форматирования сообщения

Сообщение dimassamid » 

6. Изображение


[img] — изображение (от англ. image)

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

Пример:
Давайте скопируем ссылку на наш логотип и разместим его в сообщении.
Кликаем правой кнопкой мыши по изображению и выбираем "Копировать ссылку на изображение".



Вставляем ссылку в тег [img]

[img]https://spacesynth.ru/styles/cosmic/theme/images/logo_site.png[/img]

Результат:
Изображение

Для удобочитаемости все изображения отображаются с шириной не более 400 пикселей. Для того, чтобы посмотреть изображение в полном размере, кликнинте по нему.

Мы рекомендуем загружать все изображения на наш сайт и не пользоваться никакими хостингами картинок. Для этого, в окне сообщения выберите "Вложения → Добавить файлы".



Затем скопируйте ссылку на это изображение.



Теперь вы можете использовать скопированную ссылку в комбинации с тегом [img], чтобы разместить это изображение в вашем сообщении.





7. Миниатюра


[thumbnail] — миниатюра

Данный тег точно также как и [img] используется для преобразования ссылки на изображение в само изображение. Разница только лишь в том, что при отображении картинки её ширина будет ограничена не 400 пикселями, а уже 200 пикселями, что придаст сообщению ещё большей компактности. Это удобно, если вы размещаете сразу много изображений подряд.

Пример:
[thumbnail]https://spacesynth.ru/styles/cosmic/theme/images/logo_site.png[/thumbnail]

Результат:
Изображение




8. Цитата


[quote] — цитата

Данный тег используется для выделения цитируемого текста в специальную рамку.

Пример:
[quote]Цитируемый текст, написанный другим человеком[/quote]

Результат:
Цитируемый текст, написанный другим человеком


Вы также можете указать автора цитаты в качестве параметра. Например, это может быть имя или никнейм. Оно будет указано сверху над цитируемым текстом.

Пример:
[quote=Иванов Иван Иванович]Цитируемый текст, написанный другим человеком[/quote]

Результат:
Иванов Иван Иванович писал(а):Цитируемый текст, написанный другим человеком


Если вы хотите процитировать чьё-то сообщение с нашего форума, то проще всего сделать это так. Выделите необходимую часть текста и кликните на кнопку цитаты или на надпись "Вставить цитату в окно ответа".



В таком случае, в качестве параметра тегу будет присовено не только имя автора, но и другая техническая информация, благодаря которой в цитате дополнительно появится ссылка на цитируемое сообщение, а также время сообщения.



Кроме того, автор цитаты получит уведомление о том, что вы его процитировали.






9. Код


[code] — код

Данный тег позволяет показать ваш текст в первозданном виде, без форматирования и с сохранением всех символов как есть, включая множественные пробелы, табуляцию и т.д. Текст внутри тега отображается моноширинным шрифтом (с фиксированной шириной каждого символа), что позволяет ровно располагать его в строках.
Это можно сравнить с блокнотом Windows.

Пример:
Я составил таблицу с альбомами Laserdance в блокноте


Если я просто размещу этот текст на форуме, то он будет выглядеть вот так:


|---------------------------------------------|
| Альбом Год выпуска |
| |
| Future Generation 1987 |
| Around The Planet 1988 |
| Discovery Trip 1989 |
| Changing Times 1990 |
| Ambiente 1991 |
| Technological Mind 1992 |
| Hypermagic 1993 |
| Fire On Earth 1994 |
| The Guardian Of Forever 1995 |
| Strikes Back 2000 |
| Force Of Order 2016 |
| Trans Space Express 2018 |
| Mission Hyperdrive 2024 |
|---------------------------------------------|

Как видите, все лишние пробелы в строках были "съедены", а шрифт стал обычным, не моноширинным.

А вот как этот текст будет выглядеть, если мы воспользуемся тегом [code].

Результат:

Код: Выделить всё

|---------------------------------------------|
|          Альбом           Год выпуска       |
|                                             |
|    Future Generation         1987           |
|    Around The Planet         1988           |
|    Discovery Trip            1989           |
|    Changing Times            1990           |
|    Ambiente                  1991           |
|    Technological Mind        1992           |
|    Hypermagic                1993           |
|    Fire On Earth             1994           |
|    The Guardian Of Forever   1995           |
|    Strikes Back              2000           |
|    Force Of Order            2016           |
|    Trans Space Express       2018           |
|    Mission Hyperdrive        2024           |
|---------------------------------------------|
Не смотря на то, что в рамках нашего форума данный тег не особо востребован, тем не менее, с помощью него можно размещать, например, логи из какой-нибудь программы. Пример применения здесь.




10. Маркированный список


[list] — маркированный список

Данный тег позволит отделить каждый элемент вашего списка и обозначить его специальным графическим символом (маркером).

Пример:
[list]
[*]Элемент 1
[*]Элемент 2
[*]Элемент 3
[/list]

Результат:
  • Элемент 1
  • Элемент 2
  • Элемент 3

Как вы заметили выше, перед началом каждого нового элемента его необходимо помечать звёздочкой в квадратных скобках [*]. Этот тег называется "Элемент списка" и тоже находится на панеле кнопок.



Обратите внимание, что у него нет закрывающего тега, только открывающий.

[list] и [*] всегда используются вместе. Один никогда не применяется без другого.

В качестве параметра тегу [list] можно дополнительно задать тип маркировки: нумерованный или буквенный. Для отображения списка в нумерованном виде (1,2,3...) добавьте в качестве параметра "1".

Пример:
[list=1]
[*]Элемент 1
[*]Элемент 2
[*]Элемент 3
[/list]

Результат:
  1. Элемент 1
  2. Элемент 2
  3. Элемент 3

Для отображения списка в буквенном виде (a,b,c...) добавьте в качестве параметра "a".

Пример:
[list=a]
[*]Элемент 1
[*]Элемент 2
[*]Элемент 3
[/list]

Результат:
  1. Элемент 1
  2. Элемент 2
  3. Элемент 3
Изображение
dimassamid
Аватара пользователя
dimassamid
Admin
Admin
Сообщения: 3702
Стаж: 11 лет 5 месяцев
Настоящее имя: Dmitry
Откуда: Estonia, Tallinn
Благодарил (а): 2010 раз
Поблагодарили: 10206 раз
Возраст: 36
Estonia

Re: Инструкция :: Как применять BB-коды для форматирования сообщения

Сообщение dimassamid » 

11. Выравнивание


[align] — выравнивание

С помощью данного тега можно выровнить содержимое: fa-align-left по левому краю, fa-align-right по правому краю, fa-align-center по центру, fa-align-justify по ширине. Способ выравнивания задаётся в качестве параметра. Без параметра данный тег не работает. По умолчанию, при нажатии на кнопку, в качестве параметра выставляется "center", но вы можете его изменить.

Для выравнивания по левому краю добавьте параметр "left".

Пример:
[align=left]SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.[/align]

Результат:
SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.




По сути, текст в сообщениях и так выровнен по левому краю, поэтому использовать "left" не имеет смысла.
Для выравнивания по правому краю добавьте параметр "right".

Пример:
[align=right]SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.[/align]

Результат:
SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.




Для выравнивания по центру добавьте параметр "center".

Пример:
[align=center]SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.[/align]

Результат:
SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.




Для выравнивания по ширине добавьте параметр "justify". При выравнивании текста по ширине между словами добавляется пространство, чтобы оба края каждой строки были выровнены относительно обоих полей.

Пример:
[align=justify]SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.[/align]

Результат:
SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.




Выравнивать можно не только текст, но и любое содержимое, включая изображения, видео и т.д.





12. Обтекание


[float] — обтекание

Данный тег выравнивает содержимое по правому или левому краям, но в отличие от предыдущего тега позволяет сделать выравниваемый контент обтекаемым. Это означает, что другие элементы будут располагаться с противоположной стороны от него (как бы обтекать его), а не переноситься на новую строку.
Способ выравнивания задаётся в качестве параметра. Без параметра данный тег не работает. По умолчанию, при нажатии на кнопку, в качестве параметра выставляется "right", но вы можете его изменить на "left" при необходимости.

Работу тега проще всего продемонстрировать на примере изображения.

Пример:
[float=right][thumbnail]https://spacesynth.ru/styles/cosmic/theme/images/welcome_logo.png[/thumbnail][/float]
SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.
SpaceSynth.Ru - это международное русскоязычное сообщество, объединяющее поклонников и авторов SpaceSynth музыки из разных стран. Сайт был открыт 1-го февраля 2015-го года. Целями проекта являются: продвижение и популяризация стиля, каталогизация информации (статьи, интервью, дискографии), предоставление площадки для дискуссий по теме стиля, освещение свежих музыкальных новостей, а также помощь в выпуске новых альбомов и сборников.
Большинство страничек сайта работают в формате форума, в том числе и каталог дискографий. Это даёт возможность каждому участнику добавлять информацию самостоятельно, а также комментировать её, участвуя тем самым в дискуссиях.

Результат:
Изображение

SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.
SpaceSynth.Ru - это международное русскоязычное сообщество, объединяющее поклонников и авторов SpaceSynth музыки из разных стран. Сайт был открыт 1-го февраля 2015-го года. Целями проекта являются: продвижение и популяризация стиля, каталогизация информации (статьи, интервью, дискографии), предоставление площадки для дискуссий по теме стиля, освещение свежих музыкальных новостей, а также помощь в выпуске новых альбомов и сборников.
Большинство страничек сайта работают в формате форума, в том числе и каталог дискографий. Это даёт возможность каждому участнику добавлять информацию самостоятельно, а также комментировать её, участвуя тем самым в дискуссиях.




В примере выше изображение выровнено по правому краю, а текст его обтекает слева.
Выровнить можно сразу несколько изображений.

Пример:
[float=right]
[thumbnail]https://spacesynth.ru/styles/cosmic/theme/images/welcome_logo.png[/thumbnail]
[thumbnail]https://spacesynth.ru/styles/cosmic/theme/images/logo_site.png[/thumbnail]
[/float]
SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.
SpaceSynth.Ru - это международное русскоязычное сообщество, объединяющее поклонников и авторов SpaceSynth музыки из разных стран. Сайт был открыт 1-го февраля 2015-го года. Целями проекта являются: продвижение и популяризация стиля, каталогизация информации (статьи, интервью, дискографии), предоставление площадки для дискуссий по теме стиля, освещение свежих музыкальных новостей, а также помощь в выпуске новых альбомов и сборников.
Большинство страничек сайта работают в формате форума, в том числе и каталог дискографий. Это даёт возможность каждому участнику добавлять информацию самостоятельно, а также комментировать её, участвуя тем самым в дискуссиях.

Результат:
Изображение
Изображение

SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.
SpaceSynth.Ru - это международное русскоязычное сообщество, объединяющее поклонников и авторов SpaceSynth музыки из разных стран. Сайт был открыт 1-го февраля 2015-го года. Целями проекта являются: продвижение и популяризация стиля, каталогизация информации (статьи, интервью, дискографии), предоставление площадки для дискуссий по теме стиля, освещение свежих музыкальных новостей, а также помощь в выпуске новых альбомов и сборников.
Большинство страничек сайта работают в формате форума, в том числе и каталог дискографий. Это даёт возможность каждому участнику добавлять информацию самостоятельно, а также комментировать её, участвуя тем самым в дискуссиях.




Пример такого использования здесь. Тут сразу две картинки выровнены по правому краю с обтеканием текста слева.

Для выравнивания по левому краю поменяйте параметр с "right" на "left".

Пример:
[float=left]
[thumbnail]https://spacesynth.ru/styles/cosmic/theme/images/welcome_logo.png[/thumbnail]
[thumbnail]https://spacesynth.ru/styles/cosmic/theme/images/logo_site.png[/thumbnail]
[/float]
SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.
SpaceSynth.Ru - это международное русскоязычное сообщество, объединяющее поклонников и авторов SpaceSynth музыки из разных стран. Сайт был открыт 1-го февраля 2015-го года. Целями проекта являются: продвижение и популяризация стиля, каталогизация информации (статьи, интервью, дискографии), предоставление площадки для дискуссий по теме стиля, освещение свежих музыкальных новостей, а также помощь в выпуске новых альбомов и сборников.
Большинство страничек сайта работают в формате форума, в том числе и каталог дискографий. Это даёт возможность каждому участнику добавлять информацию самостоятельно, а также комментировать её, участвуя тем самым в дискуссиях.

Результат:

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

SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.
SpaceSynth.Ru - это международное русскоязычное сообщество, объединяющее поклонников и авторов SpaceSynth музыки из разных стран. Сайт был открыт 1-го февраля 2015-го года. Целями проекта являются: продвижение и популяризация стиля, каталогизация информации (статьи, интервью, дискографии), предоставление площадки для дискуссий по теме стиля, освещение свежих музыкальных новостей, а также помощь в выпуске новых альбомов и сборников.
Большинство страничек сайта работают в формате форума, в том числе и каталог дискографий. Это даёт возможность каждому участнику добавлять информацию самостоятельно, а также комментировать её, участвуя тем самым в дискуссиях.




Вы можете выровнить одно изображение по правому краю, а другое по левому.

Пример:
[float=left][thumbnail]https://spacesynth.ru/download/file.php?mode=view&id=4818[/thumbnail][/float]
[float=right][thumbnail]https://spacesynth.ru/styles/cosmic/theme/images/welcome_logo.png[/thumbnail][/float]
SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.
SpaceSynth.Ru - это международное русскоязычное сообщество, объединяющее поклонников и авторов SpaceSynth музыки из разных стран. Сайт был открыт 1-го февраля 2015-го года. Целями проекта являются: продвижение и популяризация стиля, каталогизация информации (статьи, интервью, дискографии), предоставление площадки для дискуссий по теме стиля, освещение свежих музыкальных новостей, а также помощь в выпуске новых альбомов и сборников.
Большинство страничек сайта работают в формате форума, в том числе и каталог дискографий. Это даёт возможность каждому участнику добавлять информацию самостоятельно, а также комментировать её, участвуя тем самым в дискуссиях.

Результат:

Изображение
Изображение
SpaceSynth - инструментальная синтезаторная музыка космического направления, с пульсирующей басовой линией и броскими синтезаторными риффами (периодически повторяющимися короткими мелодическими фразами). Первоначальное правильное название стиля - SynthDance, так как вначале он являлся только инструментальной синтезаторно-танцевальной версией Italo-Disco. Но в итоге, под влиянием фантастики, космических оформлений альбомов и названий композиций, стиль стал называться SpaceSynth.
SpaceSynth.Ru - это международное русскоязычное сообщество, объединяющее поклонников и авторов SpaceSynth музыки из разных стран. Сайт был открыт 1-го февраля 2015-го года. Целями проекта являются: продвижение и популяризация стиля, каталогизация информации (статьи, интервью, дискографии), предоставление площадки для дискуссий по теме стиля, освещение свежих музыкальных новостей, а также помощь в выпуске новых альбомов и сборников.
Большинство страничек сайта работают в формате форума, в том числе и каталог дискографий. Это даёт возможность каждому участнику добавлять информацию самостоятельно, а также комментировать её, участвуя тем самым в дискуссиях.




Наглядный пример использования здесь. Часть изображений там выровнены по правому краю, часть по левому, а текст их обтекает посередине.





13. Отступ


[tab] — отступ текста вправо

Данный тег позволяет начать абзац с красной строки, добавив отступ. Ширину отступа необходимо задать в качестве параметра в пикселях. Без параметра данный тег не работает.

Пример:
[tab=20]Текст вашего сообщения[/tab]

Результат:
Текст вашего сообщения

Пример:
[tab=60]Текст вашего сообщения[/tab]

Результат:
Текст вашего сообщения





14. Скрытый текст (спойлер)


[spoil] — скрытый текст

Данный тег позволяет скрыть элементы вашего сообщения и отобразить их только после нажатия на кнопку "показать". Скрыть можно как какую-то объёмную информацию (чтобы сообщение выглядело более компактно), так и, например, какое-нибудь впечатление об альбоме, которое вы не хотите явно показывать, дабы не раскрывать подробности тем, кто ещё не послушал.
Тег часто используется на нашем форуме, поэтому в особом представлении не нуждается.

Пример:
[spoil]Что-то, что вы хотите скрыть[/spoil]

Результат:
► Показать
Изображение
dimassamid
Аватара пользователя
dimassamid
Admin
Admin
Сообщения: 3702
Стаж: 11 лет 5 месяцев
Настоящее имя: Dmitry
Откуда: Estonia, Tallinn
Благодарил (а): 2010 раз
Поблагодарили: 10206 раз
Возраст: 36
Estonia

Re: Инструкция :: Как применять BB-коды для форматирования сообщения

Сообщение dimassamid » 

15. Вкладки


С помощью вкладок можно удобно упорядочивать громоздкое содержимое. Основное место применения - каталог дискографий, где вкладки уже стали стандартом, однако вы можете использовать их где угодно. Пример применения в сообщениях здесь.

Для создания вкладок используется два тега:
[tabmenu] — группа вкладок. Тег отвечает за группировку вкладок, которые находятся внутри него.
[tabs] — вкладка. Тег отвечает за создание самой вкладки.

Пример:
[tabmenu]
[tabs=Первая вкладка]Содержимое первой вкладки[/tabs]
[tabs=Вторая вкладка]Содержимое второй вкладки[/tabs]
[tabs=Третья вкладка]Содержимое третьей вкладки[/tabs]
[/tabmenu]

Результат:

Первая вкладка

Содержимое первой вкладки

Вторая вкладка

Содержимое второй вкладки

Третья вкладка

Содержимое третьей вкладки


Особенности:
  • Оба тега работают вместе, один никогда не применяется без другого.
  • [tabs] всегда должен находиться внутри [tabmenu]
  • [tabmenu] может содержать внутри себя множество [tabs]
  • Название каждой вкладки задаётся тегу [tabs] в качестве параметра. Параметр указывать обязательно.
  • При загрузки страницы самая первая вкладка в группе всегда активна и отображается в раскрытом виде.
  • Количество вкладок в группе неограничено, но для удобочитаемости поста не рекомендуется делать их слишком много. Вместо этого лучше создать несколько групп с вкладками или использовать их в сочетании со спойлером.
  • Если вкладки не вмещаются на странице по ширине (например, в мобильной версии), то у заголовков появляется горизонтальный скролл, с помощью которого их можно прокручивать. Ниже скриншот из телефона, где можно его увидеть.





16. Горизонтальная линия


[hr] — горизонтальная линия (от англ. horizontal line)

Тег устанавливает горизонтальную линию после текста и добавляет перенос строки. Иногда линию разумно использовать, чтобы отделить разные части сообщения по смыслу и/или содержимому.

Пример:
[hr]Текст вашего сообщения[/hr]

Результат:

Текст вашего сообщения


Сам текст при этом внутри тега писать не обязательно.

Пример:
[hr][/hr]

Результат:





Иногда горизонтальную линию имеет смысл применить, когда нужно перейти на новую строку, минуя всё предыдущее содержимое сообщения.

Пример:
[float=right][thumbnail]https://spacesynth.ru/styles/cosmic/theme/images/welcome_logo.png[/thumbnail][/float]
Этот текст обтекает изображение.
[hr][/hr]
А этот текст, написанный послее линии, уже нет.

Результат:
Изображение

Этот текст обтекает изображение.



А этот текст, написанный послее линии, уже нет.



Как видите, линия не обтекает изображение и переходит на новую строку уже после него.





17. Иконка Font Awesome


[fa] — иконка из коллекции шрифта Font Awesome.

Для вставки иконки в сообщение кликните на кнопку и выберите подходящую иконку.
Подробная расширенная инструкция по использованию этого тега находится здесь.

Пример:
[fa]rocket[/fa]

Результат:
fa-rocket





18. Зачёркнутый текст


[s] — зачёркнутый текст (от англ. strike)

Пример:
[s]Текст вашего сообщения[/s]

Результат:
Текст вашего сообщения





19. Верхний и нижний индексы


[sup] — отображение текста в виде верхнего индекса (от англ. superscript)
[sub] — отображение текста в виде нижнего индекса (от англ. subscript)

Пример:
20 м[sup]2[/sup]

Результат:
20 м2

Пример:
H[sub]2[/sub]O

Результат:
H2O


Теги можно комбинировать и вкладывать друг в друга.

Пример:
e[sub]x[sub]2[/sub][/sub]

Результат:
ex2

Пример:
y[sup]x[sub]n[/sub]+1[/sup]

Результат:
yxn+1





20. Теги для привлечения внимания
Следующие теги созданы для выделения вашего текста с целью привлечения внимания. Пожалуйста, не злоупотребляйте ими и используйте их в крайне дозированном количестве, чтобы сообщение не выглядело токсичным. Выделяйте только действительно важные слова, а не весь пост целиком.



[fade] — мигающий текст

Пример:
[fade]Текст вашего сообщения[/fade]

Результат:
Текст вашего сообщения




[highlight] — выделение маркером
Цвет задаётся в качестве параметра. Можно указать в форме шестнадцатеричного кода.

Пример:
[highlight=#FFFFBF]Текст вашего сообщения[/highlight]

Результат:
Текст вашего сообщения




[glow] — светящийся текст
Цвет задаётся в качестве параметра. Можно указать в форме шестнадцатеричного кода.

Пример:
[glow=red]Текст вашего сообщения[/glow]

Результат:
Текст вашего сообщения




[shadow] — размытая тень
Цвет задаётся в качестве параметра. Можно указать в форме шестнадцатеричного кода.

Пример:
[shadow=blue]Текст вашего сообщения[/shadow]

Результат:
Текст вашего сообщения




[blur] — размытый текст
Цвет задаётся в качестве параметра. Можно указать в форме шестнадцатеричного кода.

Пример:
[blur=blue]Текст вашего сообщения[/blur]

Результат:
Текст вашего сообщения





21. Таблица


Таблицу можно создать в специальном формате с помощью пунктирных линий и символа вертикальной черты. BB-коды для этого не используются.
Инструкция по созданию таблиц находится здесь.





22. Вспомогательные кнопки


На панели инструментов представлены также дополнительные кнопки:

— копирование выделенного текста (аналог Ctrl+C на клавиатуре).
— вставка скопированного текста (аналог Ctrl+V на клавиатуре).
— очистка выделенного текста от всех bb-кодов.







Остались вопросы? Не стесняйтесь - задавайте.
Изображение

Вернуться в «Документация по форуму»