Руководство по использованию BBCode

Вступление

Что такое BBCode?

BBCode — это специальный вариант HTML. Сможете ли вы использовать BBCode в ваших сообщениях или нет, определяется администратором форумов. Кроме того, вы сможете отключить использование BBCode в конкретном сообщении при его размещении. Сам BBCode по стилю похож на HTML, теги заключены в квадратные скобки [ и ], а не в < и >; он даёт больше возможностей управления тем, как выводятся данные.

Тег (англ. tag ярлык, этикетка, бирка; метить) ключевое слово, метка для категоризации чего-либо. Используется для поиска какой-либо информации или для форматирования текста. Это элемент языка разметки гипертекста (например в XML, HTML).
При использовании некоторых шаблонов вы сможете добавлять BBCode в ваши сообщения, пользуясь простым интерфейсом, расположенным над полем для ввода текста. Но даже в этом случае данное руководство может оказаться полезным.

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

Вернуться наверх

Можно ли комбинировать теги?
Да, конечно можно. Например, для формирования жирного текста большого размера красного цвета можно использовать следующую конструкцию:
Образец Результат
[size=200][color=red][b]ТЕСТ[/b][/color][/size] ТЕСТ
Не рекомендуется выводить таким образом длинные тексты. Учтите, что вы, автор сообщения, должны позаботиться о том, чтобы теги были правильно вло-жены друг в друга, иначе их комбинация не даст результата. Вот этот BBCode, например, неправилен: [b][u]Это неверно[/b][/u].
Правильно и не правильно
Вернуться наверх

Форматирование текста

Как выделить текст: жирный, наклонный, подчёркнутый, зачеркнутый
BBCode включает теги для быстрого изменения стиля шрифта, сделать это можно следующими способами:
  • Чтобы сделать текст жирным, заключите его в [b][/b],
  • Для подчёркивания используйте [u][/u],
  • Курсив делается тегами [i][/i],
  • Для зачеркнутого текста используйте [s][/s].
BBCode Образец Результат
[b][/b] [b]Привет[/b] Привет
[u][/u] [u]Доброе утро[/u] Доброе утро
[i][/i] [i]курсив![/i] курсив!
[s][/s] [s]Зачеркнутый текст[/s] Зачеркнутый текст
Вернуться наверх

Как изменить цвет или размер текста
Для изменения цвета или размера шрифта могут быть использованы следующие теги (окончательный вид будет зависеть от системы и браузера пользователя):
  • Цвет текста можно изменить, окружив его [color=][/color]. Вы можете указать либо известное имя цвета (red, blue, yellow и т.п.), или шестнадцатиричное представление, например #FFFFFF, #000000.
  • Изменение размера достигается аналогичным образом при использовании [size=][/size]. Этот тег зависит от используемых шаблонов, рекомендуемый формат — число, показывающее размер текста в процентах, от 20% (очень маленький) до 200% и даже 300% (очень большой) от размера по умолчанию.
