Wiki formatting: Difference between revisions

Latest revision as of 16:40, 9 October 2024

Purpose

This page was created as a result of the Wiki style guide forum thread.

Most wiki (doc.BoardGameArena.com) formatting is not preserved on BoardGameArena.com, but there are some workarounds. This page is a collection of unofficial tips on how to make wiki pages display well in-game and on game panels.

Feel free to add additional issues, advice and templates 🙂

Help:Formatting

Note: Wiki page changes are updated once per day on BoardGameArena.com.

Languages

Wiki page content displays:

User's language, else
English, else
Create this page link/button.

e.g. A Chinese user reads the Jump Drive rules summary on its game panel page, displayed in English (en.doc.boardgamearena.com/Gamehelpjumpdrive) because the Chinese (zh.doc.boardgamearena.com/Gamehelpjumpdrive) page does not exist. The user sees a typo in the English rules and selects the edit page link to correct it, but the Chinese wiki's create page is displayed instead.

Bug reports

Link for editing is misleading

Templates and some format don't work in other language

Lists

Help:Lists

Issues

common.css rules

li {
    list-style: none; /*removes list markers*/
}

li, ul {
    margin: 0; /*removes margin before and after lists*/
    padding: 0; /*removes list indentation*/
}

blockquote, body, code, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, pre, td, textarea, th, ul {
    margin: 0; /*removes inline and block margins*/
    padding: 0; /*removes list indentation*/
}

