The Divclass Plugin plugin allows to assign div and span classes to wiki text. The classes can be defined in in any css file of the templates in use. The Divclass Plugin has also some pre-defined classes which can be used out of the box. Those classes were inspired by other plugins like the boxes, note and styler plugin.
Formatting inline text using span:
<spanclass classname>...wiki..text...</spanclass>
Formatting text blocks using div:
<divclass classname>...wiki..text...</divclass>
Adding a header:
<divclass classname|header text>...wiki..text...</divclass>
Adding a footer:
<divclass classname|header text>...wiki..text...</divclass|footer text>
See examples blow, how to use this plugin.
| div/span | basic | modifier |
| div,span | box | solid, flat, dashed, dotted, rounded, transparent, gray, green, red, yellow, blue, right, left, full, half, width100, width50, width33, width25, width20 |
| div | hint, warning, error, quote | |
| div | | rsslinks, boldlinks, noindent, nobullets, neutral |
| div | | …%, …px, …em, …ex (width) |
| span | | code |
For a complete and always up to date list of pre-defined classes take a look at the stlye.css file in the Divclass Plugin directory.
Download files in zip or compressed tar format:
The following examples are using the pre-defined classes of Divclass Plugin. But Divclass Plugin can be used with any available css div or span class.
This is just a very <spanclass red box solid>important</spanclass> word.
And this a <spanclass code>code</spanclass> word.
This is just a very important word. And this a code word.
<divclass quote>
This is just a quote with footer
</divclass|by an author>
This is just a quote with footer
<divclass warning 40% left>
This is a warning
</divclass>
<divclass hint 40% right rounded>
This is a hint
</divclass>
<divclass green 40% box left|Left side>
^A^Table^
|A|Column|
</divclass|green box>
<divclass green 40% box right|Right side>
* Point1
* Point2
</divclass|green box>
<divclass full green box rounded>
<.code perl>die "goodbye" unless $alive;<./code> # remove .
</divclass>
die "goodbye" unless $alive;
<divclass width33 left>
* Point 1
* Point 2
</divclass>
<divclass width33 left>
* Point 3
* Point 4
</divclass>
<divclass width33 left>
* Point 5
* Point 6
</divclass>
<divclass 25% left>
* Point 1
* Point 2
</divclass>
<divclass 100px left>
* Point 3
* Point 4
</divclass>
<divclass 10em left>
* Point 5
* Point 6
</divclass>