Návod pro tvorbu příspěvků pomocí BBCode - Obsah tématu

[Asce]

 
Vážení obyvatelé Pedonie, tímto návodem vycházím vstříc těm z vás, kteří nejsou příliš zběhlí v úpravách svých příspěvků. Poučení zde mohou nalézt také uživatelé jiných webů založených na phpBB, avšak ti s přihlédnutím k tomu, že administrátoři jejich fór mohou ve svých projektech používat poněkud jinou sadu příkazů či stejné příkazy jinak implementované.

Níže se pokusím přehlednou formou vysvětlit použití tzv. BBCode, pomocí kterých je možno dosáhnout nejrůznějších úprav textu, od těch jednoduchých, až po vkládání obrázků, videí, tabulek…

Formátování textu či jiné úpravy stránek nelze ve fóru typu phpBB provádět vkládáním příslušných html tagů, protože jejich interpretaci autoři projektu vyloučili. Pokud byste do svého textu vložili html tag, bude zobrazen jeho kód a nebude tedy proveden. Místo toho jsou v phpBB zavedeny tagy, které označujeme jako BBCode. Jejich princip je podobný jako u html tagů - mají počáteční a koncovou značku, mezi nimiž se vyskytuje text, který bude daný tag zpracovávat. Místo lomených závorek "<" a ">" u html tagů se v BBCode používají závorky hranaté "[" a "]". Proč to všechno? Důvodem je vyšší bezpečnost (správně naprogramovaných) BBCode - zatímco do tagu html je teoreticky možno za velmi specifických podmínek zadat takovou posloupnost znaků, které překladač vyhodnotí místo příkazu pro nějaké formátování jako příkaz pro vykonání činnosti v databázi (např. její vymazání), u BBCode je snadná možnost takovému chování zamezit.

BBCode vypadají a pracují podle tohoto obecného principu:

Nejprve je uvedena počáteční značka, následuje váš text, který je tímto nástrojem zpracováván a nakonec je uvedena koncová značka daného BBCode. Je jedno, jestli nejprve napíšete svůj text, následně myší vyberete úsek, který chcete pomocí BBCode upravit a poté kliknete na vhodný nástroj (jeho ikonu či název), anebo zda nejprve nástroj vyberete a mezi vnitřní hranaté závorky text doplníte následně.

Jednotlivé nástroje lze do sebe podle potřeby zanořovat, podobně jako třeba závorky v matematických výrazech. Tedy ani zde nesmí dojít k překřížení úrovní, což značí, že při použití BBCode na text již uzavřený do značek jiného BBCode, musí dojít k obalení původního BBCode novým BBCode - viz příklad:

[BBCode2][BBCode1]zpracovávaný text[/BBCode1][/BBCode2]

Požadavek na nepřekřížení úrovní lze splnit i dalšími způsoby, pokud se vám hodí, např.:

[BBCode2]zpracovávaný text č. 1[BBCode1]zpracovávaný text č. 2[/BBCode1]zpracovávaný text č.3[/BBCode2]

Pokud počáteční značka BBCode obsahuje zak "rovná se", pak to značí, že uživatel má doplnit jeden nebo více parametrů, se kterými takový tag pracuje. Při najetí na ikonu či příkaz BBCode se zobrazí nápověda specifikující mj. i tyto parametry. Je-li parametrů více, oddělují se od sebe čárkou.

Z příkladů uvedených v jednotlivých kapitolkách můžete příslušný kód vybrat, zkopírovat a vložit do svého příspěvku, kde pak přepíšete text dle mého příkladu svým vlastním textem.

