Forumowe tagi BBCode

[wilk]

~ Forumowe tagi BBCode ~

Przykłady użycia forumowych bbcode (głównie tych dodanych przeze mnie), które możecie używać do upiększania swoich postów. Jeśli macie zamówienia na jakieś inne, to piszcie poniżej. Jest też kilka niepublicznych tagów np. do tworzenia tabel, których używam do tworzenia rankingów kanałowych, ale ich niepoprawne używanie może popsuć layout forum.

Wielkimi literami oznaczone jest miejsce, w które wstawiamy własny TEKST (może zawierać dowolny ciąg znaków, także inne bbcodes, o ile nie podano w opisie inaczej), LICZBĘ, HEX (liczba w zapisie szesnastkowym), KOLOR (podany jako nazwa koloru lub szesnastkowo np. #112233 lub #0F0), ID (prosty tekst, identyfikator), LINK czy MAIL.

PS. Forum nie potrafi wyświetlić poprawnie zagnieżdżonych takich samych tagów np.

[color=red]test[color=blue]test[/color]test[/color]

. Różne tagi można oczywiście dowolnie umieszczać jeden w drugim jako TEKST.

PS2. Forum automatycznie wstawia znak końca linii dla każdego entera w polu edycji posta, a z racji tego, że niektóre tagi są typu blokowego (czyli same też przy zamknięciu dodają znak końca linii), to w niektórych przypadkach robi się podwójna przerwa. Używajcie podglądu postów, by wyłapać takie niuanse i usuwać zbędne puste linie, jeśli ktoś jest purystą.

PS3. Nie gwarantuję, że wybrane tagi własne nie zostaną kiedyś zlikwidowane lub ich działanie bądź nazwa zawsze pozostaną takie same. W przypadku zmian postaram się jednak utrzymać poprawne działanie w dawnych postach.

---

Tagi własne

• [left], [right], [center], [justify]
• [s]
• [sup], [sub]
• [thumb]
• [shadow]
• [glow]
• [hilight]
• [abbr], [acronym]
• [tooltip]
• [imgc]
• [icode]
• [pre], [tt]
• [indent]

• [spoiler], [cspoiler]
• [hide], [hhide]
• [hr]
• [frac]
• [char]
• [font]
• [meter]
• [flag]
• [audio], [video]
• [youtube]
• [pastebin]
• [search], [ddg], [google], [bing], [yahoo], [yandex]
• [lfloat], [rfloat], [clear]
• [col]

Tagi standardowe

• [b], [i], [u]
• [color]
• [size]
• [img]
• [quote]
• [сode]
• [list]
• [url], [email]

---

Tagi własne

---

Wyrównanie tekstu do lewej krawędzi, do środka, do obu krawędzi, do prawej krawędzi:

Kod: Zaznacz cały

[left]TEKST[/left]
[center]TEKST[/center]
[justify]TEKST[/justify]
[right]TEKST[/right]


Przykład (ramka dodana dla lepszego zobrazowania):

(left) Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare gravida aliquet. Aenean vestibulum mauris vel orci condimentum, nec ultricies eros bibendum. Pellentesque finibus nibh sit amet arcu sagittis feugiat. Aenean nec quam ac justo vulputate accumsan.

(center) Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare gravida aliquet. Aenean vestibulum mauris vel orci condimentum, nec ultricies eros bibendum. Pellentesque finibus nibh sit amet arcu sagittis feugiat. Aenean nec quam ac justo vulputate accumsan.

(justify) Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare gravida aliquet. Aenean vestibulum mauris vel orci condimentum, nec ultricies eros bibendum. Pellentesque finibus nibh sit amet arcu sagittis feugiat. Aenean nec quam ac justo vulputate accumsan.

(right) Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare gravida aliquet. Aenean vestibulum mauris vel orci condimentum, nec ultricies eros bibendum. Pellentesque finibus nibh sit amet arcu sagittis feugiat. Aenean nec quam ac justo vulputate accumsan.

To co powyżej, ale na krótkim tekście:

(left) Lorem ipsum dolor sit amet, consectetur adipiscing elit.

(center) Lorem ipsum dolor sit amet, consectetur adipiscing elit.

(justify) Lorem ipsum dolor sit amet, consectetur adipiscing elit.

(right) Lorem ipsum dolor sit amet, consectetur adipiscing elit.

---

Uzupełnienie trzech głównych formatowań (pogrubienie, kursywa, podkreślenie) — przekreślenie:

Kod: Zaznacz cały

[s]TEKST[/s]

Przykład: tekst przekreślony

---

Indeks górny i dolny (przydatne we wzorach, choć UTF-8 udostępnia specjalne znaki do tego celu np. ²):

Kod: Zaznacz cały

[sup]TEKST[/sup]
[sub]TEKST[/sub]


Przykład: x², H₂O

---

Miniaturka (domyślna do max. 150 pikseli i z możliwością podania maksymalnych wymiarów, wyśrodkowana):

Kod: Zaznacz cały

[thumb]LINK[/thumb]
[thumb=LICZBAxLICZBA]LINK[/thumb]


Przykład: , (64x64)

(powyższy obrazek oryginalnie ma 472×89 pikseli)

---

Kolorowy cień napisu:

Kod: Zaznacz cały

[shadow=KOLOR]TEKST[/shadow]

Przykład: czerwony, zielony, niebieski

---

Kolorowa poświata napisu:

Kod: Zaznacz cały

[glow=KOLOR]TEKST[/glow]

Przykład: czerwona, zielona, niebieska

---

Kolorowe tło tekstu:

Kod: Zaznacz cały

[hilight=KOLOR]TEKST[/hilight]

Przykład: czerwone, zielone, niebieskie

---

Dwa tagi realizujące niemal to samo, różnią się semantycznie — skrót i skrótowiec:

Kod: Zaznacz cały

[abbr=TEKST]TEKST[/abbr]
[acronym=TEKST]TEKST[/acronym]


Przykład: mgr., PAN

---

Tekst w dymku wyświetlanym po najechaniu nań kursorem (np. dodatkowe informacje):

Kod: Zaznacz cały

[tooltip=TEKST]TEKST[/tooltip]

Przykład: Q-punkty

---

Obrazek wyśrodkowany do linii środkowej małych liter (w niektórych zastosowaniach korzystniej wygląda niż domyślny):

Kod: Zaznacz cały

[imgc]LINK[/imgc]

Przykład: ------ (zwykły [IMG])
Przykład: ------ (wyrównany [IMGC])

---

Element do wyróżniania kodu, ale w linii, nie jako blok:

Kod: Zaznacz cały

[icode]TEKST[/icode]

Przykład:

2 + 2 = 4

(w przeciwieństwie do tagu [сode] parsowanie innych bbcode wewnątrz tego tagu nie jest wyłączone)

---

Teletekst — tekst zapisany czcionką o stałej szerokości znaków:

Kod: Zaznacz cały

[tt]TEKST[/tt]

Przykład: tekst o stałej szerokości znaków

(ten tag jest liniowy)

---

Tekst preformatowany — zachowujący białe znaki (spacje, tabulacje) i zapisany czcionką o stałej szerokości znaków:

Kod: Zaznacz cały

[pre]TEKST[/pre]

Przykład:

tekst    <-(4 spacje) zachowujący		<-(2 taby) oryginalne formatowanie

(ten tag jest blokowy)

---

Wcięcie w tekście, akapit:

Kod: Zaznacz cały

[indent]TEKST[/indent]

Przykład:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare gravida aliquet. Aenean vestibulum mauris vel orci condimentum, nec ultricies eros bibendum. Pellentesque finibus nibh sit amet arcu sagittis feugiat. Aenean nec quam ac justo vulputate accumsan.

---

Spoiler rozwijany (stylizowany na cytat i stylizowany na kod):

Kod: Zaznacz cały

[spoiler]TEKST[/spoiler]
[cspoiler]TEKST[/cspoiler]


Przykład:

Tony Stark to Iron Man! lol!

Przykład:

Spoiler: Pokaż

Tony Stark to Iron Man! lol!

---

Tekst ukryty:

Kod: Zaznacz cały

[hide]TEKST[/hide]
[hhide]TEKST[/hhide]


Przykład: to jest tekst ukryty ([HIDE] — ten tekst ujawni się po najechaniu nań kursorem lub po zaznaczeniu)

Przykład: to jest tekst ukryty ([HHIDE] — ten tekst ujawni się tylko po zaznaczeniu)

---

Linia podziału (standardowa lub w kolorze i określonej grubości w pikselach):

Kod: Zaznacz cały

[hr][/hr]
[hr=KOLOR,LICZBA][/hr]


Przykłady:

---

---

---

Pseudo-ułamek (UTF-8 udostępnia kilka gotowych znaków jako ułamki np. ½, ¾, ⅔ — więcej):

Kod: Zaznacz cały

[frac]LICZBA/LICZBA[/frac]

Przykład: ⁵⁄₁₀, ¹⁰⁄₂₅

---

Encje HTML (nazwane, zapisane dziesiętnie lub szesnastkowo):

(tak, przy zapisie w postaci szesnastkowej tam jest „x” pomiędzy „#” i liczbą)

Kod: Zaznacz cały

[char]TEKST[/char]
[char]#LICZBA[/char]
[char]#xHEX[/char]


Przykład: … (hellip), ¥ (yen), € (euro), → (rarr), ⨌ (#10764), ● (#x25cf)

---

Zmiana kroju pisma:

Kod: Zaznacz cały

[font=TEKST]TEKST[/font]

Przykład: Comic Sans MS, Arial, Times New Roman, Courier New, Palatino, Garamond, Verdana, Georgia, Tahoma, Lucida Console, Fixedsys

---

Pasek postępu, wskaźnik:

(liczba oznacza procentowe wypełnienie paska, może być też ułamkiem dziesiętnym np. 55.5 ← zapis z kropką!)

Kod: Zaznacz cały

[meter]LICZBA,MAKSIMUM[/meter]


Przykład:

---

Flaga narodowa:

Kod: Zaznacz cały

[flag]ID[/flag]

Przykład: (pl), (eu), (us), (fr)

---

Odtwarzacz audio:

Kod: Zaznacz cały

[audio]LINK[/audio]

Przykład:

---

Odtwarzacz wideo:

Kod: Zaznacz cały

[video]LINK[/video]

Przykład:

---

Odtwarzacz YouTube:

(identyfikatorem jest podkreślona część linku np. https://www.youtube.com/watch?v=dQw4w9WgXcQ)

Kod: Zaznacz cały

[youtube]ID[/youtube]

Przykład:

---

Wklejka z Pastebin:

(identyfikatorem jest podkreślona część linku np. https://pastebin.com/6F1GCD45)

Kod: Zaznacz cały

[pastebin]ID[/pastebin]

Przykład:

---

Generuje link do wyszukiwania frazy na naszym forum, w Google, DuckDuckGo, Bing, Yahoo! lub Yandex (tagi bing, yahoo i yandex są ukryte):

Kod: Zaznacz cały

[search]TEKST[/search]
[search=AUTOR]TEKST[/search]
[google]TEKST[/google]
[ddg]TEKST[/ddg]
[bing]TEKST[/bing]
[yahoo]TEKST[/yahoo]
[yandex]TEKST[/yandex]


Przykład: QuizPL, QuizPL, QuizPL, QuizPL, QuizPL, QuizPL, QuizPL

---

Opływanie tekstem z lewej, z prawej, eliminacja opływania (tagi ukryte):

Kod: Zaznacz cały

[lfloat]TEKST[/lfloat]
[rfloat]TEKST[/rfloat]
[clear]TEKST[/clear]


Przykład:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare gravida aliquet.

Aenean vestibulum mauris vel orci condimentum, nec ultricies eros bibendum. Pellentesque finibus nibh sit amet arcu sagittis feugiat. Aenean nec quam ac justo vulputate accumsan.

(powyższe trzy tagi są dostępne, ale nie są wyświetlane w edytorze z uwagi na raczej niewielkie zastosowanie dla forumowiczy)

---

Podział na łamy (od 2 do 5) (tagi ukryte):

Kod: Zaznacz cały

[col2]TEKST|TEKST[/col2]
[col3]TEKST|TEKST|TEKST[/col3]
[col4]TEKST|TEKST|TEKST|TEKST[/col4]
[col5]TEKST|TEKST|TEKST|TEKST|TEKST[/col5]


Przykład:

kolumna 1

kolumna 2

kolumna 1

kolumna 2

kolumna 3

kolumna 1

kolumna 2

kolumna 3

kolumna 4

kolumna 1

kolumna 2

kolumna 3

kolumna 4

kolumna 5

(powyższe pięć tagów jest dostępne, ale nie są wyświetlane w edytorze z uwagi na ich mnogość oraz raczej niewielkie zastosowanie dla forumowiczy)

---

Tagi standardowe

---

Pogrubienie, kursywa i podkreślenie:

Kod: Zaznacz cały

[b]TEKST[/b]
[i]TEKST[/i]
[u]TEKST[/u]


Przykład: tekst pogrubiony, tekst kursywą, tekst podkreślony

---

Kolorowy tekst:

Kod: Zaznacz cały

[color=KOLOR]TEKST[/color]
[color=#HEX]TEKST[/color]


Przykład: czerwony, zielony, niebieski

Lista nazwanych kolorów:

Pink LightPink HotPink DeepPink PaleVioletRed MediumVioletRed Lavender Thistle Plum Orchid Violet Fuchsia Magenta MediumOrchid DarkOrchid DarkViolet BlueViolet DarkMagenta Purple MediumPurple MediumSlateBlue SlateBlue DarkSlateBlue RebeccaPurple Indigo LightSalmon Salmon DarkSalmon LightCoral IndianRed Crimson Red FireBrick DarkRed Orange DarkOrange Coral Tomato OrangeRed Gold Yellow LightYellow LemonChiffon LightGoldenRodYellow PapayaWhip Moccasin PeachPuff PaleGoldenRod Khaki DarkKhaki GreenYellow Chartreuse LawnGreen Lime LimeGreen PaleGreen LightGreen MediumSpringGreen SpringGreen MediumSeaGreen SeaGreen ForestGreen Green DarkGreen YellowGreen OliveDrab DarkOliveGreen MediumAquaMarine DarkSeaGreen LightSeaGreen DarkCyan Teal Aqua Cyan LightCyan PaleTurquoise Aquamarine Turquoise MediumTurquoise DarkTurquoise CadetBlue SteelBlue LightSteelBlue LightBlue PowderBlue LightSkyBlue SkyBlue CornflowerBlue DeepSkyBlue DodgerBlue RoyalBlue Blue MediumBlue DarkBlue Navy MidnightBlue Cornsilk BlanchedAlmond Bisque NavajoWhite Wheat BurlyWood Tan RosyBrown SandyBrown GoldenRod DarkGoldenRod Peru Chocolate Olive SaddleBrown Sienna Brown Maroon White Snow HoneyDew MintCream Azure AliceBlue GhostWhite WhiteSmoke SeaShell Beige OldLace FloralWhite Ivory AntiqueWhite Linen LavenderBlush MistyRose Gainsboro LightGray Silver DarkGray DimGray Gray LightSlateGray SlateGray DarkSlateGray Black

---

Rozmiar tekstu:

Kod: Zaznacz cały

[size=LICZBA]TEKST[/size]

Przykład: rozmiar 50, rozmiar 85, rozmiar 100 (normalny), rozmiar 150, rozmiar 200

(podana liczba oznacza procentową zmianę wielkości czcionki w stosunku do podstawowego rozmiaru)

---

Obrazek:

Kod: Zaznacz cały

[img]URL[/img]

Przykład:

---

Cytat anonimowy i z autorem:

(jeśli chcemy podać autora cytatu, to koniecznie trzeba użyć cudzysłowów "")

Kod: Zaznacz cały

[quote]TEKST[/quote]
[quote="TEKST"]TEKST[/quote]


Przykłady:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare gravida aliquet. Aenean vestibulum mauris vel orci condimentum, nec ultricies eros bibendum. Pellentesque finibus nibh sit amet arcu sagittis feugiat. Aenean nec quam ac justo vulputate accumsan.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare gravida aliquet. Aenean vestibulum mauris vel orci condimentum, nec ultricies eros bibendum. Pellentesque finibus nibh sit amet arcu sagittis feugiat. Aenean nec quam ac justo vulputate accumsan.

Forum pozwala na zagnieżdżenie do trzech poziomów cytatów. Przykład:

Poziom 1.

Poziom 2.

Poziom 3.

---

Kod i kod z kolorowaniem składni PHP:

Kod: Zaznacz cały

[code]TEKST[/code]
[code=php]TEKST[/code]


Przykład:

Kod: Zaznacz cały

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare gravida aliquet. Aenean vestibulum mauris vel orci condimentum, nec ultricies eros bibendum. Pellentesque finibus nibh sit amet arcu sagittis feugiat. Aenean nec quam ac justo vulputate accumsan.

Kod: Zaznacz cały

for ($i = 100; $i > 0; $i--) {
    $p2 = $i . " bottle" . (($i > 1) ? "s" : "") . " of beer";
    $p1 = $p2 . " on the wall\n";
    $p3 = "Take one down, pass it around\n";
    echo (($i < 100) ? $p1 . "\n" : "") . $p1 . $p2 . "\n" . $p3 . (($i < 2) ? ($i-1) . substr($p1, 1, 28) : "");
} 

---

Lista:

(tag [*] nie wymaga zamknięcia poprzez [/*], ale z nim też działa)

Kod: Zaznacz cały

[list]
[*]TEKST
[*]TEKST
[/list]


Przykład:

• lista zwykła
• nienumerowana (czarne kółka)

Kod: Zaznacz cały

[list=1]
[*]TEKST
[*]TEKST
[/list]


Przykład:

1. lista numerowana
2. numerowana liczbami

Kod: Zaznacz cały

[list=a]
[*]TEKST
[*]TEKST
[/list]


Przykład:

1. lista numerowana
2. numerowana literami małymi

Kod: Zaznacz cały

[list=A]
[*]TEKST
[*]TEKST
[/list]


Przykład:

1. lista numerowana
2. numerowana literami dużymi

Kod: Zaznacz cały

[list=i]
[*]TEKST
[*]TEKST
[/list]


Przykład:

1. lista numerowana
2. numerowana liczbami rzymskimi małymi

Kod: Zaznacz cały

[list=I]
[*]TEKST
[*]TEKST
[/list]


Przykład:

1. lista numerowana
2. numerowana liczbami rzymskimi dużymi

Kod: Zaznacz cały

[list=circle]
[*]TEKST
[*]TEKST
[/list]


Przykład:

• lista zwykła
• nienumerowana (kółka)

Kod: Zaznacz cały

[list=disc]
[*]TEKST
[*]TEKST
[/list]


Przykład:

• lista zwykła
• nienumerowana (czarne kółka, to samo co [list])

Kod: Zaznacz cały

[list=square]
[*]TEKST
[*]TEKST
[/list]


Przykład:

• lista zwykła
• nienumerowana (czarne kwadraty)

---

Odnośniki:

Forum automatycznie przekształca wszystkie wykryte w tekście odnośniki do stron, jak również adresy email na postać „klikalną”, ale jeśli błędnie konwertuje tekst, to w opcjach pisania postu możemy wyłączyć „parsowanie linków”. Wówczas zastosowanie znajdą specjalne tagi, których możemy użyć do oznaczenia takich odnośników lub, co praktyczniejsze, nadania im klikalnej nazwy zamiast surowego adresu.

Kod: Zaznacz cały

[url]LINK[/url]
[url=LINK]TEKST[/url]
[email]MAIL[/email]
[email=MAIL]TEKST[/email]


Przykład: https://www.quizpl.net, Forum kanału #QuizPL, example@example.com, napisz (nie) do nas