Wiki reference notes

From w.mfi
Revision as of 16:40, 12 March 2022 by MikeFay (talk | contribs) (→‎Tables)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

These are notes to myself about things I use on Mediawiki, crib notes. Maybe they'll help you too.

Fonts and Size

For font sizing, use

  <big>   not <Large>

You can also use xx-small, x-small, small, medium, large, x-large, and xx-large and/or larger or smaller with <span style="font-size:xx-small;">; see this for more.

Also see the <font> entry there for more options. And:

for reasons unknown, "nowiki" isn't working in the previous two bullets. so I forced it. I hate this crap.

See but I can't get this to work. Also can't get CSS Font to work.


You can highlight something like this:

You can <span style="background:yellow">highlight something</span> like this
You can <span style="color:red">change text color</span> like this

There are lots of different colors to choose from, for both background and foreground (font) color.

Text Alignment

From MediaWiki Support Desk:

 <div style='text-align: center;'>I am centered</div>
 <div style='text-align: left;'>I am left aligned</div>
 <div style='text-align: right;'>I am right aligned</div>
I am centered
I am left aligned
I am right aligned


I like listing data, but I don't like default wiki tables. Here's an example of a nice tight table, from my No Man's Sky page:

Mineral Values in No Man's Sky
Metal Units per
U/p vs.
U/p vs.
Emeril 275.00 +186% 100.0%
Gold 220.00 55 +129% 80.0%

In code:

