(remove note about spoiler not working, it seems fully functional) |
(replace <center> with class="center" + add note on blockquotes) |
||
(8 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
This page lists formatting codes or tricks that can be used to help format wiki pages. It includes MediaWiki tags, table formatting, and HTML tags. | This page lists formatting codes or tricks that can be used to help format wiki pages. It includes MediaWiki tags, table formatting, and HTML tags. | ||
{{MissingInfo| | |||
*Needs reordering. | |||
*Templates and parser functions could also be included, but they may be suitable for separate pages.}} | |||
== | {| class="wikitable" width="100%" | ||
{| class="wikitable | |+ <h2>Wikitext</h2> | ||
|+ < | !Function | ||
! | !Example | ||
!style=" | !Output | ||
|- | |||
|New paragraph | |||
|<pre>Put two | |||
line breaks</pre> | |||
| | |||
Put two | |||
line breaks | |||
|- | |||
|Bold text | |||
|<nowiki>'''text'''</nowiki> | |||
|'''text''' | |||
|- | |||
|Italics | |||
|<nowiki>''text''</nowiki> | |||
|''text'' | |||
|- | |||
|Bullet point (unordered) list | |||
|<pre>*One | |||
*Two | |||
**Sub-point | |||
*Three</pre> | |||
| | |||
*One | |||
*Two | |||
**Sub-point | |||
*Three | |||
|- | |||
|Numbered (ordered) list | |||
|<pre>#One | |||
#Two | |||
##Sub-point | |||
#Three</pre> | |||
| | |||
#One | |||
#Two | |||
##Sub-point | |||
#Three | |||
|- | |||
|Make new headings | |||
|<pre>==Main== | |||
Text | |||
===Sub=== | |||
Text</pre> | |||
|''Can't show this'' | |||
|- | |||
|Indent | |||
|:Text | |||
| | |||
:Text | |||
|- | |||
|Signature | |||
|<nowiki>~~~~</nowiki> | |||
|[[User:ExampleUser|ExampleUser]] ([[User talk:ExampleUser|talk]]) 20:24, 26 June 2004 (UTC) | |||
|- | |||
|Signature without timestamp | |||
|<nowiki>~~~</nowiki> | |||
|[[User:ExampleUser|ExampleUser]] ([[User talk:ExampleUser|talk]]) | |||
|- | |||
|Horizontal rule | |||
|Text | |||
<nowiki />---- | |||
Text | |||
|Text | |||
---- | |||
Text | |||
|- | |||
!colspan="3"|<h3>Links</h3> | |||
|- | |||
|Link to a page (''wikilink'') | |||
|<code><nowiki>[[Yume Nikki:Madotsuki|Madotsuki]]</nowiki></code> | |||
|[[Yume Nikki:Madotsuki|Madotsuki]] | |||
|- | |||
|Link to a section on a page | |||
|<code><nowiki>[[Yume Nikki:Madotsuki</nowiki><b>#Madotsuki's Dreams</b><nowiki>|her dreams]]</nowiki></code> | |||
|[[Yume Nikki:Madotsuki#Madotsuki's Dreams|her dreams]] | |||
|- | |||
|Link to a category or file by prepending a colon | |||
|<code><nowiki>[[</nowiki><b>:</b><nowiki>Category:Yume Nikki FC Locations|List of FC Worlds]]</nowiki></code> | |||
|[[:Category:Yume Nikki FC Locations|List of FC Worlds]] | |||
|- | |||
|Link to wikipedia (''interwiki link'') | |||
|<code><nowiki>[[wikipedia:Main Page|Visit Wikipedia]]</nowiki></code> | |||
|[[wikipedia:Main Page|Visit Wikipedia]] | |||
|- | |||
|External link | |||
|<code><nowiki>[https://mediawiki.org/wiki/Cheatsheet MediaWiki's cheatsheet]</nowiki></code> | |||
|[https://mediawiki.org/wiki/Cheatsheet MediaWiki's cheatsheet] | |||
|- | |||
!colspan="3"|<h3>Images</h3> | |||
|- | |||
|Image with a caption | |||
|<code><nowiki>[[File:Yume favicon.png|70px|thumb|right|An image]]</nowiki></code> | |||
|[[File:Yume favicon.png|70px|thumb|right|An image]] | |||
|- | |||
|Image in a gallery | |||
|<pre><gallery> | |||
Yume favicon.png|An image | |||
</gallery></pre> | |||
|<gallery widths=70px> | |||
Yume favicon.png|An image | |||
</gallery> | |||
|} | |||
{| class="wikitable" width="100%" | |||
|+ <h2>Characters</h2> | |||
!width="6ch"|Character | |||
!Usage | |||
|- | |||
|style="text-align: center;"|<span style="font-size:200%; line-height:1px;>␤</span><br>U+000A<br>&#10; | |||
|Using the HTML entity for a newline lets you avoid it getting stripped by parser functions. | |||
|- | |||
|style="text-align: center;"|<code> </code><br>U+0020<br>&#32; | |||
|Spaces are also stripped by parser functions. | |||
|- | |- | ||
|style="text-align: center;"|#<br>U+0023<br>&num; | |style="text-align: center;"|#<br>U+0023<br>&num; | ||
|The number sign, also called a pound or hash symbol. The HTML entity can allow escaping certain situations. | |The number sign, also called a pound or hash symbol. The HTML entity can allow escaping certain situations. | ||
|- | |- | ||
|style="text-align: center;"|&<br>U+ | |style="text-align: center;"|&<br>U+0026<br>&amp; | ||
|Ampersand | |Ampersand, usually called the ''and'' symbol. The HTML entity can allow escaping certain situations. Used in this table to present the HTML entities. | ||
|- | |- | ||
|style="text-align: center;"|,<br>U+002C<br>&comma; | |style="text-align: center;"|,<br>U+002C<br>&comma; | ||
|Commas are usually chosen as the separator for fields in arrays or {{t|TextSpace}}. The HTML entity allows can prevent this, although nowiki tags are a safer option. | |Commas are usually chosen as the separator for fields in arrays or {{t|TextSpace}}. The HTML entity allows can prevent this, although nowiki tags are a safer option. | ||
|- | |- | ||
|style="text-align: center;"||<br>U+007C<br>&VerticalLine;<br>&#124; | |style="text-align: center;"||<br>U+007C<br>&VerticalLine;<br>&#124; | ||
|The pipe character, also called the vertical line or bar, is used extensively for Mediawiki parsing. The HTML entity escapes these situations. To delay the parsing instead of prevent it completely, use <code><nowiki>{{!}}</nowiki></code>. | |The pipe character, also called the vertical line or bar, is used extensively for Mediawiki parsing. The HTML entity escapes these situations. To delay the parsing instead of prevent it completely, use <code><nowiki>{{!}}</nowiki></code>. | ||
|- | |- | ||
|style="text-align: center;"|·<br>U+00B7<br>&middot;<br>&centerdot; | |style="text-align: center;"|·<br>U+00B7<br>&middot;<br>&centerdot; | ||
|Solid dot that is in the middle of a line. | |Solid dot that is in the middle of a line. | ||
|- | |- | ||
|style="text-align: center;"|←<br>U+2190<br>&larr; | |style="text-align: center;"|←<br>U+2190<br>&larr; | ||
|Leftwards arrow as one character. | |Leftwards arrow as one character. | ||
|- | |- | ||
|style="text-align: center;"|↑<br>U+2191<br>&uarr; | |style="text-align: center;"|↑<br>U+2191<br>&uarr; | ||
|Upwards arrow as one character. Can be used for "to top" links. | |Upwards arrow as one character. Can be used for "to top" links. | ||
|- | |- | ||
|style="text-align: center;"|→<br>U+2192<br>&rarr; | |style="text-align: center;"|→<br>U+2192<br>&rarr; | ||
|Rightwards arrow as one character. Used when listing directions on [[:Category:Locations|location pages]]. | |Rightwards arrow as one character. Used when listing directions on [[:Category:Locations|location pages]]. | ||
|- | |- | ||
|style="text-align: center;"|↔<br>U+2194<br>&harr; | |style="text-align: center;"|↔<br>U+2194<br>&harr; | ||
|Arrow that points both left and right. Can be used to show a relation between two elements. | |Arrow that points both left and right. Can be used to show a relation between two elements. | ||
|- | |- | ||
|style="text-align: center;"|∕<br>U+2215 | |style="text-align: center;"|∕<br>U+2215 | ||
|Division | |Division slash, which appears to be a forward slash. Since it has the same appearance but no function, it can help with presenting HTML. | ||
|- | |- | ||
|style="text-align: center;"|<<br>U+FF1C | |style="text-align: center;"|<<br>U+FF1C | ||
|Fullwidth | |Fullwidth less-than sign. Presented wider than the normal one <. | ||
|- | |- | ||
|style="text-align: center;"|><br>U+FF1E | |style="text-align: center;"|><br>U+FF1E | ||
|Fullwidth | |Fullwidth greater-than sign >. Presented wider than the normal one >. | ||
|} | |} | ||
{| class="wikitable" | {| class="wikitable" width="100%" | ||
|+ < | |+ <h2>Tags</h2><span id="General"></span> | ||
! | !Function | ||
!Example | !Example | ||
! | !Output | ||
|- | |- | ||
| | |Prevent all wiki markup and HTML tags from being parsed | ||
|<nowiki><nowiki>'''text'''</nowiki></nowiki> | |<nowiki><nowiki>'''text'''</nowiki></nowiki> | ||
|<nowiki>'''text'''</nowiki> | |<nowiki>'''text'''</nowiki> | ||
|- | |- | ||
|Completely preformat text: wiki markup, template calls, links, parser functions, HTML codes, and comments are completely ignored and are treated as raw text | |||
|<nowiki><pre>'''text'''</pre></nowiki> | |||
|<pre>'''text'''</pre> | |||
|Completely | |||
|<nowiki><pre | |||
|<pre | |||
|- | |- | ||
|Monospaced blocks of text | |||
|<nowiki><pre style="font-family:monospace;">text</pre></nowiki> | |<nowiki><pre style="font-family:monospace;">text</pre></nowiki> | ||
|<pre style="font-family:monospace;">text</pre> | |<pre style="font-family:monospace;">text</pre> | ||
|- | |- | ||
| | |Apply a background to signify text is code | ||
|<nowiki><code>text</code></nowiki> | |<nowiki><code>text</code></nowiki> | ||
|<code>text</code> | |<code>text</code> | ||
|- | |- | ||
| | |Underline | ||
|<nowiki><u>text</u></nowiki> | |<nowiki><u>text</u></nowiki> | ||
|<u>text</u> | |<u>text</u> | ||
|- | |- | ||
| | |Highlight | ||
|<nowiki><mark>text</mark></nowiki> | |<nowiki><mark>text</mark></nowiki> | ||
|<mark>text</mark> | |<mark>text</mark> | ||
|- | |- | ||
| | |Hide text under a spoiler | ||
|<nowiki><span class="spoiler">text </span></nowiki> | |<nowiki><span class="spoiler">text </span></nowiki> | ||
|<span class="spoiler">text </span> | |<span class="spoiler">text</span> | ||
|- | |- | ||
| | |Superscript | ||
|<nowiki>text<sup>text</sup></nowiki> | |<nowiki>text<sup>text</sup></nowiki> | ||
|text<sup>text</sup> | |text<sup>text</sup> | ||
|- | |- | ||
| | |Subscript | ||
|<nowiki>text<sub>text</sub></nowiki> | |<nowiki>text<sub>text</sub></nowiki> | ||
|text<sub>text</sub> | |text<sub>text</sub> | ||
|- | |- | ||
| | |Small text | ||
|<nowiki><small>text</small></nowiki> | |<nowiki><small>text</small></nowiki> | ||
|<small>text</small> | |<small>text</small> | ||
|- | |- | ||
| | |Big text | ||
|<nowiki><big>text</big></nowiki> | |<nowiki><big>text</big></nowiki> | ||
|<big>text</big> | |<big>text</big> | ||
|- | |- | ||
|<nowiki>< | |Defines a header using HTML, equivalent to <code><nowiki>===this===</nowiki></code> <br> Header levels can be from 1-6 but usually 4 is the highest | ||
|<nowiki><h3>ctrt</h3></nowiki> | |<nowiki><h3>ctrt</h3></nowiki> | ||
|<nowiki>(blanked)</nowiki> | |<nowiki>(blanked)</nowiki> | ||
|- | |- | ||
| | |Force a line break | ||
|<nowiki>text1<br>text2</nowiki> | |<nowiki>text1<br>text2</nowiki> | ||
|text1<br>text2 | |text1<br>text2 | ||
|- | |- | ||
| rowspan="2" | | |rowspan="2"|Force following text to appear below all floating elements instead of flowing adjacent. ''See also:'' {{t|clear}} | ||
|<nowiki>[[File:Cagedfairy.png |thumb|right|Text]] <br clear | |<nowiki>[[File:Cagedfairy.png |thumb|right|Text]] <br style="clear:both"> text</nowiki> | ||
|[[File:Cagedfairy.png |thumb|right|Text]]<br clear | |[[File:Cagedfairy.png|thumb|right|Text]]<br style="clear:both">text | ||
|- | |- | ||
|<nowiki>[[File:Cagedfairy.png |thumb|right|Text]] text</nowiki> | |<nowiki>[[File:Cagedfairy.png |thumb|right|Text]] text</nowiki> | ||
|[[File:Cagedfairy.png |thumb|right|Text]] text | |[[File:Cagedfairy.png|thumb|right|Text]] text | ||
|- | |- | ||
| | |Blockquote. Also see {{t|quote}}. Do not use this for text indents, instead use {{t|indent}}. | ||
|<nowiki><blockquote>text </blockquote></nowiki> | |<nowiki><blockquote>text</blockquote></nowiki> | ||
|<blockquote>text </blockquote> | |<blockquote>text</blockquote> | ||
|- | |- | ||
| | |Create an invisible link anchor: [[{{FULLPAGENAME}}#Anchor]]. This can be placed within a header (inside of the equal signs) to make an alternate header link. | ||
|<nowiki><span id=" | |<nowiki><span id="Anchor"></span></nowiki> | ||
| style="vertical-align: top;" |<span id=" | | style="vertical-align: top;" |<span id="Anchor"></span> | ||
|- | |- | ||
|<nowiki>< | |Comments: only present when editing, unless within <nowiki><</nowiki>pre> or <nowiki><</nowiki>nowiki> tags. | ||
|<nowiki><!--text--></nowiki> | |<nowiki><!--text--></nowiki> | ||
|<!--text--> | |<!--text--> | ||
|} | |} | ||
{| class="wikitable" | {| class="wikitable" width="100%" | ||
|+ < | |+ <h2>HTML Styles and Classes</h2><span id="Div Styles and Classes"></span><span id="HTML"></span><span id="Div styles"></span> | ||
! | !Function | ||
! | !Style/Class | ||
!Output | |||
|- | |- | ||
| | |Center text | ||
|<nowiki> | |<nowiki>style="text-align: center;"</nowiki> | ||
|<div style="text-align: center;">text</div> | |<div style="text-align: center;">text</div> | ||
|- | |- | ||
| | |Center elements | ||
|<nowiki>class="center"</nowiki> | |||
|<div class="center">text</div> | |||
|- | |||
| | |Format text into a specified number of columns (or use "auto") | ||
|style="column-count: 2;" | |||
|<div style="column-count: 2;">text1 | |||
text2 | text2 | ||
text3</div> | text3</div> | ||
|- | |- | ||
| | |Present elements adjacent to each other. In the example it shows that you can place an image next to a gallery, which is usually not possible. | ||
| | |style="display: flex; flex-direction: row;" | ||
|<div style="display: flex; flex-direction: row;"><gallery widths=40 heights=40> Cagedfairy.png|Text </gallery>[[File:Boyoutline.png |thumb|Text]]</div> | |<div style="display: flex; flex-direction: row;"><gallery widths=40 heights=40> Cagedfairy.png|Text</gallery>[[File:Boyoutline.png|thumb|Text]]</div> | ||
|- | |- | ||
!colspan="4"| < | !colspan="4"|<h3>Collapsible Sections</h3> | ||
|- | |- | ||
|Allows text to be collapsed | |||
|class="mw-collapsible" | |class="mw-collapsible" | ||
|<div class="mw-collapsible">text1 <br>text2</div> | |<div class="mw-collapsible">text1 <br>text2</div> | ||
|- | |- | ||
|Collapsed by default | |||
|class="mw-collapsible mw-collapsed" | |class="mw-collapsible mw-collapsed" | ||
|<div class="mw-collapsible mw-collapsed">text1 <br>text2</div> | |<div class="mw-collapsible mw-collapsed">text1 <br>text2</div> | ||
|- | |- | ||
|Gives the content the style of the table of contents | |||
|class="toccolours mw-collapsible" | |class="toccolours mw-collapsible" | ||
|<div class="toccolours mw-collapsible">text1 <br>text2</div> | |<div class="toccolours mw-collapsible">text1 <br>text2</div> | ||
|- | |- | ||
|class="mw-collapsible-content" | |rowspan="2"|Use inside a div with mw-collapsible and only the text inside this inner div will collapse. The rest will never collapse. | ||
|rowspan="2"|class="mw-collapsible-content" | |||
|<nowiki><div class="toccolours mw-collapsible mw-collapsed">text1<div class="mw-collapsible-content">text2</div></div></nowiki> | |<nowiki><div class="toccolours mw-collapsible mw-collapsed">text1<div class="mw-collapsible-content">text2</div></div></nowiki> | ||
|- | |||
|<div class="toccolours mw-collapsible mw-collapsed">text1<div class="mw-collapsible-content">text2</div></div> | |<div class="toccolours mw-collapsible mw-collapsed">text1<div class="mw-collapsible-content">text2</div></div> | ||
|- | |- | ||
|class="mw-collapsible-toggle" | |rowspan="2"|Custom toggle button for a collapsible section. ''Stays the same when pressed''. | ||
|rowspan="2"|class="mw-collapsible-toggle" | |||
|<nowiki><div class="mw-collapsible"> <div class="mw-collapsible-toggle mw-collapsible-text">[Show/Hide]</div> <div class="mw-collapsible-content" >text </div></div></nowiki> | |<nowiki><div class="mw-collapsible"> <div class="mw-collapsible-toggle mw-collapsible-text">[Show/Hide]</div> <div class="mw-collapsible-content" >text </div></div></nowiki> | ||
|- | |||
|<div class="mw-collapsible"> <div class="mw-collapsible-toggle mw-collapsible-text">[Show/Hide]</div> <div class="mw-collapsible-content" >text </div></div> | |<div class="mw-collapsible"> <div class="mw-collapsible-toggle mw-collapsible-text">[Show/Hide]</div> <div class="mw-collapsible-content" >text </div></div> | ||
|} | |} | ||
{| class="wikitable" | {| class="wikitable" width="100%" | ||
|+ < | |+ <h2>List Formatting</h2> | ||
! | !Function | ||
!Example | !Example | ||
! | !width="250px"|Output | ||
|- | |- | ||
|<nowiki>< | |Unordered list; equivalent to using * at the start of a line | ||
|< | |<nowiki><ul> | ||
<li>text1</li> | |||
<li>text2</li> | |||
<li>text3</li> | |||
<li>text4</li> | |||
</ul></nowiki> | |||
|<ul> | |||
<li>text1</li> | |||
<li>text2</li> | |||
<li>text3</li> | |||
<li>text4</li> | |||
</ul> | |||
|- | |- | ||
|This list style forces floating elements such as image thumbs to appear on the same line, even if they are otherwise unable. | |This list style forces floating elements such as image thumbs to appear on the same line, even if they are otherwise unable. | ||
|<nowiki><ul> <li style="display: inline-block;>[[File:Cagedfairy.png|thumb|Text]]</li> <li style="display: inline-block;">[[File:Boyoutline.png|thumb|Text]]</li> </ul></nowiki> | |||
|<ul> <li style="display: inline-block;>[[File:Cagedfairy.png |thumb|Text]]</li> <li style="display: inline-block;">[[File:Boyoutline.png|thumb|Text]]</li> </ul> | |||
|- | |- | ||
|This list style can be used in addition to the previous one to align the elements to the top, middle, or bottom of the lines they are occupying. | |This list style can be used in addition to the previous one to align the elements to the top, middle, or bottom of the lines they are occupying. | ||
|<nowiki><ul> <li style="display: inline-block; vertical-align: middle;">[[File:Cagedfairy.png|thumb|Text]]</li> <li style="display: inline-block; vertical-align: middle;">[[File:Boyoutline.png|thumb|Text]]</li> </ul></nowiki> | |||
|<ul> <li style="display: inline-block; vertical-align: middle;">[[File:Cagedfairy.png|thumb|Text]]</li> <li style="display: inline-block; vertical-align: middle;">[[File:Boyoutline.png|thumb|Text]]</li> </ul> | |||
|} | |} | ||
{| class="wikitable" | {| class="wikitable" width="100%" | ||
|+ < | |+ <h2>Tables</h2> | ||
!Code | !Code | ||
! | !width="59%"|Usage | ||
|- | |- | ||
|<nowiki>class="wikitable"</nowiki> | |<nowiki>class="wikitable"</nowiki> | ||
Line 275: | Line 332: | ||
|- | |- | ||
|<nowiki>class="sortable"</nowiki> | |<nowiki>class="sortable"</nowiki> | ||
|Adding this class to a table will allow you to sort the entire table columns of your choice. | |Adding this class to a table will allow you to sort the entire table by columns of your choice. | ||
|- | |- | ||
|<nowiki>class="mw-collapsible mw-collapsed"</nowiki> | |<nowiki>class="mw-collapsible mw-collapsed"</nowiki> | ||
|This will allow the table to be collapsed. Removing <code>mw-collapsed</code> means it will be expanded by default. A table | |This will allow the table to be collapsed. Removing <code>mw-collapsed</code> means it will be expanded by default. A table caption specified using <code><nowiki>|+Caption</nowiki></code> will be shown next to the expand/collapse button. | ||
|- | |- | ||
|<nowiki>class="unsortable"</nowiki> | |<nowiki>class="unsortable"</nowiki> | ||
|This class can be used on column headers to disable sorting the table by that column. | |This class can be used on column headers to disable sorting the table by that column. | ||
|- | |- | ||
|<nowiki> | |<nowiki>width="100%"</nowiki> | ||
|At the table start, forces the table to fit a percentage of the screen width.<br>At the first row of a column, forces that column to fit a percentage of the table width. | |At the table start, forces the table to fit a percentage of the screen width.<br>At the first row of a column, forces that column to fit a percentage of the table width. | ||
|- | |- | ||
Line 293: | Line 350: | ||
|} | |} | ||
{| class="wikitable" style="width | ===Making a table=== | ||
|+ < | This is how to make a table in the standard way of wikitext: | ||
! | |||
<pre style="line-height:1.5em;"> | |||
{| class="wikitable" <!-- table start, put table styles here --> | |||
|+ Caption <!-- title the whole table --> | |||
|- <!-- new row --> | |||
! Header <!-- bold and doesn't get sorted --> | |||
! Other | |||
|- <!-- new row --> | |||
| Text1 <!-- table cell --> | |||
| Text2 | |||
|} <!-- table end --> | |||
</pre> | |||
The example above produces the following table: | |||
{| class="wikitable" | |||
|+ Caption | |||
|- | |||
! Header | |||
! Other | |||
|- | |||
| Text1 | |||
| Text2 | |||
|} | |||
In some cases the use of pipe characters for table markup causes issues with templates or functions. To prevent this, you may wish to construct a table using HTML tags instead: | |||
<pre style="line-height:1.5em;"> | |||
<table class="wikitable"> <!-- table start --> | |||
<caption> Caption </caption> <!-- title the whole table --> | |||
<tr> <!-- open a row --> | |||
<th> Header </th> <!-- open and close a header --> | |||
<th> Other </th> | |||
</tr><tr> <!-- close row, open another --> | |||
<td> Text1 </td> <!-- table cell --> | |||
<td> Text2 </td> | |||
</tr></table> <!-- close row then table --> | |||
</pre> | |||
The example above produces the following table: | |||
<table class="wikitable"> | |||
<caption> Caption </caption> | |||
<tr> | |||
<th> Header </th> | |||
<th> Other </th> | |||
</tr><tr> | |||
<td> Text1 </td> | |||
<td> Text2 </td> | |||
</tr></table> | |||
Notice how the two tables are exactly the same. | |||
{| class="wikitable" width="100%" | |||
|+ <h2>Other</h2> | |||
!width="41%"|Code | |||
!Usage | !Usage | ||
|- | |- |
Latest revision as of 16:22, 23 August 2024
This page lists formatting codes or tricks that can be used to help format wiki pages. It includes MediaWiki tags, table formatting, and HTML tags.
This page is missing information. You can help YumeWiki by expanding it. Details:
|
Function | Example | Output |
---|---|---|
New paragraph | Put two line breaks |
Put two line breaks |
Bold text | '''text''' | text |
Italics | ''text'' | text |
Bullet point (unordered) list | *One *Two **Sub-point *Three |
|
Numbered (ordered) list | #One #Two ##Sub-point #Three |
|
Make new headings | ==Main== Text ===Sub=== Text |
Can't show this |
Indent | :Text |
|
Signature | ~~~~ | ExampleUser (talk) 20:24, 26 June 2004 (UTC) |
Signature without timestamp | ~~~ | ExampleUser (talk) |
Horizontal rule | Text
---- Text |
Text
Text |
Links | ||
Link to a page (wikilink) | [[Yume Nikki:Madotsuki|Madotsuki]]
|
Madotsuki |
Link to a section on a page | [[Yume Nikki:Madotsuki#Madotsuki's Dreams|her dreams]]
|
her dreams |
Link to a category or file by prepending a colon | [[:Category:Yume Nikki FC Locations|List of FC Worlds]]
|
List of FC Worlds |
Link to wikipedia (interwiki link) | [[wikipedia:Main Page|Visit Wikipedia]]
|
Visit Wikipedia |
External link | [https://mediawiki.org/wiki/Cheatsheet MediaWiki's cheatsheet]
|
MediaWiki's cheatsheet |
Images | ||
Image with a caption | [[File:Yume favicon.png|70px|thumb|right|An image]]
|
|
Image in a gallery | <gallery> Yume favicon.png|An image </gallery> |
Character | Usage |
---|---|
 U+000A |
Using the HTML entity for a newline lets you avoid it getting stripped by parser functions. |
U+0020   |
Spaces are also stripped by parser functions. |
# U+0023 # |
The number sign, also called a pound or hash symbol. The HTML entity can allow escaping certain situations. |
& U+0026 & |
Ampersand, usually called the and symbol. The HTML entity can allow escaping certain situations. Used in this table to present the HTML entities. |
, U+002C , |
Commas are usually chosen as the separator for fields in arrays or {{TextSpace}}. The HTML entity allows can prevent this, although nowiki tags are a safer option. |
| U+007C | | |
The pipe character, also called the vertical line or bar, is used extensively for Mediawiki parsing. The HTML entity escapes these situations. To delay the parsing instead of prevent it completely, use {{!}} .
|
· U+00B7 · · |
Solid dot that is in the middle of a line. |
← U+2190 ← |
Leftwards arrow as one character. |
↑ U+2191 ↑ |
Upwards arrow as one character. Can be used for "to top" links. |
→ U+2192 → |
Rightwards arrow as one character. Used when listing directions on location pages. |
↔ U+2194 ↔ |
Arrow that points both left and right. Can be used to show a relation between two elements. |
∕ U+2215 |
Division slash, which appears to be a forward slash. Since it has the same appearance but no function, it can help with presenting HTML. |
< U+FF1C |
Fullwidth less-than sign. Presented wider than the normal one <. |
> U+FF1E |
Fullwidth greater-than sign >. Presented wider than the normal one >. |
Function | Example | Output |
---|---|---|
Prevent all wiki markup and HTML tags from being parsed | <nowiki>'''text'''</nowiki> | '''text''' |
Completely preformat text: wiki markup, template calls, links, parser functions, HTML codes, and comments are completely ignored and are treated as raw text | <pre>'''text'''</pre> | '''text''' |
Monospaced blocks of text | <pre style="font-family:monospace;">text</pre> | text |
Apply a background to signify text is code | <code>text</code> | text
|
Underline | <u>text</u> | text |
Highlight | <mark>text</mark> | text |
Hide text under a spoiler | <span class="spoiler">text </span> | text |
Superscript | text<sup>text</sup> | texttext |
Subscript | text<sub>text</sub> | texttext |
Small text | <small>text</small> | text |
Big text | <big>text</big> | text |
Defines a header using HTML, equivalent to ===this=== Header levels can be from 1-6 but usually 4 is the highest |
<h3>ctrt</h3> | (blanked) |
Force a line break | text1<br>text2 | text1 text2 |
Force following text to appear below all floating elements instead of flowing adjacent. See also: {{clear}} | [[File:Cagedfairy.png |thumb|right|Text]] <br style="clear:both"> text | text |
[[File:Cagedfairy.png |thumb|right|Text]] text | text | |
Blockquote. Also see {{quote}}. Do not use this for text indents, instead use {{indent}}. | <blockquote>text</blockquote> |
|
Create an invisible link anchor: Help:Formatting#Anchor. This can be placed within a header (inside of the equal signs) to make an alternate header link. | <span id="Anchor"></span> | |
Comments: only present when editing, unless within <pre> or <nowiki> tags. | <!--text--> |
Function | Style/Class | Output | |
---|---|---|---|
Center text | style="text-align: center;" | text
| |
Center elements | class="center" | text
| |
Format text into a specified number of columns (or use "auto") | style="column-count: 2;" | text1
text2 text3 | |
Present elements adjacent to each other. In the example it shows that you can place an image next to a gallery, which is usually not possible. | style="display: flex; flex-direction: row;" | ||
Collapsible Sections | |||
Allows text to be collapsed | class="mw-collapsible" | text1
text2 | |
Collapsed by default | class="mw-collapsible mw-collapsed" | text1
text2 | |
Gives the content the style of the table of contents | class="toccolours mw-collapsible" | text1
text2 | |
Use inside a div with mw-collapsible and only the text inside this inner div will collapse. The rest will never collapse. | class="mw-collapsible-content" | <div class="toccolours mw-collapsible mw-collapsed">text1<div class="mw-collapsible-content">text2</div></div> | |
text1
text2 | |||
Custom toggle button for a collapsible section. Stays the same when pressed. | class="mw-collapsible-toggle" | <div class="mw-collapsible"> <div class="mw-collapsible-toggle mw-collapsible-text">[Show/Hide]</div> <div class="mw-collapsible-content" >text </div></div> | |
[Show/Hide] text |
Function | Example | Output |
---|---|---|
Unordered list; equivalent to using * at the start of a line | <ul> <li>text1</li> <li>text2</li> <li>text3</li> <li>text4</li> </ul> |
|
This list style forces floating elements such as image thumbs to appear on the same line, even if they are otherwise unable. | <ul> <li style="display: inline-block;>[[File:Cagedfairy.png|thumb|Text]]</li> <li style="display: inline-block;">[[File:Boyoutline.png|thumb|Text]]</li> </ul> | |
This list style can be used in addition to the previous one to align the elements to the top, middle, or bottom of the lines they are occupying. | <ul> <li style="display: inline-block; vertical-align: middle;">[[File:Cagedfairy.png|thumb|Text]]</li> <li style="display: inline-block; vertical-align: middle;">[[File:Boyoutline.png|thumb|Text]]</li> </ul> |
Code | Usage |
---|---|
class="wikitable" | Use at the table start to make it look like a standard table. |
class="sortable" | Adding this class to a table will allow you to sort the entire table by columns of your choice. |
class="mw-collapsible mw-collapsed" | This will allow the table to be collapsed. Removing mw-collapsed means it will be expanded by default. A table caption specified using |+Caption will be shown next to the expand/collapse button.
|
class="unsortable" | This class can be used on column headers to disable sorting the table by that column. |
width="100%" | At the table start, forces the table to fit a percentage of the screen width. At the first row of a column, forces that column to fit a percentage of the table width. |
style="text-align: center;" | At the table start, centers all text in the table. On a table cell, centers the cell contents. |
style="vertical-align: top;" | Change the vertical alignment of elements in a cell (the default is middle ).
|
Making a table
This is how to make a table in the standard way of wikitext:
{| class="wikitable" <!-- table start, put table styles here --> |+ Caption <!-- title the whole table --> |- <!-- new row --> ! Header <!-- bold and doesn't get sorted --> ! Other |- <!-- new row --> | Text1 <!-- table cell --> | Text2 |} <!-- table end -->
The example above produces the following table:
Header | Other |
---|---|
Text1 | Text2 |
In some cases the use of pipe characters for table markup causes issues with templates or functions. To prevent this, you may wish to construct a table using HTML tags instead:
<table class="wikitable"> <!-- table start --> <caption> Caption </caption> <!-- title the whole table --> <tr> <!-- open a row --> <th> Header </th> <!-- open and close a header --> <th> Other </th> </tr><tr> <!-- close row, open another --> <td> Text1 </td> <!-- table cell --> <td> Text2 </td> </tr></table> <!-- close row then table -->
The example above produces the following table:
Header | Other |
---|---|
Text1 | Text2 |
Notice how the two tables are exactly the same.
Code | Usage |
---|---|
resultsheader= «pre»«nowiki»|resultsfooter= «/nowiki»«/pre» | Add to the end of a DPL parser function and the output will be unformatted. |