====== Wrap Syntax ====== {{:wiki:wrap_plugin_example10.png}} ==== Classes ==== The following classes are currently available: ^ class name ^ description/notes ^ ^ __columns__ -- similar to [[columns]], [[side_note]], [[styler]], [[tip]] || | **''column''** | same as ''left'' in LTR languages and same as ''right'' in RTL languages | | **''left''** | same as ''column'', will let you float your container on the left | | **''right''** | will let the container float right | | **''center''** | will position the container in the horizontal center of the page | | **''col2''**..**''col5''** | will show the text in multiple columns determined by their amount (2, 3, 4 or 5), only works in modern browsers (no IE9 and below) | | **''colsmall''**, **''colmedium''**, **''collarge''** | will also show the text in multiple columns but determined by their width (small, medium or large), only works in modern browsers (no IE9 and below) | ^ __widths__ -- :!: **experimental**, might not work as expected, includes mobile support || | **''half''** | fits two columns in a row, should be used in pairs | | **''third''** | fits three or two columns in a row, should be used in triplets or together with ''twothirds'' | | **''twothirds''** | fits two columns in a row when used together with ''third'', one 1/3 wide and another 2/3 wide | | **''quarter''** | fits four columns in a row, should be used in quads | ^ __alignments__ -- similar to [[divalign]], [[columns]], [[styler]] -- :!: don't work with spans! || | **''leftalign''** | aligns text on the left | | **''rightalign''** | aligns text on the right | | **''centeralign''** | centers the text | | **''justify''** | justifies the text | ^ __boxes and notes__ -- similar to [[box]], [[note]], [[tip]] || | **''box''** | creates a box around the container (uses colours from ''style.ini'') | | **''info''** (was ''information'' in first version) | creates a blue box with an info icon | | **''important''** | creates an orange box with an important icon | | **''alert''** (:!: was ''warning'' in previous versions) | creates a red box with an alert icon | | **''tip''** | creates a yellow box with a tip icon | | **''help''** | creates a violet box with a help icon | | **''todo''** | creates a cyan box with an todo icon | | **''download''** | creates a green box with a download icon | | **''round''** | adds rounded corners to any container with a background colour or a border (only works in modern browsers, i.e. no IE) | | **''danger''** | creates a red danger safety note | | **''warning''** | creates an orange warning safety note | | **''caution''** | creates a yellow caution safety note | | **''notice''** | creates a blue notice safety note | | **''safety''** | creates a green safety note | ^ __marks__ -- similar to [[emphasis]], [[important_paragraf]], [[importanttext]] || | **''hi''** | marks text as highlighted | | **''lo''** | marks text as less significant | | **''em''** | marks text as especially emphasised | ^ __miscellaneous__ || | **''clear''** | similar to [[clearfloat]], should preferably be used with divs, i.e. uppercase ''%%%%''s | | **''tabs''** | if wrapped around a list of links, will show those as tabs | | **''hide''** | hides the text per CSS (the text will still appear in the source code, in non-modern browsers and is searchable) | | **''noprint''** | displays text on the screen, but not in print, similar to [[noprint]] | | **''onlyprint''** | displays text only in print, but not on the screen | | **''pagebreak''** | forces a new page in printouts (not visible on the screen), similar to [[pagebreak]] | | **''nopagebreak''** | tries to avoid a pagebreak in printouts (not visible on the screen) | | **''spoiler''** | shows white text on a white background, only to be revealed by highlighting it; similar to [[hide]] | | **''button''** | when wrapped around a link, styles it like a button | | **''tablewidth''** | sets widths of tables inside to whichever width the wrap gets, partly replaces [[tablewidth]] | | **''indent''** | indents the text, could be used instead of [[tab]] | | **''outdent''** | "outdents" the text, could partly be used instead of [[outdent]] | | **''prewrap''** | wraps text inside pre-formatted code blocks, similar to [[wpre]] | === Known restrictions === * WRAPs export to ODT format but not everything works 100% * Round corners only work in modern browsers (no IE8 and below). * Multiple columns only work in modern browsers (no IE9 and below). * Width classes are experimental and only work in modern browsers (no IE8 and below). * Normal DokuWiki Headlines used to not work and a work-around was added. Now that headlines do work, the work-around is not needed anymore but kept for backwards-compatibility. It was deprecated in version 2018-04-22 and disabled by default. They can be enabled by using the ''emulatedHeadlines'' [[#configuration_options|config option]]. The following syntax would then produce two different kinds of emulated headlines inside any wrap: * %%//**__Big Underlined Headline__**//%% (They will look a bit different in safety notes.) * %%//**Small Headline**//%% * do not include ~~DISCUSSION~~ within a WRAP noprint block You might need to adjust a few of the classes to your template's needs, especially ''hi'', ''lo'' and ''em''. If you have a dark or otherwise heavily coloured theme, please use the ''darkTpl'' [[#configuration_options|config option]]. The classes are easily adjustable and extensible. Any wishes are welcome.