When editing a page, there are several tags that can be used to change the appearance and positioning of text and images, as well as more advanced functions such as creating columns, background images, page comments, or even automated RSS/Atom feed reading and distribution.
This short guide will help you change the basic appearance of text, show you how to insert images and video, and cover the basics of linking. For a full reference of all available tags, please see the
complete tag reference.
A section header is made using the
[h]Header Text[/h]
format. It's a good idea to leave a blank line above and below a header.
bold text can be made using
[b]some text[/b]
.
italics can be made using
[i]some text[/i]
.
strike-through can be made using
[s]some text[/s]
.
underline can be made using
[u]some text[/u]
.
colors can be made using
[color=purple]some text[/color]
.
colors can also be made using
[color=#00C065]some text[/color]
.
At the end of any page, on it's own line, use the simple
[comments/]
tag to automatically create a comment section. Note that this is a self-closing tag, so don't forget the slash just before the end.
Your new comment section will link to a thread in the default forum, at
/forum
, which allows easier management of comment sections from multiple articles. These comments can also be easily pre-moderated, or use any protection mode that is available in the forum.
Multiple Line Text Block Operations
A block of text can be centered using the
[center]one or more lines of text[/center]
format as follows:
[center]
This is an example of centered text.
Multiple lines are OK.
[/center]
Which looks like:
This is an example of centered text.
Multiple lines are OK.
A block of text can be indented in the same way using the
[indent]one or more lines of text[/indent]
format.
[indent]
This is an example of indented text.
Multiple lines are OK.
[/indent]
Which looks like:
This is an example of indented text.
Multiple lines are OK.
A block of text can be in a quote box using the
[quote]one or more lines of text[/quote]
format. The user part is optional.
[quote]
The quoted text.
[/quote]
Looks like:
Or:
[quote="The New User"]
Bla bla bla
[/quote]
Looks like:
The New User wrote:
Bla bla bla
Use the
[img]
tag to put an image on the page. It has several optional attributes.
[img option=value option=value]imagename.jpg[/img]
Options:
style= thumbright (default), thumbleft, large, inline, stretched (these are presets for other options)
frame= if set to 1 or true, it will draw a frame and caption with the image comment
width= constrain width, in pixels (aspect ratio will be maintained)
height= constrain height, in pixels (aspect ratio will be maintained)
stretch= if set to 1 or true, it will allow the image to also be stretched to the height/width specified
If you are using a floating style like
thumbright
or
thumbleft
, you may use a
[clear/]
tag afterward to push subsequent text down below any floating image. Some tags, such as the
[h]
section header, do this automatically.
Here are several examples:
[img]colors on floor.jpg[/img]
[img style=large]colors on floor.jpg[/img]
[img style=rightthumb]hazy river scene.jpg[/img] In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
[img style=leftthumb]hazy river scene.jpg[/img] In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image. In this example, notice how the text wraps around the image.
Sample text for inline image now [img style=inline height=12]colors on floor.jpg[/img] and there it is. Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla. Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla. Bla bla bla bla bla bla bla bla bla bla bla.
Sample text for inline image now
and there it is. Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla. Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla. Bla bla bla bla bla bla bla bla bla bla bla.
Video can be embedded in a page in the same way as an image. Videos should be in .mp4 or .webm container format to be embedded properly in most client browsers. Upload a video file and then use the
[video]
tag the same way that an
[img]
tag is used.
A link to this [url]format_guide[/url] or any other page is easy!
A link can also be [url="format_guide"]labeled[/url] any way you want.
You can use an id to link to a [url="format_guide#images"]specific part[/url] of a page.
You can use an id to link to a [url="#images"]specific part[/url] of THIS page.
External links are also allowed to places like [url]http://google.com[/url].
A link to this
format_guide or any other page is easy!
A link can also be
labeled any way you want.
You can use an id to link to a
specific part of a page.
You can use an id to link to a
specific part of THIS page.
External links are also allowed to places like
http://google.com.
Use the
id
attribute to identify a section of a page so that it can be linked to. This can be used in section headers, images, codebox, and quote boxes. Eg.:
More advanced features, such as columns and background images, are documented in the
complete tag reference.