BBCode

Матеріал з Вікіпедії — вільної енциклопедії.
Перейти до навігації Перейти до пошуку
BBCode
Тип Дошка оголошень
Розробник PhpBB
Операційна система Cross-platform
Доступні мови English
Вебсайт php.net/manual/en/book.bbcode.php

BBCode (абр. від англ. bulletin board code) — мова розмітки, яка використовується для форматування повідомлень на багатьох електронних дошках оголошень (BBS) і форумах. Для форматування тексту використовуються теги, подібні тегам HTML, але, на відміну від них, записані в квадратні дужки [ ]. Перед відображенням сторінки програма форума проводить розбір тексту і перетворення його в HTML-код.

BBCode створений в 1998 році для програми дощок оголошень Ultimate Bulletin Board (UBB), написаному на мові Perl. В 2000 році підтримка BBCode була додана в програму для форумів PhpBB, написаній на мові PHP.

BBCode був придуманий з метою надати простіший, безпечний і обмежений у порівнянні з HTML спосіб форматування повідомлень. Спочатку багато BBS дозволяли користувачам використовувати HTML-розмітку, що могло призвести до побічних ефектів, таких як спотворення розмітки на сторінці, запуск JavaScript-сценаріїв (іноді з метою вандалізму). Деякі реалізації BBCode, які використовують спрощені методи трансляції в HTML, також можуть відчувати проблеми з безпекою.

Хоча основні теги BBCode мало відрізняються, у більшості інтернет-форумах існує велика кількість варіацій. Деякі реалізації чутливі до регістру символів всередині тегів, інші дозволяють підсвічувати текст HTML, PHP, SQL та інших мов розмітки і мову програмування за допомогою спеціальних тегів.


Теги BBCode[ред. | ред. код]

У наступній таблиці перераховані теги BBCode, які використовуються на більшості сучасних форумах, а також еквівалентний HTML-код. Варто помітити, що з допомогою CSS зовнішній вид HTML може бути змінений і може відрізнятися на різних сайтах. На багатьох форумах опублікований список питань, які часто ставлять, і відповідей з описом застосування реалізації BBCode.

Опис Код на BBCode Код на HTML Результат
Введення тексту напівжирним шрифтом
[b]Текст[/b]
<b>Текст</b>,
<strong>Текст</strong>
або
<span style="font-weight: bold;">Текст</span>

Рекомендується використовувати тег <strong>.

Текст
Введення тексту курсивним шрифтом
[i]Текст[/i]
<i>Текст</i>,
<em>Текст</em>
або
<span style="font-style: italic;">Текст</span>

Рекомендується використовувати тег <em>.

Текст
Введення підкресленого тексту
[u]Текст[/u]
<u>Текст</u>,
<ins>Текст</ins>
або
<span style="text-decoration: underline;">Текст</span>

Рекомендується використовувати тег <span>.

Текст
Введення закресленого тексту
[s]Текст[/s]
<s>Текст</s>,
<del>Текст</del>
або
<span style="text-decoration: line-through;">Текст</span>

Рекомендується використовувати тег <del>.

