Demonstrace použití wiki-pluginu WRAP

Následující text je výtahem základního použití wiki-pluginu wrap. Při sepsiování tohoto textu bylo čerpáno z: https://www.dokuwiki.org/_media/plugin:wrap_plugin_example7.png

Základní syntaxe

Používá se párová značka WRAP nebo wrap. Tento tag napsaný velkými písmeny vede k vytvoření DIVu na úrovni HTML kódu. Tag napsaný malým písmem vede k vytvoření SPANu. WRAP je tedy určen pro velký obsah, zatímco wrap pro malý (jednořádkový) obsah.

<WRAP classes #id width :language>
"velký" obsah
</WRAP>

<wrap classes #id width :language> "malý" obsah </wrap>

Z přehldu syntaxe je patrné, co se v tagu definuje, je to: třída, identifikátor, šířka a jazyk. Tagy Wrap lze do sebe zanořovat a vytvářet tak tabulky, definovat šířku sloupců každého vnořeného tagu (jde v podstatě o tabulku), apod.

Příklady

Boxy

INFO Box

<WRAP info 300px>INFO Box</WRAP>

Třída info, ostré rohy, šířka 300px.

INFO Box, zaoblený

<WRAP round info 300px>INFO Box, zaoblený</WRAP>

Třída info, zaoblené rohy, šířka 300px.

TIP Box

<WRAP tip 300px>TIP Box</WRAP>

Třída tip, ostré rohy, šířka 300px.

TIP Box, zaoblený

<WRAP round tip 300px>TIP Box, zaoblený</WRAP>

Třída tip, zaoblené rohy, šířka 300px.

IMPORTANT Box

<WRAP important 300px>IMPORTANT Box</WRAP>

Třída important, ostré rohy, šířka 300px.

IMPORTANT Box, zaoblený

<WRAP round important 300px>IMPORTANT Box, zaoblený</WRAP>

Třída important, zaoblené rohy, šířka 300px.

ALERT Box

<WRAP alert 300px>ALERT Box</WRAP>

Třída alert, ostré rohy, šířka 300px.

ALERT Box, zaoblený

<WRAP round alert 300px>ALERT Box, zaoblený</WRAP>

Třída alert, zaoblené rohy, šířka 300px.

HELP Box

<WRAP help 300px>HELP Box</WRAP>

Třída help, ostré rohy, šířka 300px.

HELP Box, zaoblený

<WRAP round help 300px>HELP Box, zaoblený</WRAP>

Třída help, zaoblené rohy, šířka 300px.

DOWNLOAD Box

<WRAP download 300px>DOWNLOAD Box</WRAP>

Třída download, ostré rohy, šířka 300px.

DOWNLOAD Box, zaoblený

<WRAP round download 300px>DOWNLOAD Box, zaoblený</WRAP>

Třída download, zaoblené rohy, šířka 300px.

TODO Box

<WRAP todo 300px>TODO Box</WRAP>

Třída todo, ostré rohy, šířka 300px.

TODO Box, zaoblený

<WRAP round todo 300px>TODO Box, zaoblený</WRAP>

Třída todo, zaoblené rohy, šířka 300px.

Poznámky (Safety Notes)

DANGER Note

<WRAP danger 300px>DANGER Note</WRAP>

Třída danger, ostré rohy, šířka 300px.

DANGER Note, zaoblený

<WRAP round danger 300px>DANGER Note, zaoblený</WRAP>

Třída danger, zaoblené rohy, šířka 300px.

WARNING Note

<WRAP warning 300px>WARNING Note</WRAP>

Třída warning, ostré rohy, šířka 300px.

WARNING Note, zaoblený

<WRAP round warning 300px>WARNING Note, zaoblený</WRAP>

Třída warning, zaoblené rohy, šířka 300px.

CAUTION Note

<WRAP caution 300px>CAUTION Note</WRAP>

Třída caution, ostré rohy, šířka 300px.

CAUTION Note, zaoblený

<WRAP round caution 300px>CAUTION Note, zaoblený</WRAP>

Třída caution, zaoblené rohy, šířka 300px.

NOTICE Note

<WRAP notice 300px>NOTICE Note</WRAP>

Třída notice, ostré rohy, šířka 300px.

NOTICE Note, zaoblený

<WRAP round notice 300px>NOTICE Note, zaoblený</WRAP>