BBCode Образец Результат
[color=][/color] [color=red]Привет![/color] Привет!
[color=][/color] [color=#FF0000]Привет![/color] Привет!
[size=][/size] [size=30]МАЛЕНЬКИЙ[/size] МАЛЕНЬКИЙ
[size=][/size] [size=200]ОГРОМНЫЙ![/size] ОГРОМНЫЙ!
Вернуться наверх

Создание маркированного и нумерованного списков
BBCode поддерживает два вида списков: маркированные и нумерованные. Они практически идентичны своим эквивалентам из HTML.
  • В маркированном списке все элементы выводятся последовательно, каждый отмечается символом-маркером. Для создания маркированного списка используйте [list][/list] и определите каждый элемент при помощи [*].
  • Второй тип списка, нумерованный, позволяет выбрать, что именно будет выводиться перед каждым элементом. Для создания нумерованного списка используйте [list=1][/list] или [list=a][/list] (где а – латинская) для создания алфавитного списка. Как и в случае маркированного списка, элементы определяются с помощью [*].
BBCode Образец Результат
[list][/list] [list]
[*]Красный
[*]Синий
[*]Жёлтый
[/list]
  • Красный
  • Синий
  • Жёлтый
[list=1][/list] [list=1]
[*]Красный
[*]Синий
[*]Желтый
[/list]
  1. Красный
  2. Синий
  3. Желтый
[list=a][/list] [list=a]
[*]Красный
[*]Синий
[*]Желтый
[/list]
  1. Красный
  2. Синий
  3. Желтый
Вернуться наверх

Добавление подстрочных и надстрочных знаков

Для создания надстрочных и подстрочных символов предназначены следующие теги:

  • Для подстрочного знака используется тег [sub][/sub]
  • Для надстрочного знака используется тег [sup][/sup]
BBCode Образец Результат
[sub][/sub] H[sub]2[/sub]O H2O
[sup][/sup] x[sup]3[/sup] x3
Вернуться наверх

Изменение шрифта
Для изменения шрифта используют тег [font=название шрифта]текст[/font], например: [font=Georgia]Georgia шрифт[/font]
Список наиболее распространенных шрифтов: Arial, Courier New, Comic Sans MS, Georgia, Sans-serif, Tahoma, Times New Roman, Verdana.
BBCode Образец Результат
[font=][/font] [font=Georgia]Текст пример[/font] Текст пример
[font=][/font] [font=Sans-serif]Текст пример[/font] Текст пример
[font=][/font] [font=Comic Sans MS]Текст пример[/font] Текст пример
Вернуться наверх

Выравнивание объектов
Для выравнивания текста, изображений, вложений и других объектов используются 4 специальных тега:
  • Выравнивание по центру [center][/center]
  • Выравнивание по левому краю [left][/left]
  • Выравнивание по правому краю [right][/right]
  • Выравнивание по ширине (выравнивание по левому и правому краю, за счет добавления дополнительных интервалов между словами) [justify][/justify]
BBCode Образец Результат
[center][/center] [center]Для выравнивания текста, изображений, вложений и других объектов используются 4 специальных тега[/center]
Для выравнивания текста, изображений, вложений и других объектов используются 4 специальных тега
[left][/left] [left]Для выравнивания текста, изображений, вложений и других объектов используются 4 специальных тега[/left]
Для выравнивания текста, изображений, вложений и других объектов используются 4 специальных тега
[right][/right] [right]Для выравнивания текста, изображений, вложений и других объектов используются 4 специальных тега[/right]
Для выравнивания текста, изображений, вложений и других объектов используются 4 специальных тега
[justify][/justify] [justify]Для выравнивания текста, изображений, вложений и других объектов используются 4 специальных тега[/justify]
Для выравнивания текста, изображений, вложений и других объектов используются 4 специальных тега
Вернуться наверх

Вставка горизонтальной линии в сообщение
Для разделения текста на смысловые блоки можно использовать горизонтальную линию: [hr]Подсказка горизонтальной линии при наведении мыши (опционально)[/hr]
BBCode Образец Результат
[hr][/hr] Текст текст [hr][/hr] текст текст Текст текст
текст текст
Вернуться наверх

Создание ссылок

Ссылки на другой сайт
В BBCode поддерживается несколько способов создания ссылок.
  • Первый из них использует тег [url=][/url], после знака = должен идти нужная ссылка. Учтите, что ссылка будет открываться в том же или в новом окне, в зависимости от настроек браузера пользователя.
  • Если вы хотите, чтобы в качестве текста ссылки показывался сам URL, необходимо использовать тег [url][/url], а между тегами указать нужную ссылку.
  • Кроме того, конференция поддерживает возможность, называемую Автоматические ссылки, это переведёт любой синтаксически правильную текст в ссылку без необходимости указания тегов и даже префикса http://. Например, ввод www.bmstu.ru в ваше сообщение автоматически преобразует в ссылку http://www.bmstu.ru при просмотре сообщения.
  • То же самое относится и к адресам email, вы можете либо указать адрес в явном виде, используя тег [email][/email] или просто ввести test@test.ru в ваше сообщение, и он будет автоматически преобразован при просмотре.
  • Чтобы быстро сделать из слова ссылку на Википедию (свободную энциклопедию), достаточно использовать тег [wiki][/wiki]. Главное, чтобы это слово было в базе энциклопедии.
  • Как и со всеми прочими тегами BBCode, вы можете заключать в теги [url=][/url] любые другие теги, например [img][/img] (см. следующий пункт), [b][/b] и т. д. Как и с тегами форматирования, правильная вложенность тегов зависит от вас.
BBCode Образец Результат
[url=][/url] [url=http://www.bmstu.ru/]Посетите МГТУ[/url] Посетите МГТУ
[url][/url] [url]http:// www.bmstu.ru/[/url] http://www.bmstu.ru
[email][/email] [email]test@test.ru[/email] test@test.ru
[wiki][/wiki] [wiki]текст[/wiki] текст
Вернуться наверх

Показ изображений в сообщениях

Добавление изображения в сообщение

BBCode включает тег для добавления изображения с внешних серверов, например с хостингов фотографий, в ваше сообщение. Для вывода изображения вы должны окружить его тегами [img][/img]. Учтите, что изображение в этом случае будет выводиться в масштабе 1:1 и если её размер будет слишком большим, то изображение не впишется в текст сообщения.

Как указано в «Создание ссылок», вы можете заключить изображение в теги [url][/url], чтобы картинка стала ссылкой.

Для того, чтобы масштабировать изображение необходимо использовать тег [hsimg=Максимальный_размер_в_пикселях=Подпись_изображения]Ссылка на изображение[/hsimg], где Максимальный_размер_в_пикселях – это цифра определяющая размер изображения, по наиболее длинной стороне, Подпись_изображения – Любой текст, описывающий изображенный объект, который будет расположен под изображением. Учтите, что такое изображение уже по умолчанию обтекается текстом слева, поэтому нет смысла использовать теги [left][/left] и [right][/right] для изображения. Учтите, что в отличие от изображений, сохраняемых на локальном сервере, для внешних изображений не создаются миниатюрные копии для ускорения разгрузки, поэтому такие изображения будут загружаться целиком и, если они большие, то процесс может занять длительное время.

При нажатии на данное изображение, он будет увеличено до 100% размера или вписано в экран.

Так же можно создать галерею изображений (упрощенный пример):
[hsimg][/hsimg][hsimg][/hsimg]…[hsimg][/hsimg]

BBCode Образец Результат
[img][/img] [img]http://www.google.com/intl/en_ALL/images/logo.gif[/img]
[url=][img][/img][/url] [url=http://www.ibm.bmstu.ru/departments/ibm4/new/][img]http://www.google.ru/intl/en_com/images/logo_plain.png[/img][/url]
[url=][img][/url][/img] [url=http://www.ibm.bmstu.ru/departments/ibm4/new/][img]http://www.ibm.bmstu.ru/departments/ibm4/forum/styles/prosilver/imageset/site_logo.png[/url][/img] Неверно
[hsimg=000=text][/hsimg] [hsimg=200=Логотип]http://www.ibm.bmstu.ru/departments/ibm4/forum/styles/prosilver/imageset/site_logo.png[/hsimg]
Вернуться наверх

Добавление вложений в сообщение

Теперь вложения могут быть помещены в любой части сообщения при помощи нового тега BBCode [attachment=][/attachment], если вложения разрешены администратором конференции, и если вы имеете необходимые права доступа. На странице размещения сообщения находится выпадающий список (соответственно кнопка) для размещения вложений в сообщении.
Если не добавлять [attachment=][/attachment] в сообщение, то вложение будет размещено в конце сообщения.

Панель управления вложениями
Панель управления вложениями.

Список типов вложений определяется администратором конференции. В скором времени будет доступен весь диапазон поддерживаемых форматов: от картинок, документов, до аудио, видео и флеш объектов.
Так же как и в [hsimg][/hsimg], из вложений можно создавать галерею. Вложения даже предпочтительны, т.к. позволяют не зависеть от внешних серверов. Для вложений система автоматически создает миниатюры для ускорения загрузки.

BBCode Образец Результат
[attachment=][/attachment] [attachment=0]текст впишет автоматика[/attachment]
Методические указания_ Основы менеджмента.doc
Документ Word 97-2003
(1.48 Мб) Скачиваний: 88
Вложения
Методические указания_ Основы менеджмента.doc
Документ Word 97-2003
(1.48 Мб) Скачиваний: 88
Вернуться наверх

Добавление флэш (flash, swf) объектов в сообщение

FlashAdobe Flash, или просто Flash называют формат SWF (Shockwave Flash), Adobe Flash Player, Adobe Flash Professional, программу разработки мультимедийного контента для платформы «Adobe Engagement Platform» (такого, как веб-приложения, игры и мультфильмы).
Adobe Flash – среда для создания приложений под Flash платформу (Flash Platform), наряду с ней существуют и другие инструменты (среды): Adobe Flex Builder, Flash Development Tool (FDT), и другие.
Flash одновременно употребляется и как название формата (флеш-фильмы, флеш-ролики) (полное название – Flash Movie), однако формат называется «SWF».
При создании продукта можно использовать медиа, звуковые и графические файлы, можно создавать интерактивные интерфейсы и полноценные веб-приложения с использованием PHP и XML.
Flash-файлы имеют раcширение .swf и просматриваются с помощью собственнического Flash Player, который может быть установлен как плагин для браузера. Распространяется бесплатно через сайт www.adobe.com/ru. Исходные файлы с расширением .fla создаются в среде разработки Adobe Flash, а потом компилируются в понимаемый Flash Player формат – .swf. При добавлении флэш объектов, необходимо знать его размеры (ширина и высота) и его адрес в сети.

Для добавления используется тег [flash=][/flash], а именно: [flash=ширина,высота]ссылка[/flash].

BBCode Образец Результат
[flash=][/flash] [flash=500,270]http://www.ibm.bmstu.ru/map1.swf[/flash]
Вернуться наверх

Добавление видео с YouTube
Если вы знакомы с сервисом YouTube, то для добавления ведео-материалов на конференция необходимо знать ссылку на видео-файл, которая указана рядом справой стороны страницы. Она обычно такого вида: http://www.youtube.com/watch?v=ХХХХХХХХ, где ХХХХХХХХ - уникальный номер. Используемый тег: [youtube]ссылка[/youtube].
BBCode Образец Результат
[youtube][/youtube] [youtube]http://www.youtube.com/watch?v=UASI2UYf9hU[/youtube]
Вернуться наверх

Цитирование и вывод форматированных текстов

Цитирование при ответах
Есть два способа процитировать текст: со ссылкой и без.
  • Когда вы используете кнопку «Цитата» для ответа на сообщение, то его текст добавляется в поле ввода окружённым блоком [quote=""][/quote]. Этот метод позволит вам цитировать со ссылкой на автора, либо на что-то ещё, что вы туда впишете. Помните, вы должны заключить имя в кавычки "", они не могут быть опущены.
  • Второй метод просто позволяет вам что-то процитировать. Для этого вам надо заключить текст в теги [quote][/quote]. При просмотре сообщения будет просто показан текст в блоке цитирования
BBCode Образец Результат
[quote=""][/quote] [quote="Автор"]Текст автора будет здесь[/quote]
Автор писал(а):Текст автора будет здесь
[quote][/quote] [quote]Текст автора будет здесь[/quote]
Текст автора будет здесь
Вернуться наверх

Спрятать материал от незарегистрированных пользователей
Для того, чтобы скрыть часть материала от незарегистрированных пользователей, необходимо заключить эту часть в теги [hide][/hide]. Этот тег позволяет скрыть текст, графику, документы и прочие материалы. Однако, учтите что любой человек, как следствие, может зарегистрироваться в системе, что и требовалось от данной функции, и увидеть результат.
BBCode Образец Результат
[hide][/hide] [hide]текст[/hide] Для зарегистрированных пользователей:
текст

Для незарегистрированных пользователей:
Скрытый текст, только для пользователей.
Вернуться наверх

Вывод кода или форматированного текста
Если вам надо вывести кусок программы или что-то, что должно быть выведено шрифтом фиксированной ширины (Courier), вы должны заключить текст в теги [code][/code]. Всё форматирование, используемое внутри тегов [code][/code] будет сохранено.
BBCode Образец Результат
[code][/code] [code]echo "This is some code";[/code]
Код: Выделить всё
echo "This is some code";
Вернуться наверх

Добавление спойлера в сообщение
Спойлер – это скрытая часть сообщения, открываемое щелчком мыши. Используется для скрытия различных материалов, незначимых по важности, а так же для визуального уменьшения размера сообщения. Внутри спойлера может содержаться любая информация (текст, графика, анимация, другой спойлер и т. д.). Для создания спойлера используется тег [spoiler=][/spoiler] и вложенный спойлер [spoiler2=][/spoiler2].
BBCode Образец Результат
[spoiler=][/spoiler] [spoiler=Здесь скрытое сообщение]Текст, рисунки, ...[/spoiler]
: Здесь скрытое сообщение
[spoiler2=][/spoiler2]

[spoiler=Здесь скрытое сообщение]Текст, рисунки, ...
[spoiler2=Вложенный спойлер]Текст, рисунки[/spoiler2]
[/spoiler]

: Здесь скрытое сообщение
Вернуться наверх

Прочее

Могу ли я добавить собственные теги?
Если вы являетесь администратором этого форума и имеетe достаточные права, то можете добавить новые теги BBCode в администраторском разделе.
Вернуться наверх
cron
Яндекс.Метрика