```## tabid=examples ``titletext='SimpleWiki examples' ``subjecttext='SimpleWiki Examples' ``navigationmarkup=examplesnav ``menuid=basic <> == Markup Examples == |:p div float:right:|%s smaller%//[[Local:display/article/examples|view source markup]]// |:p posting:|posted November 21, 2009 In this section we'll try to provide an example of all the markup options, including the native extensions. == Basic Markup == Basic markup consists of basic inline markup and basic block markup. Inline markup is applied to a phrase or sentence. Block markup is applied to blocks of content. Basic inline markup includes //emphasis//, //strong//, //linebreak// and the //escape// character. Basic block markup includes //paragraphs//, //headings//, //horizontal rule// (a horizontal line) and related //block dividers//. === Basic in-line markup === ==== Emphasis ==== Emphasis (italics) is accomplished with two forward slashed before and after the word or words to be emphasised. So {{{//emphasized//}}} looks like this: //emphasized//. Note that the forward slashes lean the same way that italics does. |:p font-style:italic:|Technical note: The parser skips double forward slashes immediately after a colon (:) to avoid italicizing after inline internet protocols (like {{{http://}}}). If you want emphasis markup after a colon, include a space after the colon, and before the double slashes. ==== Strong ==== Strong (bold) is accomplished with two asterisks before and after the word or words to be emphasized. So {{{**strong**}}} looks like this: **strong**. ==== Both Emphasis and Strong ==== You can combine emphasis and strong: {{{//**emphasis and strong**//}}} looks like this: //**emphasis and strong**//. The markup has to be properly nested though, like Chinese dolls. {{{**//does the same thing//**}}} **//does the same thing//** (note the inverse order). ==== Line break ==== To break a line into two, place two consecutive backslashes {{{\\}}} where you want the\\ line break to be. The backslashes do not have to be followed by an actual new line in the source text. I put two backslashes before the words "line break" above. ==== Escape character ==== The tilde is the escape character. You can put this in front of a character that would otherwise be interpreted as markup. Here are two backslashes -- ~\\ -- with the first one preceded by a tilde like this: {{{~\\}}} (preventing the two backslashes from being interpreted as a line break). === Basic block markup === ==== Paragraphs ==== Paragraphs are identified simply by a blank row above and below some text. ==== Headings ==== Headings are identified with equals signs ({{{=}}}) beginning a line. The equals signs can be placed at both the beginning and end of a heading for clarity in the markup, but it is only the equals signs at the left that are used to make a determination of the type of heading. Count the equals signs for the heading level, from 1 to 6. for example: {{{ ===== Headings ===== }}} Headings can also be decorated by class and style decorators in any combination in this general format: (:blockquote:) {{{ |:h classname* stylerule:stylevalue* stylerule:'stylevalue1 stylevalue2'*:| }}} ~* denotes repetition (:blockquoteend:) Below are a number of examples of headings and class decorators that have been defined for this website. The "h" selector indicates that the decoration applies to the adjacent heading. The decorator has to be positioned at the beginning of the line. The heading decorators apply to any level of heading (1 through 6). (:table standard width:100%:) (:tr:) (:th center width:40%:)Example (:thend:) (:th center:)Markup (:thend:) (:trend:) (:tr:) (:td:) |:h toc=no:|= Heading Level 1= (:tdend:) (:td:) {{{= Heading Level 1=}}} (:tdend:) (:trend:) (:tr:) (:td:) |:h toc=no:|== Heading Level 2== (:tdend:) (:td:) {{{== Heading Level 2==}}} (:tdend:) (:trend:) (:tr:) (:td:) |:h toc=no:|=== Heading Level 3=== (:tdend:) (:td:) {{{=== Heading Level 3===}}} (:tdend:) (:trend:) (:tr:) (:td:) |:h toc=no:|==== Heading Level 4==== (:tdend:) (:td:) {{{==== Heading Level 4====}}} (:tdend:) (:trend:) (:tr:) (:td:) |:h toc=no:|===== Heading Level 5===== (:tdend:) (:td:) {{{===== Heading Level 5=====}}} (:tdend:) (:trend:) (:tr:) (:td:) |:h toc=no:|====== Heading Level 6====== (:tdend:) (:td:) {{{====== Heading Level 6======}}} (:tdend:) (:trend:) (:tr:) (:td:) |:h section-divider-high toc=no:|===== Heading high ===== (:tdend:) (:td:) {{{|:h section-divider-high toc=no:|===== Heading high =====}}} (:tdend:) (:trend:) (:tr:) (:td:) |:h section-divider-mid toc=no:|===== Heading mid ===== (:tdend:) (:td:) {{{|:h section-divider-mid toc=no:|===== Heading mid =====}}} (:tdend:) (:trend:) (:tr:) (:td:) |:h section-divider-low toc=no:|===== Heading low ===== (:tdend:) (:td:) {{{|:h section-divider-low toc=no:|===== Heading low =====}}} (:tdend:) (:trend:) (:tr:) (:td:) |:h section-major toc=no:|===== Heading major ===== (:tdend:) (:td:) {{{|:h section-major toc=no:|===== Heading major =====}}} (:tdend:) (:trend:) (:tr:) (:td:) |:h section-divider-major toc=no:|===== Heading divider-major ===== (:tdend:) (:td:) {{{ |:h section-divider-major:| ``===== Heading divider-major ===== }}} (:tdend:) (:trend:) (:tr:) (:td:) |:h subtitle toc=no:|===== Heading subtitle ===== (:tdend:) (:td:) {{{|:h subtitle:|===== Heading subtitle =====}}} (:tdend:) (:trend:) (:tableend:) As mentioned above, as with other objects in SimpleWiki, css style rules can also be applied directly. ==== Horizontal Rule and Dividers ==== A horizontal rule (line) is written with 4 dashes on a line of its own: {{{ ---- }}} which becomes: ---- Also, there are a number of block decorators (technically empty-block decorators) which act as dividers. |=Description |=Markup |=Effect | |divider|{{{|:b divider:|}}}|start below current float| |spacer|{{{|:b spacer:|}}}|same as divider, but leaves a blank line| |fence|{{{|:b fence:|}}}|draws a dashed line| |dots|{{{|:b dots:|}}}|draws a dotted line| |line|{{{|:b line:|}}}|same as horizontal rule {{{----}}}| Each of these has to be on a line by itself. But the markups can be combined: |=Description |=Markup |=Effect | |divider fence|{{{|:b divider fence:|}}}|divides and draws a dashed line| |divider dots|{{{|:b divider dots:|}}}|divides and draws a dotted line| |divider line|{{{|:b divider line:|}}}|divides and same as horizontal rule {{{----}}}| |spacer fence|{{{|:b spacer fence:|}}}|divides and draws a dashed line| |spacer dots|{{{|:b spacer dots:|}}}|divides and draws a dotted line| |spacer line|{{{|:b spacer line:|}}}|divides and same as horizontal rule {{{----}}}| Here are the spacer combination versions: |:b spacer fence:| |:b spacer dots:| |:b spacer line:|