Markers (bullets *, numbering #), margins and padding are removed on BoardGameArena.com.

Bug reports

Bullet points not visible

Workarounds

Use static markers (•,-,1.).
Replace with HTML + CSS.

common.css rules

ul.bulletlist li {
    list-style: disc none inside
}

.wikicontent p {
    margin-bottom: 8px;
    margin-top: 8px
}

Bullet lists

Wiki vs BoardGameArena.com list formatting
	Wiki text	Wiki	BGA
Dynamic marker¹ `*`	* A * B * C	A B C	A B C
Dynamic¹ + static marker	- A - B *- C	- A - B - C	- A - B - C
static marker + line breaks²	- A - B - C	- A - B - C	- A - B - C
HTML + CSS	<ul class="bulletlist" style=" margin:1em 0; padding-inline-start:40px; "> <li>A</li> <li>B</li> <li>C</li> </ul>	A B C	A B C

<ul>unordered list</ul>
<li>list item</li>

Numbered lists

Wiki vs BoardGameArena.com list formatting
	Wiki text	Wiki	BGA
Dynamic marker¹ `#`	# A # B # C	A B C	A B C
Dynamic¹ + static marker	# 1. A # 2. B # 3. C	1. A 2. B 3. C	1. A 2. B 3. C
static marker + line breaks²	1. A 2. B 3. C	1. A 2. B 3. C	1. A 2. B 3. C
HTML + CSS	<ol style=" margin:1em 0; padding-inline-start:40px; "> <li style="list-style-type:decimal;">A</li> <li style="list-style-type:decimal;">B</li> <li style="list-style-type:decimal;">C</li> </ol>	A B C	A B C

<ol>ordered list</ol>
<li>list item</li>

Definition lists

Wiki vs BoardGameArena.com list formatting
	Wiki text	Wiki	BGA
Dynamic marker¹ `;` `:`	;A term: A detail ;B term: B detail ;C term: C detail	A term A detail B term B detail C term C detail	A term A detail B term B detail C term C detail
Dynamic¹ + static marker	;'''A term''': A detail ;'''B term''': B detail ;'''C term''': C detail	A term A detail B term B detail C term C detail	A term A detail B term B detail C term C detail
static marker + line breaks²	'''A term''': A detail '''B term''': B detail '''C term''': C detail	A term: A detail B term: B detail C term: C detail	A term: A detail B term: B detail C term: C detail
HTML + CSS	<dl> <dt><b>A term</b></dt> <dd style="margin-inline-start:1.6em;">A detail</dd> <dt><b>B term</b></dt> <dd style="margin-inline-start:1.6em;">B detail</dd> <dt><b>C term</b></dt> <dd style="margin-inline-start:1.6em;">C detail</dd> </dl>	A term A detail B term B detail C term C detail	A term A detail B term B detail C term C detail

<dl>description list</dl>
<dt>description term</dt>
<dd>description details</dd>

¹Dynamic markers generate HTML list structure.

²Without dynamic markers, <p>paragraphs</p> are generated which require line breaks before and after the "list" to prevent merging into surrounding paragraphs.

Headings

Level 1 (h1) headings are the title of the page e.g. = Wiki formatting =, = Gamehelp[name] =, = Tips_[name] =.

Issues

In-game h2 and h3 headings are visually indistinguishable.
In-game h3 headings overlap text from the previous section.
h5 headings and below are visually indistinguishable from body text.
Inconsistency between in-game and game panel headings.

Bug reports

Workarounds

Since in-game h3 headings became indistinguishable from h2 headings:

Change h3 to h4 headings.
Use additional line breaks before h3 headings.

Wiki vs BoardGameArena.com heading formatting
	Wiki text	Wiki	BGA game panel	BGA in-game
h2	* List item == Example h2 heading == * List item	List item Example h2 heading List item	List item Example h2 heading List item	List item Example h2 heading List item
h3	* List item === Example h3 heading === * List item	List item Example h3 heading List item	List item Example h3 heading List item	List item Example h3 heading List item
h4	* List item ==== Example h4 heading ==== * List item	List item Example h4 heading List item	List item Example h4 heading List item	List item Example h4 heading List item
h5	* List item ===== Example h5 heading ===== * List item	List item Example h5 heading List item	List item Example h5 heading List item	List item Example h5 heading List item

common.css rules

blockquote, body, code, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, pre, td, textarea, th, ul {
    margin: 0; /*removes inline and block margins*/
    padding: 0; /*removes list indentation*/
}

h2 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 10px;
    margin-top: 10px;
}
blockquote, body, code, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, pre, td, textarea, th, ul {
    margin: 0;
    padding: 0;
}
body {
    font-family: Roboto,Arial,sans-serif;
    //font-size: 16px;
}
h3, h4 {
    font-weight: 700;
    margin-bottom: 5px;
}
h3 {
    display: block;
    //font-size: 1.17em;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    //font-weight: bold;
}
h3 {
    font-size: 16px;
    margin-top: 5px;
}
h4 {
    margin-top: 20px;
}
h4 {
    display: block;
    margin-block-start: 1.33em;
    margin-block-end: 1.33em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    //font-weight: bold;
}
h5 {
    display: block;
    //font-size: 0.83em;
    margin-block-start: 1.67em;
    margin-block-end: 1.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    //font-weight: bold;
}
h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    //font-weight: 400;
}

gameserver.css rules