:{| class="wikitable" style="text-align: center;"
|+ Mineral Values in No Man's Sky
|- valign=bottom
! Metal
! <strike>U</strike>nits per<br>piece
! style="border-left: 2px solid;" | Δ<br><strike>U</strike>/p
! <strike>U</strike>/p vs.<br>Iridium
! <strike>U</strike>/p vs.<br>Emeril
|- style="border-top: 2px solid;" 
| Emeril || 275.00 
| style="border-left: 2px solid;" |  || +186% || 100.0%
| Gold || 220.00 
| style="border-left: 2px solid;" | 55 || +129% 
| align="right" | 80.0%

Oddly, | align="right" | only works sometimes/seldom, sigh. Usually you must use the verbose

| style="text-align:left;" |

You only need one bang (!) instead of pipe (|) at the beginning of a row to give the whole row the title style (bolded and shaded).

You can use this for the initial table callout if you want it collapsible, sortable, or centered on the page (but I usually just indent it once, and make them small):

{| class="wikitable collapsible autocollapse sortable" style="text-align: center; margin-left: auto; margin-right: auto;"

For more on tables: MediaWiki Help, Wikipedia Help

If a table is too wide for one screen, wrap it in this:

<div style="width: 100%; overflow-x: scroll;">


Put "sortable" in the table intro.


I used <strike> to turn a simple "U" into the special Unit (money symbol) of that game.


Can make a table be auto-collapsed or not; see Wikipedia Help:Collapsing.

Header Line Breaks

As you can see, you can start header text on a new row to make entries be two lines tall to essentially force a word-wrap within the column header itself. Or just insert a <br>. I like to keep columns tight, so eyes don't have tons of left to right movement to read a row. Maybe I went a little overboard here, but I hate it when a very long table has very wide header text, even though the text in each column is very narrow. What a waste of space.

Unfortunately, I haven't found a way to have the column header row be bottom-centered vertically.

A tight ASCII table

Excel to Wiki Table Converters

Here are a couple of converters; there are many out there. It all depends on what you want.

I like to tweak and haven't found a single one that doesn't always need post-editing. In particular, I think each table row should be on one line and not make every cell start a new line. A table is a table, whether in raw wiki code or not. Since not a single converter does this, I have to use TextPad all the time (see below).

  • ConvertCSC: This is what I usually use, but I have to change a dozen settings every single time I use it.
  • is very simple and quick. But what you see is what you get. Not for tweakers.

Later versions of MediaWiki let you cut and paste directly out of Excel into the "Edit" window (but not "Edit Source").

Note: In MediaWiki wiki-table format, you can't put a border or alignment all the way down just one column. You have to edit the individual cells. You can do it if you use html formatting, though (with td /td type of formatting) if you use colgroup.

TextPad Regular Expressions and Special Characters

To prevent TextPad from choking on special characters (like the '|' pipe character when trying to search and replace line-wraps in Excel-to-wiki table output utilities),

Just put a \ in front of the special character (here, the | pipe).

ASCII tables

Every now and then, you want to forget all the built-in wiki table sophistry and just make a super-tight ASCII table. Here is a super tight table I made for XCOM 1994.

These tables are made very simply: Just put three spaces at the beginning of each line like so:

  <--- three spaces here

This over-rides all formatting and creates straight text. Strictly speaking, MediaWiki doesn't know or care that you're making a table.

This be straight-up fixed-width characters and spaces. Because sometimes it's perfect.

You can still put in, e.g., underlining codes and hotlinks, like I did.

Special Characters

Here are some special characters, especially math, taken from, e.g., this page:

Punctuation: ¿ ¡ « » § ¶ † ‡ • - – —
Commercial symbols: ™ © ® ¢ € ¥ £ ¤ ₣
Greek characters: α β γ δ ε ζ η θ ι κ λ μ ν ξ ο π ρ σ ς τ υ φ χ ψ ω Γ Δ Θ Λ Ξ Π Σ Φ Ψ Ω
Math characters: ∫ ∑ ∏ √ − ± ∞ ≈ ∝ ≡ ≠ ≤ ≥ × · ÷ ∂ ′ ″ ∇ ‰ ° ∴ ø ∈ ∩ ∪ ⊂ ⊃ ⊆ ⊇ ¬ ∧ ∨ ∃ ∀ ⇒ ⇔ → ↔ ↑ ℵ ∉ °
Fractions: ¼ ½ ¾ ⅓ ⅔ ⅕ ⅖ ⅗ ⅘ ⅙ ⅚ ⅛ ⅜ ⅝ ⅞ ‰ (per mille)
Emoticons: 🙂😊😀😁 😃😄😍 😆😂 ☹️🙁😠😡😞😟😣😖 😢😭😂 😨😧😦😱😫😩 😮😯😲 😺😸🐱 😼 😗😙😚😘😍
Assorted: ♥ ♠ ♣ ♦ ‹ ◊ › ← ↑ → ↓

You don't need to look at the source code here. Just directly cut and paste them into your wiki text.

More on special characters, Unicode, etc.

Forcing a new line break

Use either

 <br />  or  <p>yer text goes here</p>

Special line-break and related handling

A non-breaking hyphen is code &#8209; and a non-breaking space is &nbsp;.  

Note: To get &nbsp; to properly display, use &amp; for its ampersand. And to get &amp; to display, use & # 3 8 ; (without spaces) for its ampersand.   ... It is to laugh. 😂

For more on special characters, like hard hyphens and non-breaking spaces, see Help:Line-break handling.

Displaying images

A typical image

A recent JPG

For this image, use this callout:

[[Image:TWB Food Level Tooltip - Mide Summer 911 screencap 2020-07-03.jpg|100px|thumb|right|A recent JPG]]

Use "Media:" for, e.g., PDFs and XLSs.

For more info, see MediaWiki Help:Images.

I find it odd that anything you upload is prefaced with "File:" in your upload directory... I'm not sure when you'd ever actually use "File:" in a callout.

To make a big image auto-fit viewers' screens

First define, e.g., a class "res-img" in your wiki's Common.css (which I've done):

 /* To make images responsive */
 .res-img img {

Then just wrap your image in this div, anywhere on your wiki:

 <div class="res-img">

See this for more info.

How to use direct URL and have a "cover" image for PDF, XLS, etc.

Table of Vendors in the Game

For a click-able image that tells what type of file it is (without showing its contents), and which will immediately download the file, use:

[[File:PDF_icon.GIF|150px|right|link=|thumb|Table of Vendors in the Game]] 
  • You MUST use httpS on file path (as shown) or it won't quite work right.
  • The one for Excel is Excel_icon.gif - watch the caps!

The "thumb" actually causes the caption here, despite what MediaWiki help says. And the media file has to be called out by direct file location due to bug phab:T18409.

If you're working with a template, you can use a statement like:

[[File:{{{Download}}} | thumb | link={{SERVER}}/media/{{urlencode:{{{Download}}}|WIKI}} | {{{Caption|}}} ]]

To have a link to the file's page instead of the file itself, put a colon in front of File:, like this:

[[:File:My_Spreadsheet.xls|thumb|Here's a link to the file's page, to see revision history.]]

See Help:Linking_to_files.

For more info, see this MediaWiki Support topic.

Horizontal Line (or Rule)

Just put four dashes on an empty line. It's a pretty thin line.

Collapsible Elements

Used on my wiki home page and elsewhere. Here's the wiki manual for it. Especially see its section on Custom Toggle Links.

Formed as follows:

<span class="mw-customtoggle-TOC_SmartHome"><h2>Smart Home Tech</h2></span>
 <div class="mw-collapsible mw-collapsed" id="mw-customcollapsible-TOC_SmartHome">
  ''insert expanding text here''

Or for a simpler one:

<div class="toccolours mw-collapsible mw-collapsed" style="width:400px; overflow:auto;">
 Gory details of battery meter pixel counts
 <div class="mw-collapsible-content">
 Expanded text goes here

Gory details of battery meter pixel counts


The custom collapsible i.d. can actually be called from anywhere. But be careful not to copy the i.d. when cutting and pasting, or all your "different" collapsible elements will reference the same text. You must use a unique i.d. for each unique element.

Here's a further simplification I use. Note that "mw-collapsed" is commented out in the copy-able text here, but not in the actual code. This bars it from collapsing while you're working on the page (if in the Source Editor, which I often am). Then just take the <!--- and ---> out when you're done editing and want it to collapse.

<div class="toccolours mw-collapsible mw-collapsed">
 ''A printable ruler for measuring on the screen''
 <div class="mw-collapsible-content">
 '''Great job mf.i!'''

A printable ruler for measuring on the screen

Great job mf.i!

Using the data-collapsetext and data-expandtext attributes one can define a custom text for the toggle labels added by the script. When added in wikitext these could be populated by a localized message like:

Can you see me?


Alternate Title for a Wiki Page

I try to use standardized names for my wiki "URLs" to differentiate, e.g., games from other types of pages. But URLs make for bad page titles, and MediaWiki coops them by default. To get around it, put something like this at the top of the page:

  {{DISPLAYTITLE:MF.i's Death Stranding info}}

This is for my Death Stranding page, actual URL "Game-Death-Stranding" (a yucky page title).

Take a look. Note the actual URL.

Table of Contents (TOC)

To force a TOC at a particular place, use the magic word:


This uses TWO underscore characters on each side of TOC.

It can put text after a TOC but before headings start.

To turn off the TOC, use this anywhere on the page:


For example, see my DS page. I turned it off because otherwise I have a lot of headings that go directly to other pages... it's confusing to click on a TOC only to be brought to another thing right on that very same page that you have to click on again.

Note that __TOC__ will over-ride it, of course.

Also: I googled whether you can Collapse the TOC on a particular page, but couldn't find a way. You can either have all TOCs collapsed, or none, by default, but there's no switch for individual ones. Instead, just put a collapsible element around the TOC magic word on specific pages, as needed.

For more info see MediaWiki's Manual:Table of contents.

Change Number of Rows in Source Editor

The default editing box has 25 rows. If you have a tall (portrait) monitor, you might want more. In the wiki's search box, type:


This might be blank if you've never edited it before. Edit Source and type:

 #wpTextbox1 { height: 25em; }

That's it. It doesn't need semicolon or header or anything else. Change the number to whatever you want. For more info:

Simple Tooltip

I installed MediaWiki's Extension:SimpleTooltip. After that, I can make a tooltip with:

{{#tip-text: text | tooltip-text}}   or   {{#simple-tooltip: text | tooltip-text}}

See the extension page for more info, including how to make a tooltip off of a blue circled question mark (but I haven't uploaded an image for it yet).

Caution: This extension is buggy; it makes the remainder of the page have the level of indentation of the tooltip's paragraph (from colon indents, bullets, and hashtag numeric bullets). A workaround is to only use it in paragraphs that have zero indentation. You could also force Outdents but I'd have to activate Outdent templates somehow.

Referencing a place (table, figure) in Text

See this MW Support post for now.

MediaWiki Version


Hidden Text

Like this:

<!--- Comment --> 

It can be right in the middle of a command, like the "collapsed" in an expandable div section when you don't want it collapsing all the time while you compose it. (Then uncomment "collapsed" when you finish working on it.)

Do longer comments like this:

/*   You can have multiple & blank lines in here. Doesn't have to be indented.  */