Třída notice, zaoblené rohy, šířka 300px.

SAFETY Note

<WRAP safety 300px>SAFETY Note</WRAP>

Třída safety, ostré rohy, šířka 300px.

SAFETY Note, zaoblený

<WRAP round safety 300px>SAFETY Note, zaoblený</WRAP>

Třída safety, zaoblené rohy, šířka 300px.

Zarovnávání textu

Text ve WAPech lze zarovnávat dle potřeby pomocí parametrů tagu: leftalign, rightalign, centeralign, justify

SAFETY Note, zaoblený, zarovnání doprava

<WRAP round safety 300px rightalign>SAFETY Note, zaoblený, zarovnání doprava</WRAP>

Třída safety, zaoblené rohy, šířka 300px, zarovnání textu doprava.

Tabulkování, seskupování

Plugin WRAP umí rozdělit stránku (nebo část stránky) podle potřeby na polovinu half, třetinu third, čtvrtinu quarter. Při demonstraci Boxů a Safety Notes výše bylo použito této možnosti a stránka byla rozdělena na třetiny, kde v prvním sloupci byla demonstrována vizuální ukázka kódu, ve druhém zápis kódu, ve třetím poznámka. Nyní se v příkaldu zaměříme na toto rozdělení stránky nebo její části.

1.sloupec

2.sloupec

3.sloupec

<WRAP group>

<WRAP third column>1.sloupec</WRAP>
<WRAP third column>2.sloupec</WRAP>
<WRAP third column>3.sloupec</WRAP>

</WRAP>

Vytvoří skupinu tří sloupců, každý v šířce 1/3 přiděleného prostoru stránky

1.sloupec 2.sloupec 3.sloupec 4.sloupec

<WRAP group>

<wrap quarter column>1.sloupec</wrap>
<wrap quarter column>2.sloupec</wrap>
<wrap quarter column>3.sloupec</wrap>
<wrap quarter column>4.sloupec</wrap>

</WRAP>

Vytvoří skupinu čtyř sloupců, každý v šířce 1/4 přiděleného prostoru stránky, přitom použije tag wrap zapsaný malými písmeny, který vytváří SPAN (jednořádkový obsah = malý kontejner).

Uvedené rozdělení stránky na poloviny, třetiny a čtvrtiny je automatické a nemusí vždy vyhovovat záměru. Proto lze šířku definovat i manuálně v %, px, em. Stejně tak lze definovat i pozicování sloupců: column, left, right, center.

1.sloupec

2.sloupec

3.sloupec

<WRAP group>

<WRAP 100px column right>1.sloupec</WRAP>
<WRAP 5% column center>2.sloupec</WRAP>
<WRAP 10em column left>3.sloupec</WRAP>

</WRAP>

Vytvoří skupinu tří sloupců, první v pravo, druhý na střed, třetí vlevo. Každý sloupec má jinak definovanou šířku.

Vnější box obtékaný z prava

Vnitřní box v levo

Text ve vnějším boxu

Round TIP box clear

<WRAP box 350px left :cs>
=== Vnější box obtékaný z prava ===

<WRAP 165px left>
Vnitřní box v levo
</WRAP>

Text ve vnějším boxu

<WRAP clear></WRAP>

<WRAP round tip>
Round TIP box ''clear''
</WRAP>

</WRAP>

Ukázka vnořování a zahnizďování boxů (vnější wrap používá třídu box), možnosti kombinování, atd.

Zvýrazňování a další funkce tagu WRAP/wrap

Ahoj, já jsem různě zvýrazněná věta.

<wrap hi>Ahoj</wrap>, já jsem <wrap lo>různě zvýrazněná </wrap><wrap em>věta</wrap>.

Možnosti zvýrazňování textu s pomocí tříd hi, lo, em, použitých v příkladu v tomto pořadí.

Zde následuje důležité upozornění: Návštěvníci z vesmíru jsou mezi námi a konzumují olej !

Zde následuje důležité upozornění: <wrap spoiler>Návštěvníci z vesmíru jsou mezi námi a konzumují olej !</wrap>

Ukázka zkrytého textu s použitím třídy spoiler, pro zobrazení textu je třeba jej myší označit/vybrat.

Použité zdroje a další informace o pluginu

 
wrap_plugin.txt · Last modified: 2014/05/14 12:23 (external edit)