.pagesection .wikicontent h2 {
    margin-top: 12px;
}
.pagesection h2, .pagesection h3, .portlet h2, .portlet h3 {
    background: linear-gradient(0deg,#f8f8f8,#e7e9e8);
    border-radius: 6px 6px 0 0;
    box-shadow: 0 5px 5px 0 rgba(0,0,0,.1);
    color: #385088;
    font-size: 14px;
    margin: -12px -12px 20px;
    padding: 12px;
    text-transform: uppercase;
}

Game panel heading example

Game panel content appears in a single box:

In-game heading example

In-game content appears in multiple boxes:

Links

Help:Links

The Main_Page (root) of this wiki redirects to Help.
BoardGameArena.com/doc displays the Help index of games.
Note: each heading has a unique id appended with a number as necessary.
e.g. #Issues_3 links to Links Issues and #Issues_4 links to Images Issues.

Issues

Links to section headings # do not work outside of the wiki (doc.BoardGameArena.com).
URL is resolved to /doc instead of the current page.
In-game links navigate the user away from the game.

e.g. [[#Section_heading_link]] ⇨ https://BoardGameArena.com/doc#Section_heading_link ¹.

Bug reports

¹Section links don't work

Workarounds

Remove links that do not function as expected.

Images

Help:Images

Issues

Resized images do not display on BoardGameArena.com.
e.g. [[File:Marrakech_example.jpg|300px]] because the resized image does not exist in the referenced directory.
Thumbnails images do not display on BoardGameArena.com.
e.g. [[File:Marrakech_example.jpg|thumb]] because thumbnails are just resized images.
Image links do not work on BoardGameArena.com.
e.g. [[File:Versions.png|link=https://en.doc.boardgamearena.com/images/b/b5/Factum_Rules_Summary_EN_v1.jpg]] because the link resolves to https://boardgamearena.com/dochttps://en.doc.boardgamearena.com/images/b/b5/Factum_Rules_Summary_EN_v1.jpg

Workarounds

Upload YourImage with the size it will appear and include the image as simply:
e.g. [[File:Marrakech_example.jpg]]
Create a {{gameIcon}} with a scale factor.
e.g. {{YourIcon|scale=0.5}} to reduce the image dimensions by ½.
Replace image links with regular links.
e.g. [[File:Versions.png]]

[https://en.doc.boardgamearena.com/images/b/b5/Factum_Rules_Summary_EN_v1.jpg LinkText]

Tips

Optionally include rollover text [[File:Marrakech_example.jpg|Example move]]

Tables

Help:Tables

Issues

common.css rules

.wikicontent table {
    border-collapse: collapse;
    margin-left: 5px;
    margin-top: 5px;
    width: 98%;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
caption, th {
    text-align: left;
}
address, caption, cite, code, dfn, em, strong, th, var {
    font-style: normal;
    font-weight: 400;
}
.wikicontent table td, .wikicontent table th {
    padding: 5px;
    text-align: center;
}
blockquote, body, code, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, pre, td, textarea, th, ul {
    margin: 0;
    padding: 0;
}
.wikicontent table td, .wikicontent table th {
    padding: 5px;
    text-align: center;
}

width: 98%; stretches tables across the screen on BoardGameArena.com.
Borders do not display on BoardGameArena.com.

Workarounds

style="width:auto;" fits column width to the contents.
border="2" creates table cell borders.
Replace with HTML + CSS grid.

Wiki text Wiki BGA

Raw wikitable

{|class="wikitable"
|+Caption
!0-90
|⭐
|-
!91-110
|⭐⭐
|-
!111-125
|⭐⭐⭐
|}

Caption
0-90	⭐
91-110	⭐⭐
111-125	⭐⭐⭐

Caption
0-90	⭐
91-110	⭐⭐
111-125	⭐⭐⭐

width:auto; border="2"

{|class="wikitable" style="width:auto;" border="2"
|+Caption
!0-90
|⭐
|-
!91-110
|⭐⭐
|-
!111-125
|⭐⭐⭐
|}

Caption
0-90	⭐
91-110	⭐⭐
111-125	⭐⭐⭐

Caption
0-90	⭐
91-110	⭐⭐
111-125	⭐⭐⭐

Option grids

Option grids can help visualise multiple interdependent options. Where inflexible wiki text tables fall short, HTML + CSS grid is responsive to screen size e.g. GameHelpPente:

Training mode only

Default

Other

# of players

2

3

4

Free-for-all

Team

All options win

Align exactly 5 stones in a row

Align exactly 4 stones in a row

Overline win

May align more than 5 stones in a row

May align more than 4 stones in a row

Capture win

Make 5 captures

Make 4 captures

Capture three

May capture two or three stones (Keryo Pente)

Self-capture

No effect: a stone may be placed in a capture position

Self-capture: results in self-capture! (Poof Pente)

Forbidden: a stone may not be placed in a capture position

Overtime capture

Break the line: may capture to break a winning line (Boat Pente)

Capture the line: may capture an entire winning line

Mixed capture

Enabled: May capture stones of mixed colour

Disabled: Captures of one colour only

HTML + inline CSS

<div style="display:flex;flex-flow:row wrap;max-width:max-content;border:0.1rem solid #aaa;">
 <div style="box-shadow:inset 0 0 0 0.1rem #f0f;background:#fef;padding:0.5rem;width:max-content;">Training mode only</div>
 <div style="box-shadow:inset 0 0 0 0.1rem #0f0;background:#efe;padding:0.5rem;width:max-content;">Default</div>
 <div style="box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;width:max-content;">Other</div> 
</div>

<div style="display:grid;max-width:50rem;border:0.1rem solid #aaa;">
 <div   style="grid-area: 1 / 1 /  3 / 2;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;font-weight:bold;"># of players</div>
  <div  style="grid-area: 1 / 2 /  3 / 3;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;font-weight:bold;text-align:center;font-size:1.2rem;">2</div>
  <div  style="grid-area: 1 / 5 /  3 / 6;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;font-weight:bold;text-align:center;font-size:1.2rem;">3</div>
  <div  style="grid-area: 1 / 3 /  2 / 5;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;font-weight:bold;text-align:center;font-size:1.2rem;">4</div>
   <div style="grid-area: 2 / 4 /  3 / 5;box-shadow:inset 0 0 0 0.1rem #0f0;background:#efe;padding:0.5rem;font-weight:bold;text-align:center;">Free-for-all</div>
   <div style="grid-area: 2 / 3 /  3 / 4;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;font-weight:bold;text-align:center;">Team</div>
 <div   style="grid-area: 3 / 1 /  4 / 2;box-shadow:inset 0 0 0 0.1rem #0f0;background:#efe;padding:0.5rem;font-weight:bold;">All options win</div>
  <div  style="grid-area: 3 / 2 /  4 / 4;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">Align exactly <b>5</b> stones in a row</div>
  <div  style="grid-area: 3 / 4 /  4 / 6;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">Align exactly <b>4</b> stones in a row</div>
 <div   style="grid-area: 4 / 1 /  5 / 2;box-shadow:inset 0 0 0 0.1rem #0f0;background:#efe;padding:0.5rem;font-weight:bold;">Overline win</div>
  <div  style="grid-area: 4 / 2 /  5 / 4;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">May align more than <b>5</b> stones in a row</div>
  <div  style="grid-area: 4 / 4 /  5 / 6;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">May align more than <b>4</b> stones in a row</div>
 <div   style="grid-area: 5 / 1 /  6 / 2;box-shadow:inset 0 0 0 0.1rem #0f0;background:#efe;padding:0.5rem;font-weight:bold;">Capture win</div>
  <div  style="grid-area: 5 / 2 /  6 / 4;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">Make <b>5</b> captures</div>
  <div  style="grid-area: 5 / 4 /  6 / 6;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">Make <b>4</b> captures</div>
 <div   style="grid-area: 6 / 1 /  7 / 2;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;font-weight:bold;">Capture three</div>
  <div  style="grid-area: 6 / 2 /  7 / 6;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">May capture two <b>or three</b> stones (Keryo Pente)</div>
 <div   style="grid-area: 7 / 1 / 10 / 2;box-shadow:inset 0 0 0 0.1rem #0f0;background:#efe;padding:0.5rem;font-weight:bold;">Self-capture</div>
  <div  style="grid-area: 7 / 2 /  8 / 6;box-shadow:inset 0 0 0 0.1rem #0f0;background:#efe;padding:0.5rem;">No effect: a stone may be placed in a capture position</div>
  <div  style="grid-area: 8 / 2 /  9 / 6;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">Self-capture: results in <b>self-capture!</b> (Poof Pente)</div>
  <div  style="grid-area: 9 / 2 / 10 / 6;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">Forbidden: a stone may <b>not</b> be placed in a capture position</b></div>
 <div   style="grid-area:10 / 1 / 12 / 2;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;font-weight:bold;">Overtime capture</div>
  <div  style="grid-area:10 / 2 / 11 / 6;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">Break the line: may capture to break a winning line (Boat Pente)</div>
  <div  style="grid-area:11 / 2 / 12 / 6;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">Capture the line: may capture an entire winning line</div>
 <div   style="grid-area:12 / 1 / 14 / 2;box-shadow:inset 0 0 0 0.1rem #0f0;background:#efe;padding:0.5rem;font-weight:bold;">Mixed capture</div>
  <div  style="grid-area:12 / 3 / 13 / 6;box-shadow:inset 0 0 0 0.1rem #0f0;background:#efe;padding:0.5rem;">Enabled: May capture stones of mixed colour</div>
  <div  style="grid-area:13 / 2 / 14 / 6;box-shadow:inset 0 0 0 0.1rem #ddd;background:#fff;padding:0.5rem;">Disabled: Captures of one colour only</div>
</div>

Unresponsive wiki text equivalent

{|class="wikitable" style="text-align:left;width:max-content;" border="2"
|+Options
|-
!rowspan="2" style="text-align:left;"|# of players
!rowspan="2" style="text-align:center;"|2
!colspan="2" style="text-align:center;"|4
!rowspan="2" style="text-align:center;"|3
|-
!style="text-align:center;"|Team
!style="text-align:center;background:#efe;box-shadow:inset 0 0 0 1px #4f4;"|Free-for-all
|-
!style="text-align:left;background:#efe;box-shadow:inset 0 0 0 1px #4f4;"|All options win
|colspan="2"|Align exactly '''5''' stones in a row
|colspan="2"|Align exactly '''4''' stones in a row
|-
!style="text-align:left;background:#efe;box-shadow:inset 0 0 0 1px #4f4;"|Overline win
|colspan="2"|May align more than '''5''' stones in a row
|colspan="2"|May align more than '''4''' stones in a row
|-
!style="text-align:left;background:#efe;box-shadow:inset 0 0 0 1px #4f4;"|Capture win
|colspan="2"|Make '''5''' captures
|colspan="2"|Make '''4''' captures
|-
!style="text-align:left;"|Capture three
|colspan="4"|May capture two '''or three''' stones (Keryo Pente)
|-
!rowspan="3" style="text-align:left;background:#efe;box-shadow:inset 0 0 0 1px #4f4;"|Self-capture
|colspan="4" style="background:#efe;box-shadow:inset 0 0 0 1px #4f4;"|No effect: a stone may be placed in a capture position
|-
|colspan="4"|Self-capture: results in '''self-capture!''' (Poof Pente)
|-
|colspan="4"|Forbidden: a stone may '''not''' be placed in a capture position
|-
!rowspan="2" style="text-align:left;"|Overtime capture
|colspan="4"|Break the line: may capture to break a winning line (Boat Pente)
|-
|colspan="4"|Capture the line: may capture an entire winning line
|-
!rowspan="2" style="text-align:left;background:#efe;box-shadow:inset 0 0 0 1px #4f4;"|Mixed capture
|
|colspan="3" style="background:#efe;box-shadow:inset 0 0 0 1px #4f4;"|Enabled: May capture stones of mixed colour
|-
|colspan="4"|Disabled: Captures of one colour only
|}

Blockquote

Issues

common.css rules

blockquote, body, code, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, pre, td, textarea, th, ul {
    margin: 0; /*removes inline and block margins*/
    padding: 0; /*removes list indentation*/
}

Margins and padding are removed on BoardGameArena.com.
No left border.

Workarounds

Replace with HTML + CSS.

HTML + CSS <blockquote> formatting

Wiki text	Wiki	BGA
<blockquote style=" margin:1em 0; margin-inline:40px; padding:8px 32px; border-left:4px solid #eaecf0; "> This is a <blockquote> </blockquote>	This is a `<blockquote>`	This is a `<blockquote>`

Wiki templates

Help:Templates

Template:InfoBox

Customisable container(s) responsive to screen size.

Example

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Create your own icons

Step 1

Upload YourImage.png

Step 2

Create https://en.doc.boardgamearena.com/Template:YourIcon

Fill in the parameters:

{{gameIcon
|tooltip=
|imageFileName=
|scale=1
|width=
|height=
|x=0
|y=0
|={{{1|&ZeroWidthSpace;}}}
|textColor=black
|outlineColor=white
}}<noinclude>
[[Category:YourIcons]]
<noinclude>

Step 3

Insert {{YourIcon}}

See Examples

Category:GameIconTemplates

Cylinder tokens
Wiki text	Result
`{{redCylinder\|1}}`	1
`{{orangeCylinder\|2}}`	2
`{{yellowCylinder\|3}}`	3
`{{greenCylinder\|4}}`	4
`{{blueCylinder\|5}}`	5
`{{purpleCylinder\|6}}`	6
`{{whiteCylinder\|7}}`	7
`{{greyCylinder\|8}}`	8
`{{blackCylinder\|9}}`	9
`{{creamCylinder\|10}}`	10

Meeples
Wiki text	Result
`{{meeple\|red\|1}}`	1
`{{meeple\|orange\|2}}`	2
`{{meeple\|yellow\|3}}`	3
`{{meeple\|green\|4}}`	4
`{{meeple\|blue\|5}}`	5
`{{meeple\|purple\|6}}`	6
`{{meeple\|white\|7}}`	7
`{{meeple\|grey\|8}}`	8
`{{meeple\|black\|9}}`	9

Dice
Wiki text	Result
`{{whiteDie\|1}}`
`{{yellowDie\|2}}`
`{{orangeDie\|3}}`
`{{blackDie\|4}}`

Category:Card_templates

Template:Card
Wiki text	Result
`{{card\|A}}`	A
`{{club\|K}}`	K♣
`{{spade\|Q}}`	Q♠
`{{heart\|J}}`	J♥
`{{diamond\|10}}`	10♦
`{{cardBack}}`	🟔
`{{club\|color=green}}`	♣

Template:Cardholder
Wiki text	Result
`{{cardholder\|{{diamond\|A}}{{club\|A}}{{heart\|A}}{{spade\|A}} \|Alice}}`	A♦A♣A♥A♠ Alice

Wiki text	Result
`{{Beginner}} {{Beginner\|0}}`	Beginner 0
`{{Apprentice}} {{Apprentice\|1}}`	Apprentice 1
`{{Average}} {{Average\|100}}`	Average 100
`{{Good}} {{Good\|200}}`	Good 200
`{{Strong}} {{Strong\|300}}`	Strong 300
`{{Expert}} {{Expert\|500}}`	Expert 500
`{{Master}} {{Master\|700}}`	Master 700

Wiki text	Result
`{{player\|2}}`	2players
`{{hand\|4}}`	4cards in hand

Category:GameBoardTemplates

Template:Chessboard

{{Chessboard}}

A

B

C

D

E

F

G

H

8

7

6

5

4

3

2

1

A

B

C

D

E

F

G

H

Template:Goboard9

{{Goboard9}}

A

B

C

D

E

F

G

H

J

9

8

7

6

5

4

3

2

1

A

B

C

D

E

F

G

H

J

Template:Quoridorboard

{{Quoridorboard}}

A

B

C

D

E

F

G

H

I

9

8

7

6

5

4

3

2

1

A

B

C

D

E

F

G

H

I

Template:HexMap

{{HexMap}}

1

@@ Line 25: / Line 25: @@
 * '''[https://boardgamearena.com/bug?id=102754 Link for editing is misleading]'''
+* '''[https://boardgamearena.com/bug?id=117297 Templates and some format don't work in other language]'''
 ==Lists==
@@ Line 618: / Line 620: @@
 # Resized images do not display on [https://BoardGameArena.com BoardGameArena.com].
-#: e.g. <code><nowiki>[[File:Marrakech_example.jpg</nowiki>'''|300px'''<nowiki>]]</nowiki></code>) because the ''resized'' image does not exist in the referenced directory.
+#: e.g. <code><nowiki>[[File:Marrakech_example.jpg</nowiki>'''|300px'''<nowiki>]]</nowiki></code> because the ''resized'' image does not exist in the referenced directory.
+# Thumbnails images do not display on [https://BoardGameArena.com BoardGameArena.com].
+#: e.g. <code><nowiki>[[File:Marrakech_example.jpg</nowiki>'''|thumb'''<nowiki>]]</nowiki></code> because thumbnails are just resized images.
 # Image links do not work on [https://BoardGameArena.com BoardGameArena.com].
 #: e.g. <code><nowiki>[[File:Versions.png</nowiki>'''|link=https://en.doc.boardgamearena.com/images/b/b5/Factum_Rules_Summary_EN_v1.jpg'''<nowiki>]]</nowiki></code> because the link resolves to <code>https://boardgamearena.com/dochttps://en.doc.boardgamearena.com/images/b/b5/Factum_Rules_Summary_EN_v1.jpg</code>
@@ Line 624: / Line 628: @@
 ===Workarounds===
-# '''[[Special:Upload|Upload]]''' '''''YourImage''''' with the size it will appear.
+# '''[[Special:Upload|Upload]]''' '''''YourImage''''' with the size it will appear and include the image as simply:
-# Create a <code>[[#Wiki_template_method|<nowiki>{{gameIcon}}</nowiki>]]</code> with a <code>scale</code> factor.
+#: e.g. <code><nowiki>[[File:Marrakech_example.jpg]]</nowiki></code>
+# Create a <code>[[#Create_your_own_icons|<nowiki>{{gameIcon}}</nowiki>]]</code> with a <code>scale</code> factor.
 #: e.g. <code><nowiki>{{</nowiki>'''YourIcon'''|scale='''0.5'''<nowiki>}}</nowiki></code> to reduce the image dimensions by ½.
 # Replace image links with regular links.
@@ Line 992: / Line 997: @@
 |x=0
 |y=0
-|={{{|&amp;ZeroWidthSpace;}}}
+|={{{1|&amp;ZeroWidthSpace;}}}
 |textColor=black
 |outlineColor=white
@@ Line 1,106: / Line 1,111: @@
 !Result
 |-
-|<code><nowiki>{{card|=A}}</nowiki></code>
+|<code><nowiki>{{card|A}}</nowiki></code>
-|{{card|=A}}
+|{{card|A}}
 |-
-|<code><nowiki>{{club|=K}}</nowiki></code>
+|<code><nowiki>{{club|K}}</nowiki></code>
-|{{club|=K}}
+|{{club|K}}
 |-
-|<code><nowiki>{{spade|=Q}}</nowiki></code>
+|<code><nowiki>{{spade|Q}}</nowiki></code>
-|{{spade|=Q}}
+|{{spade|Q}}
 |-
-|<code><nowiki>{{heart|=J}}</nowiki></code>
+|<code><nowiki>{{heart|J}}</nowiki></code>
-|{{heart|=J}}
+|{{heart|J}}
 |-
-|<code><nowiki>{{diamond|=10}}</nowiki></code>
+|<code><nowiki>{{diamond|10}}</nowiki></code>
-|{{diamond|=10}}
+|{{diamond|10}}
 |-
 |<code><nowiki>{{cardBack}}</nowiki></code>
 |{{cardBack}}
 |-
-|<code><nowiki>{{club|colour=green}}</nowiki></code>
+|<code><nowiki>{{club|color=green}}</nowiki></code>
-|{{club|colour=green}}
+|{{club|color=green}}
 |}
@@ Line 1,133: / Line 1,138: @@
 !Result
 |-
-|<code><nowiki>{{cardholder|Alice|cards={{diamond|=A}}{{club|=A}}{{heart|=A}}{{spade|=A}} }}</nowiki></code>
+|<code><nowiki>{{cardholder|{{diamond|A}}{{club|A}}{{heart|A}}{{spade|A}} |Alice}}</nowiki></code>
-|{{cardholder|Alice|cards={{diamond|=A}}{{club|=A}}{{heart|=A}}{{spade|=A}} }}<br>
+|{{cardholder|{{diamond|A}}{{club|A}}{{heart|A}}{{spade|A}} |Alice}}<br>
 |}
 </div>
@@ Line 1,198: / Line 1,203: @@
 <code><nowiki>{{Quoridorboard}}</nowiki></code>
 {{Quoridorboard|squareSize=16}}
+</div>
+<div style="display:flex;flex-flow:column wrap;align-items:center;">
+'''[[:Template:HexMap]]'''
+<code><nowiki>{{HexMap}}</nowiki></code>
+<div style="display:flex;flex-flow:row wrap;align-items:center;gap:0.5rem;">
+{{hexMap |n=1 |
+{{hex |x=3 |y=1 |{{TaluvaSand}} |{{meeple|red}}
+}}
+{{hex |x=5 |y=1 |{{TaluvaSand}}
+}}
+{{hex |x=7 |y=1 |{{TaluvaSand}}
+}}
+{{hex |x=2 |y=2 |{{TaluvaSand}}
+}}
+{{hex |x=4 |y=2 |{{TaluvaJungle}} |{{meeple|green}}
+}}
+{{hex |x=6 |y=2 |{{TaluvaJungle}}
+}}
+{{hex |x=8 |y=2 |{{TaluvaJungle}}
+}}
+{{hex |x=1 |y=3 |{{TaluvaSand}}
+}}
+{{hex |x=3 |y=3 |{{TaluvaJungle}}
+}}
+{{hex |x=5 |y=3 |{{TaluvaClearing}} |{{meeple|blue}}
+}}
+{{hex |x=7 |y=3 |{{TaluvaClearing}} |{{meeple|red}}
+}}
+{{hex |x=2 |y=4 |{{TaluvaSand}} |{{meeple|green}}
+}}
+{{hex |x=4 |y=4 |{{TaluvaJungle}}
+}}
+{{hex |x=6 |y=4 |{{TaluvaClearing}} |{{meeple|blue}}
+}}
+}}
+{{hexMap|
+{{hiveAnt           |r=3  |x=1 |y=2 }}
+{{hiveBeetle        |r=1  |x=2 |y=3 }}
+{{hiveGrasshopper   |r=11 |x=4 |y=3 }}
+{{hiveSpider        |r=9  |x=5 |y=2 }}
+{{hiveBee|w=        |r=0  |x=3 |y=2 }}
+{{hiveGrasshopper|w=|r=0  |x=2 |y=1 }}
+{{hiveSpider|w=     |r=0  |x=4 |y=1 }}
+}}
+</div>
 </div>
 </div>

Wiki text	Result
`{{redCylinder\|1}}`	1
`{{orangeCylinder\|2}}`	2
`{{yellowCylinder\|3}}`	3
`{{greenCylinder\|4}}`	4
`{{blueCylinder\|5}}`	5
`{{purpleCylinder\|6}}`	6
`{{whiteCylinder\|7}}`	7
`{{greyCylinder\|8}}`	8
`{{blackCylinder\|9}}`	9
`{{creamCylinder\|10}}`	10

Wiki text	Result
`{{meeple\|red\|1}}`	1
`{{meeple\|orange\|2}}`	2
`{{meeple\|yellow\|3}}`	3
`{{meeple\|green\|4}}`	4
`{{meeple\|blue\|5}}`	5
`{{meeple\|purple\|6}}`	6
`{{meeple\|white\|7}}`	7
`{{meeple\|grey\|8}}`	8
`{{meeple\|black\|9}}`	9

Wiki text	Result
`{{whiteDie\|1}}`
`{{yellowDie\|2}}`
`{{orangeDie\|3}}`
`{{blackDie\|4}}`

Wiki formatting: Difference between revisions

Latest revision as of 16:40, 9 October 2024

Contents

Purpose

Languages

Bug reports

Lists

Issues

Bug reports

Workarounds

Headings

Issues

Bug reports

Workarounds

Links

Issues

Bug reports

Workarounds

Images

Issues

Workarounds

Tips

Tables

Issues

Workarounds

Option grids

Blockquote

Issues

Workarounds

Wiki templates

Template:InfoBox

Create your own icons

Category:GameIconTemplates

Category:Card_templates

Category:GameBoardTemplates

Navigation menu

Wiki formatting: Difference between revisions

Latest revision as of 16:40, 9 October 2024

Purpose

Languages

Bug reports

Lists

Issues

Bug reports

Workarounds

Headings

Issues

Bug reports

Workarounds

Links

Issues

Bug reports

Workarounds

Images

Issues

Workarounds

Tips

Tables

Issues

Workarounds

Option grids

Blockquote

Issues

Workarounds

Wiki templates

Template:InfoBox

Create your own icons

Category:GameIconTemplates

Category:Card_templates

Category:GameBoardTemplates

Navigation menu

Search