Pozor: Podle způsobu, jakým BBCode použijete, se někdy za váš upravovaný text vloží běžná mezera. V některých případech je to jedno (např. u tučného písma je lhostejné, jestli je mezera za slovem uvnitř BBCode, tedy také "tučná", nebo až za BBCode, tj. široká "normálně", protože rozdíl je neznatelný. Jindy ale s běžnou mezerou "navíc" BBCode nefunguje. Takovým případem je použití BBCode "char", kde např. řetězec "nbsp" je něco zcela jiného, než řetězec "nbsp ". Lépe je mít jednotný postup, a dbát toho, aby obsah BBCode (jeho "vnitřek") nekončil běžnou mezerou. Prosím, toto nezaměňujte s použitím "nezalomitelné mezery", což je zcela jiná problematika, jak uvidíte v příslušné pasáži tohoto návodu.

OBSAH (pro rychlý přechod na požadované téma klikněte na odkaz)

• Formátování textu
  
   
  
  • Barva písma
  • Velikost písma
  • Řezy písma: tučné, kurzíva, podtržené, přeškrtnuté
  • Horní a dolní index
  • Zarovnání a odsazení textu
  • Nadpisy
• Seznam
  
   
  
  • Seznam prostý (nečíslovaný, s odrážkami)
  • Seznam uspořádaný (číslovaný)
• Odkaz (řečený též hyperlink či jen link)
  
   
  
  • Odkaz na webovou stránku, obrázek, soubor
  • Odkaz na konkrétní místo stejné stránky (záložka)
  • Odkaz na konkrétní místo jiné stránky
• Práce s obrázky
  
   
  
  • Obrázky v phpBB fóru - jak to funguje
  • Vložení obrázku do šířky 700 px - BBCode "img"
  • Vložení obrázku šířky větší než 700 px - BBCode "image"
  • Text vedle obrázku - BBCode "imageleft"
  • Obrázek jako odkaz čili "klikací obrázek"
• Citace
  
   
  
  • Citace, nejjednodušší varianta
  • Citace, různá vylepšení
  • Citace, použití obrázku v citaci
• Tabulka, zjednodušená verze s omezenými možnostmi
  
   
  
  • Tabulka, základní varianta
  • Tabulka, různá vylepšení
  • Tabulka, obrázek jako obsah buňky
  • Tabulka, galerie náhledů
• Tabulka, rozšiřující varianta
   
• Multimédia
  
   
  
  • Multimédia, audio
  • Multimédia, video
  • Multimédia, video z rámu cizí stránky (BBCode iFrame)
• Ostatní nástroje
  
   
  
  • Spojler (BBCode "spoiler")
  • Vkládání speciálních znaků (BBCode "char")
  • Vodorovná oddělovací čára
• Jak psát dobře příspěvky - několik rad začínajícím vkladatelům

[Asce]

 
Formátování textu
Obsah kapitoly

• Barva písma
• Velikost písma
• Řezy písma: tučné, kurzíva, podtržené, přeškrtnuté
• Horní a dolní index
• Zarovnání a odsazení textu
• Nadpisy

Barva písma

Odpovídající BBCode: color
Syntaxe: [color=označení barvy][/color]

Připomínám, že pro použití nástrojů k úpravě vkládaného textu je lhostejné, zda nejprve tu část textu, kterou chcete upravit, vyberete, a potom použijete příslušný nástroj, nebo naopak nejprve použijete editační nástroj, a teprve poté "dovnitř" vepíšete či vložíte váš text.

V editoru v liště s ikonami nástrojů pro úpravu příspěvků klikněte na ikonu   
Tím otevřete nabídku barev - požadovanou vyberete kliknutím na ni.

V případě, že budete chtít zadat barvu přímým zápisem, nikoliv výběrem z nabídky, můžete za rovnítko počáteční značky BBCode napsat bez uvozovek název barvy nebo se znakem mřížka # hexadecimální kód barvy.

Poznámky:

1. Znak mřížka čili hash můžete zapsat kombinací kláves pravý alt + X nebo levý alt a z numerické klávesnice 35.
2. Pojmenování barev či jejich hexadecimální kódy snadno dohledáte na webu.
3. Velikost písmen v pojmenování barev či v jejich kódu nehraje roli.

Příklad:

Anglické slovíčko pro čokoládu nebo čokoládovou barvu bude napsáno oběma zmíněnými způsoby touto barvou: chocolate, či chocolate.

Kód příkladu:

Kód: Vybrat vše

Anglické slovíčko pro čokoládu nebo čokoládovou barvu bude napsáno oběma zmíněnými způsoby touto barvou: [color=chocolate]chocolate[/color], či [color=#d2691e]chocolate[/color].

Velikost písma

Odpovídající BBCode: size
Syntaxe: [size=počet_pixelů][/size]

Analogicky jako barva písma je implementována i jeho velikost. Předdefinované velikosti vybírejte z příslušného komboboxu (předvoleno je „Výchozí“). Pokud by vám žádná z předvolených velikostí (v pixelech) nevyhovovala, lze ji upravit přímo v počáteční značce daného BBCode. Největší velikost, kterou lze v našem fóru psát, byla administrátorem zastropována na hodnotě 200 px.

Příklad:

Tento text je napsán malým písmem a tento zas velkým.

Odpovídající kód:

Kód: Vybrat vše

[size=85]Tento text je napsán malým písmem[/size][size=150] a tento zas velkým.[/size]

Řezy písma: tučné, kurzíva, podtržené, přeškrtnuté

Odpovídající BBCode: B, I, U, preskrtnuto
Syntaxe:

Kód: Vybrat vše

[b][/b], [i][/i], [u][/u], [preskrtnuto][/preskrtnuto]

Zde uvádím způsob, jak použít písmo tučné („B“, tj. bold), ležaté („I“, tj. kurzíva či italika), podtržené („U“, tj. underlined) a přeškrtnuté. Zatímco první tři zmíněné BBCode pro změnu řezu písma mají svou ikonu reprezentovanou příslušným písmenem přímo v liště s ikonami nástrojů, BBCode pro přeškrtnuté písmo nalezneme v nabídce komboboxu "Custom BBCodes".

Příklad použití - část textu bude vypsána tučným řezem písma:

Tento text bude základním písmem. Tento text bude tučně. Tento text bude základním písmem.

Kód: Vybrat vše

Tento text bude základním písmem. [B]Tento text bude tučně.[/B] Tento text bude základním písmem.

Příklad použití - část textu bude vypsána tučným řezem písma + podtrženě, část jen tučně a část základním písmem (kombinace BBCode):

Tento text bude tučně. Tento text bude tučně i podtrženě. Tento text bude základním písmem.

Kód: Vybrat vše

[B]Tento text bude tučně. [U]Tento text bude tučně i podtrženě.[/B][/U] Tento text bude základním písmem.

Horní a dolní index

Odpovídající BBCode: superscript, subscript
Syntaxe:

Kód: Vybrat vše

[superscript][/superscript], [subscript][/subscript]

BBCode pro převedení textu na horní a dolní index nalezneme v nabídce komboboxu "Custom BBCodes".

Příklad:

Žákyně byla tak vystresovaná, že nezvládla napsat ani H2SO4, coby jeden z nejznámějších vzorců anorganické chemie.

Kód: Vybrat vše

Žákyně byla tak vystresovaná, že nezvládla napsat ani H[subscript]2[/subscript]SO[subscript]4[/subscript], coby jeden z nejznámějších vzorců anorganické chemie.

Zarovnání a odsazení textu

Odpovídající BBCode pro zarovnání textu: centre, justify, left, right
Syntaxe:

Kód: Vybrat vše

[centre][/centre], [justify][/justify], [left][/left], [right][/right]

Odpovídající BBCode pro odsazení textu od levého okraje: odsadit
Syntaxe:

Kód: Vybrat vše

[odsadit]číslo_v_pixelech[/odsadit]

Text, který editorem vkládáme, je automaticky zarovnán vlevo. Pro zarovnání na střed (vycentrování), použijeme BBCode "centre", pro zarovnání doprava pak "right" a pro oboustranné zarovnání (do bloku) slouží BBCode "justify". Kvůli některým BBCode a pro úplnost je implementován i BBCode "left" pro zarovnání doleva, které jinak editor, jak řečeno výše, provádí automaticky. Na rozdíl od automatického zarovnávání, BBCode "left" pod sebou vynechá řádku. Totéž dělají i ostatní BBCode pro zarovnávání textu.

Pokud potřebujeme text odsadit od levého okraje, použijeme BBCode "odsadit" - pozor, u tohoto BBCode se parametr, kterým je počet pixelů odsazení, vkládá mezi počáteční a koncovou značku, a odsazovaný text až za koncovou značku. Je to proto, že nástroj "odsadit" ovlivňuje na rozdíl od ostatních BBCode vždy pouze jednu řádku (tu, na které je zapsán).

Všechny zmíněné nástroje naleznete v komboboxu "Custom BBCodes".

Poznámka:

Zarovnávat či odsazovat na webu nelze pomocí mezerníků, jak asi většina čtenářů ví. Pokud například vložíte dvě (nebo více) mezer za sebou, interpretr html, který v konečné fázi vykreslí stránku, nadbytečné mezery eliminuje (ponechá toliko jednu).

Příklad:

Můj vycentrovaný text

Kód: Vybrat vše

[centre]Můj vycentrovaný text[/centre]

Standardně umístěný text.
Text odsazený od levého okraje o 50 px.

Kód: Vybrat vše

Standardně umístěný text.
[odsadit]50[/odsadit]Text odsazený od levého okraje o 50 px.


Nadpisy

Odpovídající BBCode: h1, h2
Syntaxe:

Kód: Vybrat vše

[h1][/h1], [h2][/h2]

Pro nadpisy můžeme použít předpřipravené BBCode „h1“ (hlavní nadpis) či „h2“ (podnadpis). Tyto funkce za vás provedou rovnou několik formátování najednou, ale pochopitelně jako i u jiných případů, i zde můžete svůj nadpis doupravit např. zvýrazněním barvou.

BBCode "h1" a "h2" nad a pod sebou vynechávají řádku. Pokud jsou centrovány pomocí BBCode "centre", není zarovnání na střed dokonalé, ale to většinou nevadí.

Příklad:

Můj nadpis

Kód: Vybrat vše

[h1]Můj nadpis[/h1]

Můj vycentrovaný nadpis

Kód: Vybrat vše

[h1][centre]Můj vycentrovaný nadpis[/centre][/h1]

Můj zelený a vycentrovaný nadpis

Kód: Vybrat vše

[h1][color=#008000][centre]Můj zelený a vycentrovaný nadpis[/centre][/color][/h1]

[Asce]

 
Seznam
Obsah kapitoly

• Seznam prostý (nečíslovaný, s odrážkami)
• Seznam uspořádaný (číslovaný)

Připomínám, že pro použití nástrojů k úpravě vkládaného textu je lhostejné, zda nejprve tu část textu, kterou chcete upravit, vyberete, a potom použijete příslušný nástroj, nebo naopak nejprve použijete editační nástroj, a teprve poté "dovnitř" vepíšete či vložíte váš text.

Rozlišujeme seznam prostý čili nečíslovaný (lidově „odrážky“) a uspořádaný čili číslovaný. U seznamu prostého nezáleží na pořadí položek a typicky se nepředpokládá, že takový seznam vypisuje všechny možné položky, jež by mohl obsahovat (např. u vlastností nějakého objektu je jich vyjmenováno jen několik - ty, které se autorovi textu zdály důležité). Naopak u uspořádaného seznamu typicky záleží na pořadí jeho položek, přičemž se spíše očekává, že jejich výčet je úplný (např. návod k použití nějakého výrobku).

Seznamy se tvoří kombinací dvou BBCode. První BBCode říká, kde seznam začíná a kde končí, zatímco druhý, obvykle opakovaně použitý BBCode označuje jednotlivé položky seznamu (např. ony odrážky).

Seznam prostý (nečíslovaný, s odrážkami)

Odpovídající BBCode: list, *
Syntaxe dílčích BBCode:

Kód: Vybrat vše

[list][/list], [*]

Syntaxe celého (složeného) příkazu:

Kód: Vybrat vše

[list][*][/list]

Pro použití prostého seznamu použijte ikonu „Seznam“  
Mezi počáteční a koncovou značku takto zapsaného BBCode vložte pomocí ikony „Položka seznamu“ BBCode pro první odrážku  
Tento BBCode je nepárový (text odrážky bude končit buď další značkou „Položka seznamu“ nebo koncovou značkou seznamu). Za text první odrážky vložte opět BBCode „Položka seznamu“, zapište text druhé odrážky a takto postupujte až k poslední odrážce, kterou chcete zapsat.

Příklad:

• Toto je text mojí první odrážky
• Toto je text mojí druhé odrážky

Kód: Vybrat vše

[list][*]Toto je text mojí první odrážky[*]Toto je text mojí druhé odrážky[/list]

Seznam uspořádaný (číslovaný)

Odpovídající BBCode: list, *
Syntaxe dílčích BBCode:

Kód: Vybrat vše

[list=znak][/list], [*]

Syntaxe celého (složeného) příkazu:

Kód: Vybrat vše

[list=znak][*][/list]

Pro použití číslovaného seznamu klikněte na ikonu „Uspořádaný seznam“  

Za znaménko „rovná se“, čili jako znak dle zápisu syntaxe v počáteční značce takto vloženého BBCode, zapište číslovku nebo malé písmeno nebo velké písmeno anglické abecedy (tj. s vyloučením písmen s diakritikou a písmene "ch"), od které započne automatické číslování (nejčastěji číslici 1 či bez uvozovek písmeno "a" či písmeno "A"). Mezi počáteční a koncovou značku takto zapsaného BBCode vložte pomocí ikony „Položka seznamu“ BBCode pro první položku svého uspořádaného seznamu:

Tento BBCode je nepárový (text položky bude končit buď další značkou „Položka seznamu“ nebo koncovou značkou seznamu). Za text první odrážky vložte opět BBCode „Položka seznamu“, zapište text druhé položky a takto postupujte až k poslední položce, kterou chcete zapsat.

Příklad:

1. Toto je text mojí první položky
2. Toto je text mojí druhé položky

Kód: Vybrat vše

[list=1][*]Toto je text mojí první položky[*]Toto je text mojí druhé položky[/list]

[Asce]

 
Odkaz
Obsah kapitoly

• Odkaz na webovou stránku, obrázek, soubor
• Odkaz na konkrétní místo stejné stránky (záložka)
• Odkaz na konkrétní místo jiné stránky

Připomínám, že pro použití nástrojů k úpravě vkládaného textu je lhostejné, zda nejprve tu část textu, kterou chcete upravit, vyberete, a potom použijete příslušný nástroj, nebo naopak nejprve použijete editační nástroj, a teprve poté "dovnitř" vepíšete či vložíte váš text.


Odkaz na webovou stránku, obrázek, soubor

Pomocí probíraného nástroje lze vložit odkaz na webovou stránku či na jiný objekt, který má svou adresu. Může tedy jít jak třeha o html či php stránku, tak o obrázek či jiný soubor. Problémy činí takové odkazy, v nichž jsou použity mezey mezi slovy, a také některé speciální znaky. Snažte se těmto exotickým adresám vyhýbat. Častou chybou bývá jiná velikost písmen adresy v cíli odkazu a jiná ve vašem příspěvku (například obrázková přípona ".jpg" je z hlediska systému něco zcela jiného, než ".JPG").

Odpovídající BBCode: url
Syntaxe:

Kód: Vybrat vše

Varianta č. 1: [url]webová_adresa[/url]
nebo
Varianta č. 2: [url=webová_adresa]název_odkazu[/url]

Pro obě varianty vložení odkazu použijte ikonu „Vložit URL“  

Varianta č. 1 představuje nejjednodušší, ale méně "hezkou" a méně přehlednou možnost, jak odkaz vložit. Příslušnou adresu jednoduše zapíšeme mezi počáteční a koncovou značku daného BBCode.

Příklad, varianta č. 1:

Podívejte se také na obrázek, který se mi líbil: http://www.asceroute.com/foto_asce/proslovy/smvsil-17.jpg.

Kód: Vybrat vše

Podívejte se také na obrázek, který se mi líbil: [url]http://www.asceroute.com/foto_asce/proslovy/smvsil-17.jpg[/url]

Varianta č. 2 je nepatrně komplikovanější. Dovnitř počáteční značky BBCode za slovo "url" doplníme rovnítko, a za něj vložíme adresu objektu, na který se bude odkazovat. Mezi počáteční a koncovou značku BBCode zapíšeme vhodný text, který bude objekt čtenáři přibližovat (nebo třeba jen slůvko "zde" apod.). Při tomto postupu si pohlídejte, aby byly správně umístěny mezery mezi slovy okolo odkazu.

Příklad, varianta č. 2:

Podívejte se také na obrázek, který se mi líbil.

Kód: Vybrat vše

Podívejte se také na [url=http://www.asceroute.com/foto_asce/proslovy/smvsil-17.jpg]obrázek[/url], který se mi líbil.

Odkaz na konkrétní místo stejné stránky (záložka)

Odpovídající BBCode: zalozka_cil, zalozka_def
Syntaxe:

Kód: Vybrat vše

[zalozka_cil=Jméno_záložky][/zalozka_cil]
[zalozka_def=Jméno_záložky][/zalozka_def]

Pokud jsme chtěli ve svém příspěvku odkázat na jiný příspěvek či webovou stránku mimo fórum, principem bylo, že do příslušného BBCode jsme předepsaným způsobem vložili adresu (URL) tohoto příspěvku, resp. webové stránky, tj. kam má odkaz směřovat. Pokud však např. u rozsáhlého příspěvku s mnoha částmi chceme vytvořit „odskok“ na jinou jeho část (takto se tvoří třeba obsah stránky), je zřejmé, že zmíněný princip nebude postačovat – místo „odkud“ a místo „kam“ jsou ve stejném dokumentu, tedy mají stejnou adresu. Postupuje se tak, že v dokumentu nadefinujeme tzv. záložku. Ta je tvořena BBCode „zalozka_cil“, která říká, jak se jmenuje cíl, kam se bude odskakovat a BBCode „zalozka_def“, která je vlastním místem, kam odskok bude proveden.

Jak na to:

• Na místě, odkud má k odskoku dojít, zapište bez uvozovek slovo označující cíl, (dle dále rozvedeného příkladu je to slovo „mužích“ v rámci běžné věty)
• Takto zapsané označení cíle vyberte myší a z komboboxu "CustomBBCodes" zvolte BBCode „zalozka_cil=“
• Za rovnítko v počáteční značce BBCode zapište bez diakritiky, bez mezer a zvláštních znaků jméno záložky, které bude v rámci dokumentu (stránky) unikátní, např. bez uvozovek „ZalozkaMuzi“
• Ve svém příspěvku se přesuňte řádku nad místo, kam má dojít k odskočení, v našem příkladu tedy nad text „Kapitola5“
• Z komboboxu "CustomBBCodes" vyberte BBCode „zalozka_def=“
• Do počáteční značky tohoto BBCode za rovnítko zadejte bez uvozovek název této záložky, v našem příkladu „ZalozkaMuzi“.

Příklad, kde kliknutí na slovo „mužích“ provede odskok na název kapitoly 5:

Tento text pojednává o chlapečcích, holčičkách, chlapcích, holkách, mužích a ženách.
Kapitola 1: Holčičky
Kapitola 2: Chlapečci
Kapitola 3: Holky
Kapitola 4: Chlapci
Kapitola 5: Muži
Kapitola 6: Ženy

Kód pro „zalozka_cil=“…

Kód: Vybrat vše

 [zalozka_cil=ZalozkaMuzi]mužích[/zalozka_cil]

…a pro „zalozka_def=“

Kód: Vybrat vše

[zalozka_def=ZalozkaMuzi][/zalozka_def]

Kód celého zvoleného příkladu:

Kód: Vybrat vše

Tento text pojednává o chlapečcích, holčičkách, chlapcích, holkách, [zalozka_cil=ZalozkaMuzi]mužích[/zalozka_cil] a ženách.
Kapitola 1: Holčičky
Kapitola 2: Chlapečci
Kapitola 3: Holky
Kapitola 4: Chlapci[zalozka_def=ZalozkaMuzi][/zalozka_def]
Kapitola 5: Muži
Kapitola 6: Ženy

Poznámky:

• Někdy je vhodnější definující BBCode "zalozka_def" umístit nikoliv řádku nad, ale na stejný řádek s požadovaným místem, kam má být odskok proveden.
• Text značek BBCode není v příspěvku zobrazen, proto se není nutno obávat, že nějak "rozhází" vzhled textu.
• Na fóru založeném na phpBB je zapotřebí, aby název záložky byl unikátní nejen v rámci příspěvku, ale v rámci celé stránky s příspěvky (což je podle toho, jak příspěvky přibývají, 1 až 20 příspěvků).
• Interpreter webové stránky umístí místo, kam se odskočilo, do horní části stránky - tj. ta je z hlediska čtenáře odrolována na to, co chěl číst. Výjimkou je případ, kdy zbývající spodní část stránky je kratší, než je velikost zobrazené části. V takovém případě je nejspodnnější část stránky zarovnána s nejspodnější částí zobrazitelné oblasti, takže místo odskoku se nachází (samozřejmě) ve viditelné části stránky, ale nikoliv až nahoře.

Odkaz na konkrétní místo jiné stránky

Tento odkaz kombinuje odskok na jinou webovou stránku s odskokem na té na dané na ní definované místo. Technicky je však velmi podobný odkazu na jinou URL, proto bude velmi podobný i následující návod.

Odpovídající BBCode: url
Syntaxe:

Kód: Vybrat vše

Varianta č. 1: [url]webová_adresa#název_záložky[/url]
nebo
Varianta č. 2: [url=webová_adresa#název_záložky]název_odkazu[/url]

Pro obě varianty použijte ikonu „Vložit URL“  

Varianta č. 1 představuje jednodušší, ale méně "hezkou" a méně přehlednou možnost, jak odkaz vložit. Příslušnou URL adresu jednoduše zapíšeme mezi počáteční a koncovou značku daného BBCode a bez jakýchkoliv mezer doplníme symbolem mřížka # a názvem příslušné záložky na dané stránce.

Příklad, varianta č. 1:

Tento odkaz zobrazí stránku kancléřova proslovu z dubna 2021 a na ní najede na odstavec "Pár mých osobních poznámek": http://gl.asceroute.com/viewtopic.php?p=92731#ZalozkaOsobniDuben21

Kód: Vybrat vše

Tento odkaz zobrazí stránku kancléřova proslovu z dubna 2021 a na ní najede na odstavec "Pár mých osobních poznámek": [url]http://gl.asceroute.com/viewtopic.php?p=92731#ZalozkaOsobniDuben21[/url]

Varianta č. 2 je nepatrně komplikovanější. Dovnitř počáteční značky BBCode za slovo "url" doplníme rovnítko, a za něj vložíme URL webu doplněný bez mezer o znak # a název příslušné záložky na této stránce, na niž se bude odskakovat. Mezi počáteční a koncovou značku BBCode zapíšeme vhodný text, který bude objekt čtenáři přibližovat (nebo třeba jen slůvko "zde" apod.). Při tomto postupu si pohlídejte, aby byly správně umístěny mezery mezi slovy okolo odkazu.

Příklad, varianta č. 2:

Podívejte se také na Asceho osobní poznámky, které uveřejnil v dubnu 2021.

Kód: Vybrat vše

Podívejte se také na [url=http://gl.asceroute.com/viewtopic.php?p=92731#ZalozkaOsobniDuben21]Asceho osobní poznámky[/url], které uveřejnil v dubnu 2021.

Důležité upozornění:

Zadáváme-li odkaz s odskokem na příspěvek fóra typu phpBB, pak je místo dopsání znaku # a názvu záložky zapotřebí adresu upravit. Ta totiž již odskok obsahuje, a to na své záhlaví.

Příklad úpravy adresy příspěvku na našem fóru:

Kód: Vybrat vše

Původní adresa: http://gl.asceroute.com/viewtopic.php?p=92731#p92731
Nutno pro odskok na záložku jménem "ZalozkaOsobniDuben21" upravit na:
http://gl.asceroute.com/viewtopic.php?p=92731#ZalozkaOsobniDuben21

[Asce]

 
Práce s obrázky
Obsah kapitoly

• Obrázky v phpBB fóru - jak to funguje
• Vložení obrázku do šířky 700 px - BBCode "img"
• Vložení obrázku šířky větší než 700 px - BBCode "image"
• Text vedle obrázku - BBCode "imageleft"
• Obrázek jako odkaz čili "klikací obrázek"

Připomínám, že pro použití nástrojů k úpravě vkládaného textu je lhostejné, zda nejprve tu část textu, kterou chcete upravit, vyberete, a potom použijete příslušný nástroj, nebo naopak nejprve použijete editační nástroj, a teprve poté "dovnitř" vepíšete či vložíte váš text.


Obrázky v phpBB fóru - jak to funguje

Tak jako i na jiných webech, i zde platí, že především musí být váš obrázek někde uložen, přičemž toto umístění musí být pro zobrazovanou stránku dostupné. Nejsnazší a současně také anonymní je založit si vhodný účet na některém serveru poskytujícím službu nahrávání obrázků (dále též "obrázkový server"). Zde musí být obrázky, které chcete použít na fóru, veřejně přístupné (tedy nikoliv v nějaké neveřejné složce, která pro přístup vyžaduje heslo). Takovým serverem je mimo EU například imgsrc.ru, u nás imgway.cz a mnoho dalších. Většina těchto serverů automaticky k vašim obrázkům vygeneruje kód pro vložení do fóra typu phpBB, tedy i pro Pedonii. Na těchto serverech - logicky - musíte dodržovat jejich pravidla, jinak je běžným trestem zrušení celého účtu a nenávratná ztráta vašich dat. I pokud ale dodržujete vše, jak se sluší a patří, může se stát - a stává se - že server vaše obrázky ztratí, případně ukončí svou činnost. Mějte proto vždy kopie svých materiálů na svém počítači, a to nejlépe vhodně roztříděné - v případě popisovaného výpadku lze vaše příspěvky na Pedonii obnovit z této vaší zálohy.

Administrátor Pedonie podstatnou část nově vložených obrázků zkopíruje na naše vlastní pedonské úložiště a na toto nové umístění přesměruje ten kód vašeho příspěvku, který je odpovědný za zobrazení uživatelům. Na uvedenou službu není nárok, proto stále platí vhodnost mít kopii materiálů na svém PC. Vámi k obrázku vložené další informace "odkaz" a "zdroj" jsou i po případném přesměrování ponechány beze změny. Obrázky jsou na pedonském úložišti zálohovány jedenkrát týdně, a budou k dispozici tak dlouho, dokud bude fungovat Pedonia a administrátor sám.

Na Pedonii je stanovena největší možná šířka zobrazitelného obrázku na 700 px. Kód fóra "hlídá", aby z estetického důvodu byl od levého a pravého okraje obrázku odstup od svislých prvků stránky s příspěvkem alespoň 1 px, což značí, že to, co uživatel skutečně vidí u obrázků o šířce 699 px či 700 px je právě 698 px. Obrázky o velikosti 699 px a 700 px jsou při zobrazování (nikoliv reálně v uloženém souboru) automaticky proporcionálně umenšeny na šířku 698 px. Důsledkem toho je, že pokud chcete mít obrázky o šířce 698 px, 699 px a 700 px zarovnané pod sebe, vlastně pro to nemusíte vůbec nic udělat - uživatelům se všechny budou jevit o šířce 698 px, tudíž budou zarovnány samo sebou. Při pokusu vložit obrázek širší než 700 px je vyvolána chybová hláška a příspěvek nejde uložit. Výška obrázku není na Pedonii omezena.

Každý obrázek, popřípadě sérii obrázků tzv. ozdrojujeme. To značí, že uvedeme "odkaz" a "zdroj":

• Odkaz je adresa obrázku na serveru, odkud je konkrétní obrázek převzat, čili kde jsme jej v hlubinách webu nalezli. Pokud jsme obrázek upravovali, např. aby měl šířku do 700 px, a tuto upravenou verzi nahráli na obrázkový server, odkud ji na fóru zobrazujeme, pak je odkazem stále adresa původního nálezu obrázku, nikoliv adresa na obrázkovém serveru s nahranou naší verzí souboru.
• Zdroj je adresa serveru, kde jsme obrázek nalezli. Zdroj je tedy obecnější informace než odkaz.

Vložení obrázku do šířky 700 px - BBCode "img"

Odpovídající BBCode: img
Syntaxe:

Kód: Vybrat vše

[img][/img]

Pro vložení obrázku do šířky 700 px včetně je nejjednodušší variantou použití BBCode "img". Na obrázky širší tento BBCode na Pedonii použít nemůžeme, protože neprovádí žádnou transformaci a horní limit pro šířku je nastaven právě na 700 px.

Z nástrojové lišty použijeme ikonu  

Adresu obrázku, tj. kompletní URL, vložíme mezi počáteční a koncovou značku BBCode.

Příklad:



Výsledný kód vypadá takto:

Kód: Vybrat vše

[img]http://www.asceroute.com/foto_asce/bbcode/avatarnavstevnik.jpg[/img]

Obrázek nezapomeneme dostatečně ozdrojovat.



Vložení obrázku šířky větší než 700 px - BBCode "image"

Odpovídající BBCode: image
Syntaxe:

Kód: Vybrat vše

[image=číslo_do_698_včetně][/image]

Jak jsem popsal výše, fórum Pedonia nativně podporuje vkládání obrázků o maximální šířce 700 pixelů. Ve skutečnosti si program fóra tuto šířku z estetických důvodů zmenší na 698 pixelů, přičemž výšku dopočítá tak, aby nedošlo k deformaci obrazu. Pokud je zapotřebí vložit obrázek širší, je možno použít jeden z těchto postupů:

1. Originál zmenšit (někdy stačí oříznout) v libovolném grafickém editoru, tuto kopii pak nahrát na některý obrázkový server a v příspěvku pak zobrazit pomocí BBCode "img" právě onu zmenšeninu. Neopomeneme, že je nutno odkázat na původní originál, nikoliv na "mezičlánek" na obrázkovém serveru.
2. Efektivnější cestou je použití implementovaného BBCode "image". Při použití tohoto BBCode se neprovádí automatické zmenšení ze jmenovité maximální šířky 700 px, popř. 699 px na 698 px, proto jako největší možnou šířku použijeme právě číslo 698 (a nikoliv 700, resp. 699).

Příklad (obrázek má šířku 768 px):



Výsledný kód vypadá takto:

Kód: Vybrat vše

[image=698]http://www.asceroute.com/foto_asce/bbcode/i36740547fkD.jpg[/image]

Text vedle obrázku - BBCode "imageleft"

Odpovídající BBCode: imageleft
Syntaxe:

Kód: Vybrat vše

[imageleft][/imageleft]

BBCode je k dispozici v komboboxu "Custom BBCodes".

Pokud do příspěvku vkládáme obrázek menších rozměrů, nemusí působit příliš dobře množství volného místa vedle něj. Někdy je vhodné toto místo použít pro text, který se k obrázku vztahuje. Příspěvek pak bude působit kompaktnějším, neroztahaným dojmem. Použití tohoto BBCode si pečlivě zkontrolujte - tedy jestli výsledný estetický dojem je opravdu takový, jak jste zamýšleli.

Příklad (pomocí několikrát použité klávesy Enter jsem text navíc umístil vůči obrázku do vhodné výšky, přibližně doprostřed) :









Sem lze zapsat nějaký doplňující či vysvětlující či úplně jiný libovolný text a já jsem sem navíc umístil rovnou i odkaz a zdroj obrázku.
odkaz a zdroj: iMGSRC.RU Prispevky










Výsledný kód (bez vnořených odkazů a bez entrování) vypadá takto:

Kód: Vybrat vše

[imageleft]http://www.asceroute.com/foto_asce/bbcode/48447927Xca.jpg[/imageleft]Sem lze zapsat nějaký doplňující či vysvětlující či úplně jiný libovolný text...

Obrázek jako odkaz čili "klikací obrázek"

Takto vložený odkaz nejenže zobrazí vlastní obrázek, ale po kliknutí na něj dojde k přesměrování na zadanou webovou stránku. Tento způsob se nejčastěji uplatňuje u miniatur obrázků, kdy po kliknutí na takovou miniaturu je načten vlastní obraz v plném rozlišení.

Technicky jde o kombinaci BBCode "url" pro hyperlink a "img" pro obrázek.

Příklad (obrázek vlajky odkazuje na českou mutaci stránky „O nás“):



Výsledný kód pak vypadá takto:

Kód: Vybrat vše

[url=http://www.gl.asceroute.com/app.php/page/uvodni_str][img]http://www.gl.asceroute.com/images/icons/vlajky/cz_symb.gif[/img][/url]

[Asce]

Citace
Obsah kapitoly

• Citace, nejjednodušší varianta
• Citace, různá vylepšení
• Citace, použití obrázku v citaci

Smyslem citace je dát na vědomí, na koho a jaký výrok reagujete. Proto citujte spíše střídměji, opravdu jen to nejpodstatnější pro pochopení souvislostí dalšími čtenáři.

Upozornění:

Ať již vytvoříte BBCode pro citaci jakýmkoliv způsobem, jméno či označení subjektu, který citujete, musí být uzavřeno do DVOJITÝCH ROVNÝCH HORNÍCH uvozovek (tedy výhradně "tyto" a nikoliv např. ‚tyto‘ nebo „tyto“ nebo ‘tyto’ nebo “tyto” apod.). Dejte si na toto pozor zejména pokud připravujete text budoucího příspěvku v MS Word či podobných editorech.

Většina uživatelů fóra má nastaveno, aby byli upozorněni na to, že byli někým citováni. Snadno se tak dozví o vaší reakci na svůj příspěvek a mohou se případně dále vyjádřit. Upozornění je však kódem fóra vygenerováno výhradně tehdy, pokud citaci provedete stiskem tlačítka „Odpovědět s citací“ v příspěvku, na který reagujete. Ve skutečnosti totiž žádná vazba mezi citovaným textem či jeho autorem a vaším reagujícím příspěvkem neexistuje. Pokud si tedy reakci s citací připravujete jiným způsobem, a přesto chcete, aby o ní byl autor původního textu zpraven, proveďte to tak, že těsně před uložením (odesláním) svého reagujícího příspěvku při kurzoru v editoru stisknete kombinaci kláves Ctrl + A (vybrání celého obsahu pole s vaším textem) a hned poté Ctrl + C (zkopírování vybraného textu do schránky Windows), editor opusťte bez uložení, vraťte se k příspěvku, na nějž reagujete a zde stiskněte ikonu „Odpovědět s citací“. Nyní se vám otevře editor, ve kterém je s příslušnými náležitostmi předpřipravena citace. Pokud máte ve vašem textu (jež je nyní v paměti počítače) připravenu citaci dle vlastního uvážení, stiskněte Ctrl + A (vybrání celého textu, který vám připravil kód fóra po stisknutí zmíněné ikony) a ihned dále stiskněte klávesovou zkratku Ctrl + V, čímž vybraný text přepíšete tím, který jste si uložili do paměti Windows. Po odeslání takového příspěvku jej máte přesně takový, jak jste si jej sami připravili, a současně autor původního příspěvku obdrží upozornění o tom, že byl citován.

BBCode pro citaci automaticky za jméno či označení citovaného subjektu dopíše text " píše: " (mezera, slovo "píše", dvojtečka, mezera). Za svou koncovou značkou BBCode vynechává řádku.

V případě, že citaci vkládáte "ručně" až ve svém příspěvku, musíte do počáteční značky BBCode dopsat za klíčové slovo "quote" symbol rovnítka a ihned za něj do dvojitých rovných horních uvozovek jméno citované osoby (označení subjektu citace). Pokud naopak citaci vkládáte pomocí funkce „Odpovědět s citací“ v příspěvku na který reagujete, je sice automaticky jméno osoby vyplněno, avšak citace obsahuje kompletní text tohoto příspěvku – tj. musíte odmazat nepotřebné části.


Citace, nejjednodušší varianta

Odpovídající BBCode: quote
Syntaxe:

Kód: Vybrat vše

[quote="v_rovných_uvozovkách_jméno_citovaného"][/quote]

Citace je v diskuzích běžný prvek a vytvoříte ji mj. některou z těchto dvou následujících možností:

• z příspěvku, na nějž reagujete, stisknutím ikony „Odpovědět s citací“ v pravém horním rohu příspěvku:  
   
• již ve svém nově tvořeném příspěvku pomocí stejnojmenného BBCode "Citace" s touto ikonou:

Počáteční značka BBCode pro citaci obsahuje rovnítko a za ním řetězec "v_uvozovkách_jméno", kde „jménem“ je myšlen ten, koho citujete. Citovat můžete kohokoliv, protože ve skutečnosti neexistuje žádné propojení mezi některým příspěvkem fóra a vaší citací. Podrobnější informace jsou v předchozím odstavci.

Příklad citace:

Ahoj, jak se máš?

Výsledný kód vypadá takto:

Kód: Vybrat vše

[quote="Asce"]Ahoj, jak se máš?[/quote]

Citace, různá vylepšení

Zvýraznění jména citovaného subjektu

Jméno citovaného subjektu je standardně kódem fóra vypsán stejným písmem, jako okolní text. To může působit - obzvláště v zanořených citacích - značně nepřehledně. Doporučuji toto jméno zvýraznit použitím tučného řezu písma. U těch jmen, která reprezentují nicky uživatelů fóra, pak navíc i použití barvy odpovídající jejich zařazení do uživatelské skupiny.

Příklad "dvojité" citace bez zvýraznění a naproti tomu s doporučeným zvýrazněním

Předpokládejme, že uživatel Asce napsal příspěvek, na jehož část reagoval uživatel Neptun, a něj znovu reagoval Asce:

1. Varianta bez zvýraznění
    
   Neptune, jako optimista Asce musím reagovat na tvou kritiku mého hodnocení počasí:
   

   Dnes byl krásný den.

   S tímto musím nesouhlasit.

   Ale já dál trvám na tom, že byl krásný den, neboť svítilo sluníčko.
    
2. Varianta se zvýrazněním
    
   Neptune, jako optimista Asce musím reagovat na tvou kritiku mého hodnocení počasí:
   

   Dnes byl krásný den.

   S tímto musím nesouhlasit,

   Ale já dál trvám na tom, že byl krásný den, neboť svítilo sluníčko.

Ve výsledném kódu příkladu se zvýrazněním si všimněte zejména toho, že BBCode pro zvýraznění jsou umístěny uvnitř uvozovek, které přináležejí ke jménu citovaného subjektu. Kód vypadá takto:

Kód: Vybrat vše

Neptune, jako optimista Asce musím reagovat na tvou kritiku mého hodnocení počasí:
[quote="[b][color=#FF0000]Asce[/color][/b]"]Dnes byl krásný den.[quote="[color=#FF8000]Neptun[/color]"]S tímto musím nesouhlasit.[/quote][/quote]Ale já dál trvám na tom, že byl krásný den, neboť svítilo sluníčko.

Doporučené barvy pro zvýrazňování nicků členů Pedonie:

Administrátor - barva s kódem #FF0000
Moderátor - barva s kódem #FF8000
VIP člen (Club Pedonia) - barva s kódem #FF80FF
Registrovaný uživatel - barva s kódem #0000FF
Nový člen fóra - barva s kódem #008FFF
Návštěvník fóra - barva s kódem #800000

(Použil jsem barvy, jejichž kódy obsahují pouze hexadecimální číslice 0, 8, F)

Použití označení subjektu, který není členem našeho fóra

Jak bylo výše řečeno, mezi citací a původním příspěvkem není v databázi fóra ve skutečnosti žádná vazba. Toho můžeme využít k zadání prakticky libovolného označení subjektu, na který reagujeme, a to bez ohledu na to, kde se nalézá materiál, z něhož citujeme či na něj jinak reagujeme. Při popouštění fantazie však musíme dát pozor na skloňování - na to, aby naše označení bylo ve vhodném tvaru vůči slovu "píše", a také na to, že za tímto slovem následuje dvojtečka. Tento kousek textu totiž vloží BBCode "quote", ať se nám to hodí nebo ne. Je třeba pohlídat i mezery za slovy.

Příklad:

Chceme se rozhorlit nad neomaleností nějakého novináře, takže chceme poukázat na jeho článek, který nám leží v žaludku. Můžeme to udělat třeba takto:

Nejhorší ze všech jsou ti pedofilové. Všude vlezou. Naštěstí se skoro nemnoží.

Výsledný kód příkladu:

Kód: Vybrat vše

[quote="Nám dobře známý pisálek ve svém trapném článku"]Nejhorší ze všech jsou ti pedofilové. Všude vlezou. Naštěstí se skoro nemnoží.[/quote]

Příklad s vylepšením (slovo "pisálek" bude tučně a sousloví "trapném článku" bude tvořit odkaz na onen článek, zde ovšem pro jednoduchost přímo na náš web) :

Opět se chceme rozhorlit nad neomaleností nějakého novináře, takže chceme poukázat na jeho článek, který nám leží v žaludku. Můžeme to udělat i takto:

Nejhorší ze všech jsou ti pedofilové. Všude vlezou. Naštěstí se skoro nemnoží.

Výsledný kód příkladu:

Kód: Vybrat vše

[quote="Nám dobře známý [b]pisálek[/b] ve svém [url=www.gl.asceroute.com]trapném článku[/url]"]Nejhorší ze všech jsou ti pedofilové. Všude vlezou. Naštěstí se skoro nemnoží.[/quote]

Citace s náhledem obrázku

Stává se, že autor vloží do svého příspěvku celou sérii fotografií. Pokud bych chtěl diskutovat o některé konkrétní, je obtížné vysvětlit, který obrázek mám na mysli. Není praktické říkat něco jako „ta třetí fotografie odshora“, apod. Mnohem lepší je použít citaci, do které je vložen náhled předmětného obrázku.

Příklad citace s náhledem:

Zde pak mohu citovat textovou část původního příspěvku, pokud chci reagovat i na ni...

Tento náhled byl vytvořen použitím následujícího postupu:

1. Zkopíroval jsem si celou adresu zdroje fotografie, ze které chci mít náhled.
2. Zkopírovanou adresu jsem vložil do své budoucí odpovědi.
3. Vložený text jsem uzavřel do BBCode "img".
4. Celý „polotovar“ jsem uzavřel do BBCode "quote", neboli citace.
5. Pokud chci do citace vložit i text, udělám mezeru za koncovou značku BBCode "img" a vepíšu jej na toto místo. Případně různě vypozicuji, aby vše působilo esteticky.

Výsledný kód na mém příkladu vypadá takto:

Kód: Vybrat vše

[quote][img]http://www.asceroute.com/foto_asce/bbcode/38274864_FJK.jpg[/img] Zde mohu citovat...[/quote]

Někdy může vadit, že BBCode "quote" automaticky zmenšuje obrázek (i písmo) na příliš malé rozměry. Pokud chceme obrázek větší, pak místo BBCode "img" použijeme "image" s vhodným parametrem (třeba 250 apod.). V následujícím příkladu je navíc zvětšen i text a posunut dolů:

Zde pak mohu citovat textovou část původního příspěvku, pokud chci reagovat i na ni...

Výsledný kód dle příkladu:

Kód: Vybrat vše

[quote][image=250]http://www.asceroute.com/foto_asce/bbcode/38274864_FJK.jpg[/image]
[size=120]Zde pak mohu citovat textovou část původního příspěvku, pokud chci reagovat i na ni...[/size][/quote]

[Asce]

 
Tabulka, zjednodušená verze s omezenými možnostmi
Obsah kapitoly

• Tabulka, základní varianta
• Tabulka, různá vylepšení
• Tabulka, obrázek jako obsah buňky
• Tabulka, galerie náhledů obrázků

Připomínám, že pro použití nástrojů k úpravě vkládaného textu je lhostejné, zda nejprve tu část textu, kterou chcete upravit, vyberete, a potom použijete příslušný nástroj, nebo naopak nejprve použijete editační nástroj, a teprve poté "dovnitř" vepíšete či vložíte váš text.


Tabulka, základní varianta

Ti z vás, kdo znají html, ví, že pro vytvoření tabulky a doladění jí k obrazu svému, je v tomto jazyku k dispozici řada tagů, z nichž ty mají ještě parametry. Já se ovšem rozhodl do phpBB fóra Pedonia implementovat prostřednictvím BBCode jen to opravdu nejnutnější. Nenaskýtá se tak sice mnoho možností pro estetické úpravy, ale na druhou stranu je takto vytvoření tabulky velmi prosté.

Odpovídající BBCode:

• tab_tab (označení, kde tabulka začíná a kde končí),
• tab_row (označení, kde začíná a kde končí řádek tabulky),
• tab_cell (označení, kde začíná a kde končí obsah buňky)

Syntaxe:

Kód: Vybrat vše

[Tab_tab=kód_vertikálního_odsazení_od_textu_nad tabulkou][/Tab_tab]
[Tab_row][/Tab_row]
[Tab_cell=horizontální_zarovnání_obsahu_buňky: left, center, right, justify][/Tab_cell]

BBCode pro vytvoření tabulky naleznete v komboboxu "Custom BBCodes".

Tabulka nad sebou dynamicky vytváří vertikální odsazení od objektu či textu nad ní. Tento prostor je tím větší, čím má tabulka více řádků a čím ty jsou vyšší. Ve výsledku tento volný prostor nevypadá dobře, proto jej omezuje parametr BBCode "tab_tab". Jde o nezáporné číslo v pixelech, které čím je větší, tím je vertikální odsazení menší. Při tvorbě tabulky je toto nutno vyzkoušet. Jako první "nástřel" použijte hodnotu podle vzorce 20 x (počet_řádků + 1).

Tabulka pod sebou vynechává jednu řádku.

Tabulka je automaticky horizontálně vycentrovaná (a nelze to ovlivnit pomocí BBCode "left", "right" apod.).

Šířka buněk sloupce je automaticky nastavena podle nejširší buňky ve sloupci, výška buněk je automaticky nastavena podle nejvyšší buňky na řádku. Šířka celého řádku včetně ohraničení buněk nesmí být větší než 698 px. Výška řádku není omezena.

Příklad č. 1

Tabulka o dvou sloupcích a dvou řádcích, čili 2 x 2, kde text buněk je po řadě Buňka A, Buňka B, Buňka C, Buňka D. Zarovnání textu vlevo. Tabulka bude mít v tomto příkladu hodnotu parametru BBCode "tab_tab" rovnu nule (tj. nekorigujeme volný prostor nad tabulkou). Všimněme si vertikálního odsazení tabulky od tohoto textu.

Buňka A	Buňka B
Buňka C	Buňka D

Kód příkladu č. 1

Kód: Vybrat vše

[tab_tab=0][tab_row][tab_cell=left]Buňka A[/tab_cell]
[tab_cell=left]Buňka B[/tab_cell][/tab_row]
[tab_row][tab_cell=left]Buňka C[/tab_cell]
[tab_cell=left]Buňka D[/tab_cell][/tab_row][/tab_tab]

Příklad č. 2

Tabulka o dvou sloupcích a dvou řádcích, čili 2 x 2, kde text buněk je po řadě Buňka A, Buňka B, Buňka C, Buňka D. Zarovnání textu vlevo. Tabulka bude mít v tomto příkladu hodnotu parametru BBCode "tab_tab" nastavenu na 60 (tj. dle výše uvedeného doporučení, neb 20 x (2 + 1) = 60). Čím více řádků tabulka má, tím větší je odchylka od tohoto jednoduchého pravidla (pro odsazení tabulky o 6 řádcích je vhodnější místo vypočteného parametru 140 použít parametr 180 či 190). Všimněme si vertikálního odsazení tabulky od tohoto textu.

Buňka A	Buňka B
Buňka C	Buňka D

Kód příkladu č. 2

Kód: Vybrat vše

[tab_tab=60][tab_row][tab_cell=left]Buňka A[/tab_cell]
[tab_cell=left]Buňka B[/tab_cell][/tab_row]
[tab_row][tab_cell=left]Buňka C[/tab_cell]
[tab_cell=left]Buňka D[/tab_cell][/tab_row][/tab_tab]

Tabulka, různá vylepšení

• Odsazení dat od horizontálního ohraničení buňky
  
  Alespoň z mého pohledu největším estetickým prohřeškem až "na dřeň" zjednodušené implementace tabulky, kterou jsem v našem fóru realizoval, je to, že vlastní data jsou "nalepena" na ohraničení buněk. Celek v případě textových dat nevypadá příliš dobře. Jenže pokud do tabulky místo textu vložíme obrázek, což je třeba případ galerie náhledů, potom naopak tuto vlastnost velice oceníme. Jak spojit tyto protichůdné požadavky? Rozhodl jsem se BBCode tabulky nekomplikovat a pro odsazení, pokud jej požadujeme, použít "obchvat" přes BBCode "char".
  
  Zde budiž prozatím řečeno pouze to, že BBCode "char" slouží k vložení speciálních znaků. My jej v daném kontextu použijeme pro vkládání znaku "nezalomitelná mezera". Na rozdíl od běžné mezery, tento znak není nikdy programem fóra ignorován, ale byť je neviditelný, je akceptován jako běžná součást textu. Tedy tam, kde chceme mít odsazení, vložíme "nedělitelnou mezeru".
  
  Kód BBCode "char" s "nedělitelnou mezerou" (jejíž nápis zní "nbsp") je

  Kód: Vybrat vše

  [char]nbsp[/char]
  Tento kód vložíme na tu stranu textu ve všech buňkách, na které jsou buňky zarovnány. Na protilehlé straně stačí vložení k (jednomu) nejdelšímu textu v buňkách sloupce, u odoustranného zarovnání je nutno vložení na obě strany.
  
  Příklad č. 3
  
  Tabulka o dvou sloupcích a dvou řádcích, čili 2 x 2, kde text buněk je po řadě Buňka A, Buňka B, Buňka C, Buňka D. Zarovnání textu vlevo.
  
  
  
  
  

  Buňka A	Buňka B
  Buňka C	Buňka D

  Kód příkladu č. 3

  Kód: Vybrat vše

  [tab_tab=60]
[tab_row]
[tab_cell=left][char]nbsp[/char]Buňka A[char]nbsp[/char][/tab_cell]
[tab_cell=left][char]nbsp[/char]Buňka B[char]nbsp[/char][/tab_cell]
[/tab_row]
[tab_row]
[tab_cell=left][char]nbsp[/char]Buňka C[/tab_cell]
[tab_cell=left][char]nbsp[/char]Buňka D[/tab_cell]
[/tab_row]
[/tab_tab]

  Komentář:
  V příkladu bylo u všech buněk nastaveno zarovnání obsahu vlevo, tj. "tab_cell=left", proto texty všech buněk začínají "nezalomitelnou mezerou". Shodou okolností jsou všechny texty stejně dlouhé, proto u prvního sloupce ("Buňka A" a "Buňka C") musí být "nezalomitelná mezera" na konci textu alespoň v jedné z buněk "A" nebo "C". Analogicky pro konce textu v druhém sloupci ("B" a "D"). Pokud by texty nebyly stejně dlouhé, pak by při zarovnání obsahu buněk vlevo stačilo na pravém konci textů umístit "nedělitelnou mezeru" právě na konci nejdelšího slova.
   
• Vytvoření hlavičky a/nebo patičky tabulky
  
  Vzhledem k tomu, že pro taková vylepšení nemáme žádné BBCode, musíme si vystačit se zvýrazněním textu (řez písma - zejména tučné nebo barva písma).
  
  Příklad č. 4
  
  
  
  
  
  
  
  
  
  
  
  

  Věková kategorie	Účastníků zájezdu
  Batolata	0
  Předškolačky	4
  Školačky	8
  Dorostenky	8
  Celkem	20

  Kód příkladu č. 4

  Kód: Vybrat vše

  [tab_tab=200]
[tab_row]
[tab_cell=left][char]nbsp[/char][b][color=#0000FF]Věková kategorie[/color][/b][char]nbsp[/char][/tab_cell]
[tab_cell=left][char]nbsp[/char][b][color=#0000FF]Účastníků zájezdu[/color][/b][char]nbsp[/char][/tab_cell][/tab_row]
[tab_row][
tab_cell=left][char]nbsp[/char]Batolata[/tab_cell]
[tab_cell=right]0[char]nbsp[/char][/tab_cell]
[/tab_row]
[tab_row]
[tab_cell=left][char]nbsp[/char]Předškolačky[/tab_cell]
[tab_cell=right]4[char]nbsp[/char][/tab_cell]
[/tab_row]
[tab_row]
[tab_cell=left][char]nbsp[/char]Školačky[/tab_cell]
[tab_cell=right]8[char]nbsp[/char][/tab_cell]
[/tab_row]
[tab_row]
[tab_cell=left][char]nbsp[/char]Dorostenky[/tab_cell]
[tab_cell=right]8[char]nbsp[/char][/tab_cell]
[/tab_row]
[tab_row]
[tab_cell=left][char]nbsp[/char][b][color=#0000FF]Celkem[/color][/b][/tab_cell]
[tab_cell=right][b][color=#0000FF]20[/color][/b][char]nbsp[/char][/tab_cell]
[/tab_row]
[/tab_tab]


Tabulka, obrázek jako obsah buňky

Do buňky tabulky můžeme pochopitelně vložit i obrázek. Pokud tak učiníme standardním způsobem, tj. pomocí BBCode "img", bude výsledek neestetický. Totiž v konečném důsledku stránku vykresluje html interpretr, a ten předpokládá, POKUD MU NEŘEKNEME NĚCO JINÉHO, že pod obrázkem bude nějaký další objekt či text, takže aby tyto části stránky, rámu, tabulky, ... na sebe nebyly nehezky nalepené, vloží pod obrázkem několik pixelů širokou mezeru. Takže ve spodní části buňky pak doslova "svítí" vynechaný proužek. Protože právě použití tabulky je účinný a přitom jednoduchý způsob, jak obrázky zarovnat vedle či pod sebe tak, jak si přejeme, implementoval jsem k danému účelu BBCode "tab_img", který právě popsanou vlastnost eliminuje, čili interpretru "řekne", že si žádné místo mimo obrázek vynechat nepřejeme.

Odpovídající BBCode: tab_img
Syntaxe:

Kód: Vybrat vše

[Tab_img=způsob_zarovnání: left, right, top, middle][/Tab_img]

Ve skutečnosti je jedno, jaké zarovnání použijeme (osobně používám výhradně "left"), protože výsledkem je vždy to, že obrázek vyplní celý prostor buňky (pokud ovšem máme ve sloupci tabulky buňky stejně široké a na řádku tabulky stejně vysoké, tj. v tomto případě obrázky takto dle sloupců, resp. řádků šířkou či výškou stejné).

BBCode "tab_img" naleznete v komboboxu "Custom BBCodes".

BBCode "tab_img" by šel použít k zarovnání jednoho obrázku vůči svislým liniím oblasti vyhrazené pro příspěvek, tedy i mimo tabulku, avšak toto nedává příliš smysl, protože jednodušeji toho dosáhneme pomocí BBCode "centre", "right" apod.

Příklad č. 5




Kód příkladu č. 5

Kód: Vybrat vše

[Tab_tab=60][Tab_row][Tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_01.jpg[/tab_img][/Tab_cell]
[Tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_02.jpg[/tab_img][/Tab_cell][/Tab_row]
[Tab_row][Tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_03.jpg[/tab_img][/Tab_cell]
[Tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_04.jpg[/tab_img][/Tab_cell][/Tab_row]
[/Tab_tab]

Tabulka, galerie s náhledy obrázků

Smyslem používání galerií náhledů je, aby zobrazení stránky s obrázkovými příspěvky probíhalo pokud možno svižně. Nejprve se totiž načtou jen malé soubory z galerie náhledů, zatímco objemově náročnější velkorozměrové obrazy až po kliknutí, které uskutečníme na základě naší vůle, že chceme zobrazit to, co nás dle galerie náhledů zaujalo. Než tento akt naší vůle provedeme, jsou větší obrazy ukryty pomocí spojleru. Načtou se až po jeho rozbalení. Přitom se v daný okamžik rozbaluje obsah nejvýše jednoho příspěvku, zatímco při běžném způsobu by se načítaly obrazy celé strany, což může být až 20 příspěvků, neboli odhadem klidně i 200 relativně velkých souborů.

Jak lze odvodit z předchozí kapitolky, galerii náhledů vytvoříme pomocí tabulky, do jejíchž buněk vkládáme obrázky pomocí BBCode "tab_img". Všechny obrázky nemusí mít vždy stejné rozměry, ale zcela nezbytné je dodržet tato pravidla:

1. Obrázky na stejném řádku tabulky musí mít stejnou výšku.
2. Obrázky ve stejném sloupci tabulky musí mít stejnou šířku.

Nejjednodušší je pochopitelně situace, kdy máme všechny obrázky o stejných rozměrech. V opačném případě musíme být velmi obezřetní, protože přehození pořadí obrázků v kódu tabulky, ji zcela "rozhází".

Doporučuji, aby jednotlivé obrázkové příspěvky neobsahovaly více než 10 obrázků. Jinak totiž čtenáři ztrácí koncentraci, a záměr autora se míjí účinkem. Pokud máme k tématu velké množství obrazového materiálu, doporučuji vše rozdělit do několika příspěvků, a ty vkládat postupně, s odstupem několika dní. Aby šla vytvořit galerie náhledů snadno a stejně tak i dobře vypadala, jsou vhodné počty obrázků: 4 (2 x 2), 6 (3 x 2, méně esteticky dobře vypadá 2 x 3), 8 (4 x 2), 9 (3 x 3, toto ovšem již působí poněkud komixovým dojmem).

V případě, že máme takový počet obrázků, se kterým nejde vytvořit smysluplná tabulka, tedy 5 či 7, přičemž "nadbytečného" obrázku se nechceme v příspěvku vzdát, zvolíme jeden obrázek jako upoutávkový. S výhodou, máme-li takový, použijeme ten, který má menší šířku než ostatní, přičemž je-li to možné, doporučuji ji upravit dle textu níže.

Celý příspěvek s galerií obrázků má tyto části:

• Záhlaví čili upoutávku - maximálně jeden horizontálně vycentrovaný obraz, nejlépe takové šířky, která je součtem šířek obrázků řádku tabulky galerie plus počet ohraničení buněk řádku (tedy pro obrázky galerie široké 210 px, po dvou na řádku, vychází šířka upotávkového obrázku na 423 px). Upoutávku používáme pouze tehdy, pokud počet obrázků k zobrazení vychází na "nešikovné" číslo (5 či 7).
• Vlastní galerie - tabulka s malými obrázky, tj. náhledy velkých obrázků skrytých ve spojleru. Doporučená šířka jednotlivého obrázku je 210 px pro tabulku se dvěma sloupci, resp. 200 px pro tabulku se třemi sloupci.
• Spojler s obrazovým materiálem - čili to, kvůli čemu příspěvek vůbec vznikl. Na první (samostatnou) řádku ve spojleru doporučuji z estetického důvodu vložit nám již známý kód s "nedělitelnou mezerou", která zde zaručí odřádkování.
• Zápatí - odkazy a zdroje použitého materiálu apod.

Příklad č. 6

Upoutávka

Galerie náhledů

4 obrázky ve větším rozlišení

 

Odkazy:

odkaz 1 a zdroj 1: www.schule-und-familie.de
odkaz 2 a zdroj 2: 7-themes.com
odkaz 3 a zdroj 3: www.slupsk.pl
odkaz 4 a zdroj 4: campingandcaravanningclub.co.uk
odkaz 5 a zdroj 5: abcnews.go.com

Kód celého příkladu č. 6

Kód: Vybrat vše

[b]Upoutávka[/b]
[centre][img]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_403.jpg[/img][/centre]
[b]Galerie náhledů[/b]

[tab_tab=60][tab_row][tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_01.jpg[/tab_img][/tab_cell]
[tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_02.jpg[/tab_img][/tab_cell][/tab_row]
[tab_row][tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_03.jpg[/tab_img][/tab_cell]
[tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_04.jpg[/tab_img][/tab_cell][/tab_row][/tab_tab]
[spoiler=4 obrázky ve větším rozlišení][char]nbsp[/char]
[image=698]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_01_700.jpg[/image]
[image=698]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_02_700.jpg[/image]
[image=698]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_03_700.jpg[/image]
[image=698]http://www.asceroute.com/foto_asce/bbcode/tab/Obrazek_04_700.jpg[/image][/spoiler]
Odkazy:

[url=https://www.schule-und-familie.de/assets/images/eltern-tipps/fruehling.jpg]odkaz 1[/url] a zdroj 1: [url=https://www.schule-und-familie.de/familie/familienleben-und-freizeit/naturtagebuch.html]www.schule-und-familie.de[/url]
[url=http://7-themes.com/data_images/collection/4/4455511-cute-baby-wallpapers.jpg]odkaz 2[/url] a zdroj 2: [url=http://7-themes.com/collections/cute-baby-wallpapers/]7-themes.com[/url]
[url=http://www.slupsk.pl/wp-content/uploads/2016/11/girl-1252739_960_720.jpg]odkaz 3[/url] a zdroj 3: [url=http://www.slupsk.pl/zostan-wolontariuszem-akademii-przyszlosci-58605/]www.slupsk.pl[/url]
[url=https://www.campingandcaravanningclub.co.uk/readycamp/media/ReadyCampCMS/ReadyCampMedia/Lifestyle%20and%20General%20Images/Large%20Images%201366x768/Lifestyle-General-Little-Girl-bluebells-early-spring-1366x768.jpg?width=1366&height=768&ext=.jpg]odkaz 4[/url] a zdroj 4: [url=https://www.campingandcaravanningclub.co.uk/readycamp/locations/glamping-central-england/staffordshire/alton/#section-club-site]campingandcaravanningclub.co.uk[/url]
[url=https://s.abcnews.com/images/Lifestyle/HT-toddler-cow5-cf-170127_4x3_992.jpg]odkaz 5[/url] a zdroj 5: [url=https://abcnews.go.com/Lifestyle/girl-befriends-baby-cow-lost-mom/story?id=45088386]abcnews.go.com[/url]

[Asce]

 
Multimédia
Obsah kapitoly

• Multimédia, audio
• Multimédia, video

Připomínám, že pro použití nástrojů k úpravě vkládaného textu je lhostejné, zda nejprve tu část textu, kterou chcete upravit, vyberete, a potom použijete příslušný nástroj, nebo naopak nejprve použijete editační nástroj, a teprve poté "dovnitř" vepíšete či vložíte váš text.

Audio

Odpovídající BBCode: audio
Syntaxe: [audio]kompletní_adresa_audiosouboru[/audio]

Nástroj "audio" najdete v nabídce komboboxu "Custom BBCodes".

Při použití tohoto BBCode je vyvolán minipřehrávač, který umožňuje jednoduché operace (skladbu spustit, zastavit, posun ve skladbě, nastavení hlasitosti). Přehrávač zvládá běžné audiosoubory, neumí přehrávat zvukovou stopu z videa.

Příklad:

Adresa audiosouboru je http://www.asceroute.com/gl/hudba/Elan_ ... kamene.mp3

phpBB [audio]

Kód příkladu:

Kód: Vybrat vše

[audio]http://www.asceroute.com/gl/hudba/Elan_Valiace_sa_kamene.mp3[/audio]

Video

Odpovídající BBCode: video
Syntaxe: [video]kompletní_adresa_videosouboru[/video]

Nástroj "video" najdete v nabídce komboboxu "Custom BBCodes".

Při použití tohoto BBCode je vyvolán minipřehrávač, který umožňuje jednoduché operace (skladbu spustit, zastavit, posun ve skladbě, nastavení hlasitosti). Nástroj umožňuje přehrávat běžné videoformáty nejen z YouTube, ale odkudkoliv, kde jsou volně přístupné.

Příklad:

Adresa videosouboru je https://www.youtube.com/watch?v=FAlys2LOX5Q

phpBB [video]

Kód příkladu:

Kód: Vybrat vše

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

[Asce]

 
Ostatní nástroje
Obsah kapitoly

• Spojler (BBCode "spoiler")
• Vkládání speciálních znaků (BBCode "char")
• Vodorovná oddělovací čára
• Zobrazení kódu (BBCode "code")

Připomínám, že pro použití nástrojů k úpravě vkládaného textu je lhostejné, zda nejprve tu část textu, kterou chcete upravit, vyberete, a potom použijete příslušný nástroj, nebo naopak nejprve použijete editační nástroj, a teprve poté "dovnitř" vepíšete či vložíte váš text.

Spojler (BBCode "spoiler")

Spojler slouží ke skrytí / odkrytí textu, který z nějakého důvodu autor příspěvku nechce zobrazit čtenáři ihned. Mohou to být vyluštění hádanek či řešení úkolů, podrobnosti k příspěvku, které by nemusely zajímat každého apod. Autor příspěvku přímo do počáteční značky BBCode "spoiler" zapíše, proč by případně měl čtenář kliknout na zvýrazněné tlačítko. Text ke skrytí (odkrytí) se zapíše mezi počáteční a koncovou značku BBCode. Pozor, pokud budete značku tohoto BBCode zapisovat ručně: česky se ustálil výraz "spojler", ale pro příslušný kód se používá jako klíčové slovo "spoiler".

Odpovídající BBCode: "spoiler"
Syntaxe:

Kód: Vybrat vše

[spoiler=nějaký_váš_text_proč_má_čtenář_kliknout_na_tlačítko]text_ke_skrytí[/spoiler]

Nástroj "spoiler" najdete v nabídce komboboxu "Custom BBCodes".

Příklad:

Příklad spojleru. Pro odkrytí či naopak skrytí textu klikněte sem →

A tady je onen skrytý text

Kód: Vybrat vše

[spoiler=Příklad spojleru. Pro odkrytí či naopak skrytí textu klikněte sem →]A tady je onen skrytý text[/spoiler]

Poznámka:

Má-li být součástí skrývaného textu obrázek, pak, pokud jej "dovnitř spojleru vložíte běžným BBCode "img", bude z něj automaticky vytvořena miniatura (náhled). Pokud chcete tomuto chování zabránit (typicky v obrázkovém příspěvku, kdy jsou z důvodu rychlosti načítání stránky nejprve třeba v tabulce zobrazeny náhledy = malé souborky, zatímco obrázky ve větším formátu se zpřístupní až po rozkliknutí spojleru), pak je nutno pro vložení obrázku použít BBCode "image", kde (jako obvykle) jeho parametrem (šířka v pixelech) bude celé číslo do 698.


Vkládání speciálních znaků (BBCode "char")

Pomocí tohoto BBCode si můžete zjednodušit zadávání některých symbolů, které nejsou na klávesnici přímo zobrazeny. Mezi počáteční a koncovou značku tohoto nástroje vložte příslušný zápis daného symbolu. Při zobrazení příspěvku dojde ke konverzi na příslušný znak.

Tento BBCode je implementací html znakových entit. Proto, pokud budete potřebovat do svého příspěvku vložit takový znak, který nenajdete jako níže uvedený příklad, ve svém webovém prohlížeči zadejte k vyhledání "html entity" a ve výsledcích hledání jistě objevíte, jaký zápis přísluší vámi požadovanému znaku.

Podobnost a rozdíl vypsání znaku v html a pomocí BBCode (jako příklad použit znak "copyright", jehož zápis je "copy")

Kód: Vybrat vše

HTML:
©

BBCode:
[char]copy[/char]

Nástroj "char" najdete v nabídce komboboxu "Custom BBCodes".

Seznam s příklady (znak - zápis jsem pro přehlednost vybarvil modře a mírně oproti okolnímu textu zvětšil, jeho zápis do BBCode a případně poznámka):

• € euro
• $ dollar
• ½ frac12
• ¾ frac34 (podobně jiné zlomky, kde v čitateli i jmenovateli je jediná číslice)
• © copy
• ® reg
• ± plusmn
• ° deg (značka stupně)
• ‰ permil (znak promile)
• † dagger (křížek)
• nedělitelná mezera nbsp (nedělitelná mezera není vidět, proto jsem ji nahradil slovním opisem)
• → rarr (z anglického "rightwards arrow")
• ← larr (z anglického "leftwards arrow")
• ↑ uarr (z anglického "upwards arrow")
• ↓ darr (z anglického "downwards arrow")
• ↔ harr (pravo-levá šipka, left right arrow)
• « laquo (francouzské uvozovky, anglicky "left-pointing double angle quotation mark")
• » raquo (francouzské uvozovky, anglicky "right-pointing double angle quotation mark")
• × times ("správné" znaménko pro "krát")
• ß szlig (německé ostré "s")
• α alpha (malé řecké písmeno "alfa")
• β beta (malé řecké písmeno "beta")
• γ gamma (malé řecké písmeno "gama")
• δ delta (malé řecké písmeno "delta")
• Δ Delta (velké řecké písmeno "Delta")
• Σ Sigma (velké řecké písmeno "Sigma", znak pro součet)
• ω omega (malé řecké písmeno "omega")
• Ω Omega (velké řecké písmeno "Omega")
• • bull (puntík, anglicky "bullet", black small circle)
• … hellip (tři vodorovné tečky vespod; horizontal ellipsis, three dot leader)
• ′ prime (minuta, stopa)
• ″ Prime (vteřina, palec)
• − minus (matematické znaménko "mínus")
• ∞ infin (matematický symbol pro "nekonečno")
• ≠ ne (matematické znaménko pro nerovnost)
• ≡ equiv (ekvivalence, znak pro totožnost)
• ≤ le (menší nebo rovno)
• ≥ ge (větší nebo rovno)
• < lt (menší než)
• > gt (větší než)
• ◊ loz (kosočtverec)
• ♥ hearts (srdce)
• & amp ("a", "et", ampersand)
• ˜ tilde (vlnovka, tilda)
• – ndash (menší pomlčka)
• — mdash (dlouhá pomlčka)

Odpovídající kód vypadá třeba pro euro takto:

Kód: Vybrat vše

[char]euro[/char]

Nicméně s ničím, a platí to i pro speciální znaky, se to nemá přehánět. Posuďte tuto větu:
"Ať již provedete jakoukoliv estetickou úpravu, pro nás je α a ω vlastní obsah sdělení."


Vodorovná oddělovací čára

Vodorovná oddělovací čára může sloužit k přehlednému oddělení jednotlivých částí rozsáhlejšího příspěvku apod. Čára je vždy zarovnaná doleva a nelze ji zarovnat jinak pomocí BBCode "centre", "right" apod. Ctí však "odstavcové" BBCode, takže například při jejím použití uvnitř seznamu bude začínat nikoliv na levé straně psací oblasti, ale pod značkou odrážky (čísla v číslovaném seznamu).

Odpovídající BBCode: "cara"
Syntaxe:

Kód: Vybrat vše

[cara=počet_pixelů_délky_nejvýše_698][/cara]

Nástroj "cara" najdete v nabídce komboboxu "Custom BBCodes". Čára pod sebou automaticky vynechává řádku.

Příklad (čára délky 400 px)

---

Kód příkladu:

Kód: Vybrat vše

[cara=400][/cara]

Zobrazení kódu (BBCode "code")

Tento BBCode slouží k tomu, aby bylo možno zobrazit, jak se zapíše nějaký kód. Pokud bychom vhodný nástroj neměli, náš text by byl interpretován, a vlastně bychom neukázali nic.

Odpovídající BBCode: "code"
Syntaxe:

Kód: Vybrat vše

[code]text_který_nebude_interpretován[/code]

BBCode "code" za sebou vynechává řádku. Ikonku pro "code" najdete v liště základních nástrojů editoru, vypadá takto:

Pokud bychom někomu chtěli podrobně sdělit, jak se například udělá, aby část textu byla tučným řezem písma, nejspíš bychom mu chtěli napsat něco takovéhoto:
"Svůj text vložíš mezi počáteční a koncovou značku BBCode "B", přesně takto: můj ukázkový text."
Když se pak na svůj výtvor podíváme, uvidíme slova "můj ukázkový text" tučně, a adresát stále neví, jak jsme to provedli. Abychom příslušnou možnost měli, "zabalíme" předmětnou část textu do BBCode "code":
"Svůj text vložíš mezi počáteční a koncovou značku BBCode "B", přesně takto:

Kód: Vybrat vše

[b]můj ukázkový text[/b]

Pomocí tohoto nástroje také přeposíláme webové adresy, protože zejména ty delší interpretr zkrátí tak, že prostředek adresy nahradí třemi tečkami. Sice lze takový odkaz i tak získat, ale nikoliv prostým použitím Ctrl + C, ale je nutno vyvolat kontextovou nabídku a z ní vybrat příkaz "zkopírovat odkaz" (jméno příkazu se může v různým prohlížečích poněkud lišit). Jednodušší se mi jeví použít BBCode "code".

Kliknutím na tlačítko "Vybrat vše" v boxu, který použití BBCode "code" vytvoří, dojde k vybrání veškerého textu uvnitř něj (vlastního neinterpretovaného obsahu). To s výhodou využijeme zejména u složitějších struktur. Pak již stačí použít notoricky známou zkratku pro kopírování Ctrl + C...

[Asce]

 
Jak psát dobře příspěvky - několik rad začínajícím vkladatelům
Především bych na tomto místě chtěl zdůraznit, že na Pedonii si vážíme svých přispěvatelů. Rozumíme a respektujeme to, že ne každý má spisovatelský talent, natož aby byl, jak se říká, vypsaný. To znamená, že i když se nějaká ta chybka do vašeho textu vloudí, až na naprosté výjimky to nijak neřešíme*. Jsme rádi, když komunitě sdělujete své pocity, diskutujete, přinášíte náměty či něco napíšete jen tak pro radost svou i ostatních. Rozhodně nelpíme na formě, stylu či bezchybnosti. Důležité jsou vaše myšlenky.

* Opravujeme překlepy v odborných příspěvcích či jinde takové, kdy hrozí nepochopení textu čtenáři.

Někteří vkladatelé by mohli být rádi za to, aby jejich tvorba, vyjádření vlastních myšlenek, byla co nejsprávnější i po formální stránce. On se totiž každý takový počin dá chápat i jako trénink pro jiné případy - sepisování životopisu, různé žádosti, komunikace s úřady, se zaměstnavatelem či zákazníkem apod.

Na přiloženém lehce humorném obrázku je uvedeno deset rad, z nichž každá obsahuje právě ty chyby, které si vzala za cíl kritizovat:



Vysvětlivky:

1. Rada říká, abychom se ve svém textu vyhýbali frázím, přičemž tak (zbytečně) činí právě za pomoci fráze.
2. Konkrétní víceméně je člověk vždycky. Do složek onoho slova se totiž vejde prakticky všechno. Věta, ačkoliv přací, ve skutečnosti neříká nic o tom, co se po nás doopravdy chce.
3. Věta hned na dvou místech obsahuje chybnou interpunkci: a) za slovem "správně" nenalezneme žádný důvod, proč by tam měla být čárka a b) interpunkční znaménko "tři tečky vodorovně dole" se píše na konci věty stejně jako "jednoduchá" tečka, tedy ihned za poslední písmeno posledního slova.
4. Nádherná ukázka zakomplexovanosti autora takového příspěvku. Aby se zbavil své nejistoty, že nebude dost přesvědčivý, snaží se "být za odborníka" a čtenářovy případné námitky "umlátit" cizími slovy.
   Co vlastně chtěl autor říci?

   Volněji: "Nenadužívej cizí slova. Ani v tomto případě."
   Doslovněji: "Nesměřuj k uvádění (mnoha) cizích slov. Ani pro tento případ."
5. S větším patosem (čili afektovaněji neboli vzrušeněji, s přehnaným dojetím) to snad ani říci nešlo.
6. Ostatní body jsou číslovány pomocí číslice a oblé závorky, a najednou tu máme označení slovní s dvojtečkou, čili nekonzistentnost. Pokud si zvolíme nějaký styl, měli bychom jej v jednom příspěvku dodržovat a nemíchat s jinými. To se samozřejmě netýká pouze bodů seznamu.
7. K tomuto bodu je komentář zbytečný.
8. Řečnické otázky někdy působí jako nadbytečná "vata". Dle mého názoru však zase jindy mohou vhodně uvést následující text. Jen se to nesmí přehánět.
9. Nu, ještě že ne miliardkrát. Dovolávání se obřích počtů případů, kdy s námi někdo souhlasí, kdy si lidé něco myslí apod., je nejen nevhodné a vylhané (dotyčný by takové počty nedokázal ověřit), ale jde přímo o tzv. řečnický trik. Jeho nejtěžší formou je používání Velkého kvantifikátoru (každý, všichni, vždycky, nebo v záporu nikdo, nikdy...).
10. Rozkošná ukázka toho, že autor se nenamáhal udělat to, k čemu jej daný bod vybízí. Jednak jde o chybné číslování a jednak tvar slovesa na konci věty není ve shodě se zbytkem přísudku.

[Asce]

 
Tabulka, složitější verze s více možnostmi

Implementace tabulek dle zjednodušené verze, podrobně viz zde, umožňuje dobrou práci s obrázky (při shodných velikostech obrázky vyplní celý prostor buněk, jež jsou orámovány černou čarou 1 px), avšak je méně vhodná pro textový obsah. Text je totiž "nalepen" přímo na rám buněk, což nevypadá hezky. Tomuto chování se sice dá zabránit šikovným vkládáním "nezalomitelné mezery" (viz pasáž o BBCode "Char"), ale to je neintuitivní, a navíc díky responzivnímu vzhledu fóra (zejména zalamování řádek) poplatnému rozlišení monitoru, není zaručeno, že čtenář uvidí totéž, co tvůrce obsahu.

Pro zlepšení možností přizpůsobit vzhled tabulky tomu, jak autorovi co nejvíce vyhovuje, byly dodatečně doprogramovány další dva tagy. Ty lze kombinovat v jisté míře i s tagy pro zjednodušenou verzi tvorby tabulek. Nejkomplexnější možnosti nabídne tato sada BBCode:

• tab_tab_border (označení, kde tabulka začíná a kde končí),
• tab_row (označení, kde začíná a kde končí řádek tabulky),
• tab_cell_ods (označení, kde začíná a kde končí obsah buňky)

Syntaxe:

Kód: Vybrat vše

[tab_tab_border=kód_vertikálního_odsazení_od_textu_nad_tabulkou, šířka_rámu_okolo_tabulky[/tab_tab_border]

[tab_row][tab_row]

[tab_cell_ods=horizontální_zarovnání_obsahu_buňky: left | center | right | justify, odsazení_obsahu_od_okraje_levé: px, odsazení_obsahu_od_okraje_pravé: px, odsazení_obsahu_od_okraje_horní: px, odsazení_obsahu_od_okraje_spodní: px, barva_rámu: anglické_slovo_nebo_hexadecimální_hodnota, tloušťka_rámu: px][/tab_cell_ods]

BBCode pro vytvoření tabulky naleznete v komboboxu "Custom BBCodes".

Příklad tabulky připravené jednoduššími BBCode

Obsah je "nalepen" na hrany buněk, buňky ohraničeny černou čarou tloušťky 1 px, ohraničení celé tabulky je černou čarou tloušťky 1 px a splývá s ohraničením buněk. Všechny zmíněné hodnoty jsou nastaveny automaticky, uživatel je nemůže změnit.

Kód: Vybrat vše

[tab_tab=50][tab_row][tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/01_62297233vtm.jpg[/tab_img][/tab_cell]
[tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/02_62297234vhi.jpg[/tab_img][/tab_cell][/tab_row]
[tab_row][tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/04_62313362ptt.jpg[/tab_img][/tab_cell]
[tab_cell=left][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/05_62313366swk.jpg[/tab_img][/tab_cell][/tab_row][/tab_tab]

Příklad tabulky připravené hybridně

Následující tabulka je připravena pomocí jednoduchého BBCode pro tabulku jako celek (tab_tab), avšak pro buňky je použit BBCode tab_cell_ods (nastavení barvy na "blue" a tloušťky rámu na 2 px).

Kód: Vybrat vše

[tab_tab=40][tab_row][tab_cell_ods=left,0,0,0,0,blue,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/01_62297233vtm.jpg[/tab_img][/tab_cell_ods]
[tab_cell_ods=left,0,0,0,0,blue,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/02_62297234vhi.jpg[/tab_img][/tab_cell_ods][/tab_row]
[tab_row][tab_cell_ods=left,0,0,0,0,blue,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/04_62313362ptt.jpg[/tab_img][/tab_cell_ods]
[tab_cell_ods=left,0,0,0,0,blue,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/05_62313366swk.jpg[/tab_img][/tab_cell_ods][/tab_row][/tab_tab]

Příklad tabulky připravené hybridně

Následující tabulka je připravena pomocí jednoduchého BBCode pro tabulku jako celek (tab_tab), avšak pro buňky je použit BBCode tab_cell_ods (nastavení odsazení od všech hran na 2 px, nastavení barvy na "blue" a tloušťky rámu na 2 px).

Kód: Vybrat vše

[tab_tab=40][tab_row][tab_cell_ods=left,2,2,2,2,blue,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/01_62297233vtm.jpg[/tab_img][/tab_cell_ods]
[tab_cell_ods=left,2,2,2,2,blue,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/02_62297234vhi.jpg[/tab_img][/tab_cell_ods][/tab_row]
[tab_row][tab_cell_ods=left,2,2,2,2,blue,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/04_62313362ptt.jpg[/tab_img][/tab_cell_ods]
[tab_cell_ods=left,2,2,2,2,blue,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/05_62313366swk.jpg[/tab_img][/tab_cell_ods][/tab_row][/tab_tab]

Příklad tabulky připravené s nejsložitějšími BBCode (odstranění všech rámů)

Následující tabulka je připravena tak, aby obsah jednotlivých buněk jakoby "visel" na pozadí příspěvku, tedy bez všech rámů. Pro tabulku jako celek je použit BBCode tab_tab_border (kromě standardní veličiny pro vertikální odsazení od objektů nad tabulkou i šířka rámu celé tabulky, zde 0 px) a pro buňky je použit BBCode tab_cell_ods (nastavení odsazení od všech hran na 2 px, nastavení barvy na hodnotu E9E5DC a tloušťky rámu na 2 px).

Poznámka:

Podkladové barvy příspěvků se na našem fóru střídají - liché příspěvky mají pozadí tmavší, sudé příspěvky světlejší.

Podkladové barvy příspěvků:
liché = tmavé: E9E5DC
sudé = světlé: F4F1E8

Kód: Vybrat vše

[tab_tab_border=40,0][tab_row][tab_cell_ods=left,2,2,2,2,E9E5DC,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/01_62297233vtm.jpg[/tab_img][/tab_cell_ods]
[tab_cell_ods=left,2,2,2,2,E9E5DC,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/02_62297234vhi.jpg[/tab_img][/tab_cell_ods][/tab_row]
[tab_row][tab_cell_ods=left,2,2,2,2,E9E5DC,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/04_62313362ptt.jpg[/tab_img][/tab_cell_ods]
[tab_cell_ods=left,2,2,2,2,E9E5DC,2][tab_img=left]http://www.asceroute.com/foto_asce/letni_obleceni/93568/200/05_62313366swk.jpg[/tab_img][/tab_cell_ods][/tab_row][/tab_tab_border]

[Asce]

 
Multimédia, video z rámu cizí stránky (BBCode iframe)
Pro embedování videí, která běží v rámu nějaké cizí stránky, slouží BBCode iframe. Ten je zjednodušenou analogií html tagu iframe, protože jsem při jeho programování zahrnul jen nejnezbytnější minimum nastavovacích prvků. Těmi jsou kompletní URL adresa videa a dále pak už jen jeho šířka a výška v pixelech.

Stránka, která zdrojový rám s videem zobrazuje, musí podporovat jeho embedování, což se projeví tím, že po kliknutí pravým tlačítkem myši na video se v zobrazené nabídce objeví i položka "Zkopírovat kód pro vložení na stránky" (nebo podobného znění). Zde je úskalí v tom, že zdrojová stránka "ví", kam se její video embeduje a může disponovat prostředky, jak zabránit embedování právě tam. Naše aktuální "obrana" proti tomu je ta, že jednak je náš příslušný příspěvek za heslem, a jednak url fóra (asceroute.com) nezní nijak nápadně. Pravděpodobně bychom měli zásadní problémy tohoto typu tehdy, pokud by Pedonia běžela na své nativní doméně pedonia.com.

Poznámly k parametrům BBCode iframe:

• V BBCode musí být URL kompletní a stejně s dalšími parametry se nevkládá do uvozovek, jako je tomu v html tagu.
• Jednotlivé parametry se výjimečně oproti ostatním BBCode oddělují znakem středník (;).
• Pokud chceme měnit rozměry vkládaného videa, je zapotřebí tak činit proporcionálně (např. pokud měním šířku na polovinu, musím změnit i výšku na polovinu).

Syntaxe BBCode iframe:

Kód: Vybrat vše

[iframe=URL;šířka_v_px;výška_v_px][/iframe]

Po kliknutí pravým tlačítkem myši na zdrojové video vybereme nabídku "Zkopírovat kód pro vložení na stránky". Obsah schránky pak pomocí ctrl + v vložíme do svého budoucího příspěvku jako dočasný, pomocný text (po jeho využití jej smažeme). Dostaneme něco takového:

<iframe width="1280" height="720" src="https://www.youtube.com/embed/s8hh1FV67F8" title="妞妞打经典的闽南语歌曲，节奏和旋律太好听了!#架子鼓 #妞妞架子鼓" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>

Zde pro názornost zvýrazním, co nás bude na vloženém pomocném textu zajímat:

<iframe width="1280" height="720" src="https://www.youtube.com/embed/s8hh1FV67F8" title="妞妞打经典的闽南语歌曲，节奏和旋律太好听了!#架子鼓 #妞妞架子鼓" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>

Nyní si rozmyslím, zda mi původní šířka bude vyhovovat či nikoliv (např. max. šířka pro vkládání do našeho fóra je 698 px). V ukázkovém případu jsem se rozhodl rozměry změnit na poloviční:
šířka 1280 px → 640 px, resp. výška 720 px → 360 px.

Kód embedovaného videa z příkladu:

Kód: Vybrat vše

[iframe=https://www.youtube.com/embed/s8hh1FV67F8;640;360][/iframe]

Výsledek embedování - video dle příkladu (ještě jsem použil vycentrování pomocí BBCode centre):


Poznámka:

S videi bychom to neměli přehánět. Jejich adresy se často mění a příspěvek je pak trvale a neopravitelně poškozen (novou adresu se podaří dohledat jen výjimečně a navíc opět ne natrvalo). Výsledkem je pak smutná "alej" smutných příspěvků o ničem. Lépe je kombinovat v příspěvku text, fotografie a případně na doplnění jedno video. Text i fotografie jsou zálohovány, videa zálohovat nemohu.