KitzKikz  KitzKikz: ExtendedWikiMarkup   RecentChanges 
 PopularPages 
 SearchPages 
 Home | Trail - ExtendedWikiMarkup
 
 

Table of Contents:  

  1. More Text Stuff
    1. Paragraphs
    2. Indenting
    3. Preformatted
    4. Style
  2. Images
  3. Tables
  4. More Hyperlinks
    1. Anchors
    2. InterWiki Links
  5. Lists
  6. Comments
  7. Additional References


Paragraphs  

  • Lists automatically make up a new paragraph.
  • Every block of text (without empty lines) will form a paragraph.
  • Right align text by preceding the line with two greater-than signs (>>).
  • Center text by preceding the line with two back-wacks (\\).

This is right aligned text.
Another right line.
Centered text.
Another, just for good measure.

Indenting Text  

Use spaces or tabs at the beginning of a line:
Three or more spaces at the beginning of a line will indent it.
One tab has the width of eight spaces, but it is difficult to enter a tab
using most browsers (Option-Tab works on my Mac & Safari)
Change indentation level by using more or less spaces at the line beginning, this is hopefully an intuitive method of indentation.
Some older browsers may not support the style sheets used by this indentation scheme.


Pre-Formatted Text  

   _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _
 /                                                          \
/ If  you  wish  text  to  appear in a mono-spaced font with \
\  no browser formatting, then start that paragraph using    /
 \  the starting code "<pre>" at the line start.  End that  /
  \  paragraph using the ending code "</pre>" at the front /
   \  of the following line.  This is similar to the HTML /
    \  tag of the same name.  Please note that "<pre>"   /
     \  and "</pre>" must be written in all lowercase.  /
      \ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _/

Text Style  

  • Superscript text by surrounding it with double carrets (^^)
  • The text styles can be combined. For example:
    Bold and Italic, Big,Bold,Monospaced, Small, superscript, italics


Images  

Images can be inlined http://www.kitzkikz.com/images/kicker_cc99ff.png?x=40&amp;y=30 into a page using square brackets around the absolute web address of the image file, like [http://www/image.png].

To have text flow around
http://www.kitzkikz.com/images/kicker_cc99ff.png?x=40&amp;y=30 to the right of an image,
put a space between the image
url and the closing bracket:
[http://example.com/image.png ]

To have text flow around
http://www.kitzkikz.com/images/kicker_cc99ff.png?x=40&amp;y=30 to the left of an image,
put a space between the image
url and the opening bracket:
[ http://example.com/image.png]

To center an image put a space both before and after the image url: [ http://example.com/image.png ]. http://www.kitzkikz.com/images/kicker_cc99ff.png?x=40&amp;y=30 This may not work in some browsers.

Specify an image's size by appending it to the url:

[http://www.example.com/image.png?x=200&y=100]
[http://www.example.com/image.png?width=200&height=100]

http://www.kitzkikz.com/images/kicker_cc99ff.png?x=40&amp;y=30http://www.kitzkikz.com/images/kicker_cc99ff.png?x=80&amp;y=60http://www.kitzkikz.com/images/kicker_cc99ff.png?x=120&amp;y=90
40x3080x60120x90

Over the years, browsers have gotten better at placing images within and around text. However, the best solutions still use tables (see below).


Tables  

Simple Tables

Tables are created using the vertical bar or pipe character ( | ).

Start a table by enclosing the cells with the pipe character. The pipe should be the first and last characters on a line. Additional rows are added as additional lines, each starting and ending with a pipe.

Example -

| A single line | table with | three cells |

Result -

A single linetable withthree cells

Example -

| A table | with three | columns |
| and three | rows, but| missing |
|one |cell |

Result -

A tablewith threecolumns
and threerows, butmissing
onecell

Hyperlinks and Images in Tables

You can include hyperlinks and images in tables using the normal WikiMarkup rules. However, using the square bracket notation (i.e. [Title | http://example.com]) can cause problems since the pipe character is also used as the table delimiter. Instead, use the alternate quoted form of hyperlink (["Title" http://example.com]).

Complex Tables

People usually want more robust tables than are described above. The following scheme allows almost any kind of table possible with HTML, but it is more difficult to use.

The addition of curly braces { } just inside the pipe characters allows for attributes to be given to the various parts of the table:

|{table attr}{row 1 attr}{cell 1 attr} Cell 1 Data |{cell 2 attr} Cell 2 Data |
|{row 2 attr}{cell 3 attr} Cell 3 Data |{cell 4 attr} Cell 4 Data |

etc.

The curly braces have to appear immediately after the pipe character. They may contain any attribute-value pairs valid for HTML tables. Familiarity with HTML, CSS, etc. is recommended before using this scheme.

Example -

|{border=0 }{bgcolor=gray style=color:white} __One Mississippi__ | ##Two Mississippi## |
|{align=right }{bgcolor=blue} Three |{align=center } ''Four'' |

Result -

One MississippiTwo Mississippi
ThreeFour

Example -

|{border=1 cellspacing=0 cellpadding=4 align=center style=border-color:orange }{bgcolor=black style=color:white align=center} __Name__ | __Score__ |
| Big Bird |{align=right} 35 |
| Burt |{align=right} 17 |
| Rubber Ducky |{align=right} 73 |

Result -

NameScore
Big Bird325
Burt17
Rubber Ducky7043


More Hyperlinks  

Anchors  

Instead of loading a different page, Anchors are hyperlinks that reference places on the same page. Clicking an Anchor-Link will scroll the page to the matching Anchor-Point. Anchors are useful on large pages to move quickly around the page. They are commonly seen in a table of contents. The contents table at the top of this page uses anchor-links and every heading on this page has an anchor-point.

To create an Anchor-Link (the visible link that is clicked on):

[#AnchorName "Optional Title"]

To create an Anchor-Point (the invisible mark where the above link will scroll to):

#[AnchorName]

To send the user to an Anchor-Point on a different page:

[OtherPage#AnchorName "Optional Title"]

InterWiki:Links  

There are many other WikiWikiWebs out there and a standard has been developed to create hyperlinks between them. See WikiWikiWeb for a list of supported external wiki names.

[ExternalWikiName:PageName]

Some examples:


Lists  

  • An asterisk (*) at the beginning of a line creates a circle bullet.

  1. A hash mark (#) creates a numbered line.

  • A dash or minus character (-) creates a square bullet.

Definition lists can be created using :: (colon-colon) or ;: (semicolon-colon) at the line start or in a sublist:

;definition: explanation
:anotherdef: another description
**;Indented Def: Indented Description

definition
explanation
anotherdef
another description
    Indented Def
    Indented Description


Comments  

Comments can be inserted using a <!-- at a line start, but don't add the --> as you would in HTML. Comments can be used to hide information inside a page without it being shown when anyone views it. However, if someone edits the page or views the HTML source, the comment can be seen.


See also:  

  • WikiMarkup - More basic rules.
  • GoodStyle - Guidelines for writing Wiki pages.
  • SandBox - A place to practice using these markups.
  • Source of Any Page - Click the EditThisPage link near the bottom of any page.

 

   

 
 EditThisPage · LinksToPage · PageInfo 10/05/09 18:02:35  ·  0.0886s