Текст
Застосування кількох тегів
[s][u][b][i]Текст[/i][/b][/u][/s]
<s><u><b><i>Текст</i></b></u></s>
Текст
Вставка посилання із видимим текстом
[url=https://ua.wikipedia.org]Текст[/url]
<a href="https://ua.wikipedia.org">Текст</a>
Текст
Вставка посилання із видимою URL (адресою)
[url]https://ua.wikipedia.org[/url]
<a href="https://ua.wikipedia.org">https://ua.wikipedia.org</a>
https://ua.wikipedia.org
Вставка зображення
[img]https://upload.wikimedia.org/wikipedia/commons/6/63/Wikipedia-logo.png[/img]
<img src="https://upload.wikimedia.org/wikipedia/commons/6/63/Wikipedia-logo.png" alt="" />

Текст, записаний в атрибуті alt, відображається, якщо зображення недоступне.

Wikipedia-logo.png
Вставка посилання у вигляді зображення
[url=https://ua.wikipedia.org][img]https://upload.wikimedia.org/wikipedia/commons/6/63/Wikipedia-logo.png[/img][/url]
<a href="https://ua.wikipedia.org" ><img src="https://upload.wikimedia.org/wikipedia/commons/6/63/Wikipedia-logo.png" alt="" /></a>
Wikipedia-logo.png
Вставка цитати
[quote]Текст цитати[/quote]
[quote="ім'я автора тексту"]Текст цитати[/quote]
<blockquote><p>Текст цитати</p></blockquote>

Може бути реалізовано більш витонченим способом.

Цитата:
Текст цитати
Введення тексту моноширинним шрифтом
[code]Текст[/code]

Часто програми виконують підсвітку синтаксису різних мов.

<pre>Текст</pre>
або
<code style="white-space: pre;">Текст</code>

Рекомендується використовувати тег <code>.

Текст
Введення тексту шрифтом вказаного розміру
[size=15]Текст[/size]
[size="15px"]Текст[/size]

Розмір (висоту) шрифту можна задати без одиниці виміру (будуть використовуватися пікселі (px)), в пікселях (px), в пунктах (pt), відносно даного розміру (слова «small», «medium», «large» та ін.) та ін. (див. опис властивостей CSS font-size).

<span style="font-size: 15px;">Текст</span>
Текст
Введення тексту вказаним кольором
[color=red]Текст[/color]
[color="#ff0000"]Текст[/color]
[style color=#ff0000]Текст[/style]

Колір тексту можна задати по імені або по шістнадцятизначному коді (див. кольори HTML). Деякі програми дозволяють записувати код кольору без символу «#».

<span style="color: #ff0000;">Текст</span>
Текст
Вставка смайлика
:)
[:-)]

Деякі програми дозволяють не записувати символи «[» і «]».

<img src="smile.png" alt=":-)" />
:-)
Вставка списку
[list]
   [*] Пункт 1.
   [*] Пункт 2.
   [*] Пункт 3.
[/list]

Деякі програми дозволяють записувати «*» замість «[*]».

[list]
   * Пункт 1.
   * Пункт 2.
   * Пункт 3.
[/list]

Деякі програми підтримують «[ul]» (англ. unordered list — невпорядкований або маркований список), «[ol]» (англ. ordered list — упорядкований або нумерований список) и «[li]» (англ. list item).

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

[ul]
   [li] Пункт 1. [/li]
   [li] Пункт 2. [/li]
   [li] Пункт 3. [/li]
[/ul]

Нумерований список.

[ol]
   [li] Пункт 1. [/li]
   [li] Пункт 2. [/li]
   [li] Пункт 3. [/li]
[/ol]
Маркований список.
<ul>
   <li> Пункт 1. </li>
   <li> Пункт 2. </li>
   <li> Пункт 3. </li>
</ul>

Нумерований список.

<ol>
   <li> Пункт 1. </li>
   <li> Пункт 2. </li>
   <li> Пункт 3. </li>
</ol>

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

  • Пункт 1.
  • Пункт 2.
  • Пункт 3.

Нумерований список.

  1. Пункт 1.
  2. Пункт 2.
  3. Пункт 3.
Вставка таблиці
[table]
   [tr]
      [td] 1 [/td]
      [td] 2 [/td]
      [td] 3 [/td]
   [/tr]
   [tr]
      [td] 4 [/td]
      [td] 5 [/td]
      [td] 6 [/td]
   [/tr]
   [tr]
      [td] 7 [/td]
      [td] 8 [/td]
      [td] 9 [/td]
   [/tr]
[/table]
<table>
   <tr>
      <td> 1 </td>
      <td> 2 </td>
      <td> 3 </td>
   </tr>
   <tr>
      <td> 4 </td>
      <td> 5 </td>
      <td> 6 </td>
   </tr>
   <tr>
      <td> 7 </td>
      <td> 8 </td>
      <td> 9 </td>
   </tr>
</table>
1 2 3
4 5 6
7 8 9

Посилання[ред. | ред. код]

Онлайн-конвертери[ред. | ред. код]