📝 Guide to Gamers' Plane BBCode

Be sure to read and follow the guidelines for our forums.

Dec 19, 2021 4:15 pm
I'm trying to keep this thread clean.

If you want to discuss this guide then please add your comments to this thread.

Gamers' Plane uses a common and lightweight markup language called BBCode to format text. As well as allowing you to format text, the BBCode on Gamers' Plane has some tags specifically designed to help with your PbP games.

Tags that are mainly used by GMs are marked with a https://gamersplane.com/images/gm_icon.png symbol, although players might find them useful too.
Table of contents

Formatting
Bold, Italic, Underline, Strikethrough, linebreak, Color, Links, Format

Formatting blocks
OOC (out of character), Spoilers (collapsible sections), Quote

Private notes
Notes, Private

Images and media
Images, Uploading images, YouTube

Tables
Tables, Table formatting

Maps
Map, Zoommap

NPCs
NPC

Character sheets
Columns, Abilities, Snippets, Roll tables, NPC lists, Snippet, Custom character sheet logo

Polls and other post widgets
Post polls, Star Wars destiny tokens

Advanced formatting
Size, Email addresses, @mentions, Code, CSS

Custom character sheet form fields
Editable fields, Checkboxes, Calculations
Last edited June 18, 2022 11:54 am
Dec 19, 2021 4:15 pm
Bold
https://i.imgur.com/qD20yFE.png
BBCode: [b]Bold text[/b]

Result: Bold text
Shortcut key: Ctrl+B
OOC:
Convention: It's a common convention on Gamers' Plane to use bold text for speech.
Italic
https://i.imgur.com/gLHSLsU.png
BBCode: [i]Italic text[/i]

Result: Italic text
Shortcut key: Ctrl+I
OOC:
Convention: It's a common convention on Gamers' Plane to use italic text for thought.
Underline
https://i.imgur.com/0v82dli.png
BBCode: [u]Underlined text[/u]

Result: Underlined text
Shortcut ket: Ctrl+U

Strikethrough
https://i.imgur.com/r7osHUd.png
BBCode: [s]Strikethrough[/s]

Result: Strikethrough

linebreak
https://i.imgur.com/zQuYaIt.png
BBCode: [linebreak]


Result: ^ a horizontal rule across the page


Color
https://i.imgur.com/VezoZJW.png
BBCode: [color="red"]red text[/color]

Result: red text


Red, blue and green are on the menu, but there are many other colours to choose from. If you're familiar with using hex values as colours then you can use those too.

BBCode: [color="#cc6600"]Gamers' Plane orange[/color]


Result: Gamers' Plane orange
[ +- ] 🎚 Dark mode automatic colour adjustment
Links
https://i.imgur.com/kLXi7hS.png
BBCode simple: [url]http://gamersplane.com[/url]

Result: http://gamersplane.com

If you put the link's URL in an attribute then you can change the link text.

BBCode changing the link text: [url=http://gamersplane.com]Gamers' Plane[/url]

Result changing the link text: Gamers' Plane

Format
https://i.imgur.com/l1kKPLG.png
BBCode: [f=large font-elite]large text[/f]

Result: large text

The f tag provides for formatting beyond the standard bold, italic and underline. Multiple formats can be applied by separating the options with a space.

Colours and background colors can be added to the list of styles too.
BBCode: [f=large color:navy background-color:gold]large text[/f]

Result: large text

The toolbar button will display a dialog to allow the options to be selected.
https://i.imgur.com/5ObhJp6.png

Headings
h1 Lorem ipsum
h2 Lorem ipsum
h3 Lorem ipsum


Text alignment
centre Lorem ipsum
center British Lorem ipsum
right Lorem ipsum


Fonts
font-opensans Lorem ipsum
font-ostrich Lorem ipsum
font-cursive Lorem ipsum
font-agency Lorem ipsum
font-neuropol Lorem ipsum
font-kelt Lorem ipsum
font-dumbledor Lorem ipsum
font-aniron Lorem ipsum
font-aladin Lorem ipsum
font-blackops Lorem ipsum
font-cabin Lorem ipsum
font-eagle Lorem ipsum
font-goudy Lorem ipsum
font-gugi Lorem ipsum
font-iceland Lorem ipsum
font-fell Lorem ipsum
font-nightshade Lorem ipsum
font-start Lorem ipsum
font-quint Lorem ipsum
font-elite Lorem ipsum
font-stalinist Lorem ipsum


Spacing
extra-space Lorem ipsum
double-space Lorem ipsum


Formatting
italic Lorem ipsum
bold Lorem ipsum
strikethrough Lorem ipsum
border Lorem ipsum


Font size
tiny Lorem ipsum
small Lorem ipsum
large Lorem ipsum
huge Lorem ipsum
gargantuan Lorem ipsum


Fancy
fancy-paper Lorem ipsum
fancy-vdu Lorem ipsum
fancy-parchment Lorem ipsum


For floating images at the side of page, put your image in a float format block.

BBCode: [f=float-right][img]https://i.imgur.com/NDHCkKy.png[/img]

https://i.imgur.com/NDHCkKy.png
Result: →

float-right Floats an image on the right
float-left Floats an image on the left
Last edited June 18, 2022 11:53 am
Dec 19, 2021 4:16 pm
OOC (out of character)
https://i.imgur.com/nMWaGAG.png
BBCode:
[ooc]This is a block of out of character text.

Used in a game post for messages between the players and GM.[/ooc]

Result:
OOC:
This is a block of out of character text.

It's often used in a game post for messages between the players and GM, rather than "in character" narrative.


Spoilers (collapsible sections)
https://i.imgur.com/WcmE9nJ.png
BBCode: [spoiler]This is a block of text that can span multiple lines.

It is then collapsed into an expandable section.[/spoiler]

Result:
[ +- ] Spoiler



Changing the title from "Spoiler"
BBCode: [spoiler="The section's title"]Spoilers can be given a title too.[/spoiler]

Result:
[ +- ] The section's title


Quote
https://i.imgur.com/AjlfxsN.png
 BBCode: [quote="Adam"]Madam, I'm Adam.[/quote]

Result:
Adam says:
Madam, I'm Adam.


Although there's a toolbar button for quoting, quote BBCode is more often created by selecting the word "quote" under an exiting post.

https://i.imgur.com/XNfvMHA.png
Last edited June 18, 2022 8:40 am
Dec 19, 2021 4:16 pm
Notes
https://i.imgur.com/LlSWmMK.png
BBCode: [note="Adam"]Only Adam can read this.[/note]

Result:
Adam sent a note to Adam


Notes are used to send private messages between users. Comma separate the usernames of people who can see the note in quotes and then put the body of the message inside the tag.

In game posts, use the menu to select the usernames of who will see the note, then select 'Add note' - the BBCode will then be added and you can fill in the body of the note.
[ +- ] 📺 Video tutorial
Private https://gamersplane.com/images/gm_icon.png
https://i.imgur.com/75pcL28.png
BBCode: [private="Adam"]There appears to be something by the apple tree.[/private]

Result (If you're Adam): There appears to be something by the apple tree.
Result (If you're not Adam):

The private tag functions like the note tag, but there's no indication to the recipient that it's a private section and users not included don't see anything. This means that it has quite a different use as it doesn't tip off the users that anything special or secret is happening.

Private sections can be created for game posts using the menu in the same way as notes.
Dec 19, 2021 4:17 pm
Images

https://i.imgur.com/dvBzZTT.png
BBCode: [img]https://gamersplane.com/images/bodyComponents/logo.png[/img]

Result: https://gamersplane.com/images/bodyComponents/logo.png

If your image is already hosted on the internet then using the toolbar menu will prompt for the URL and add the necessary tags.
https://i.imgur.com/eszMFzA.png

Uploading images

https://i.imgur.com/Vjn53By.png

If your image is not already on the internet, perhaps you've saved it to your computer or device, then using the "Upload to Imgur..." option will upload your image and add the img tags for the BBCode.

You don't need an Imgur account for this to work. Simply select your image and the system will handle the rest.

If your image is on your clipboard then you can simply paste it into your post. The image will be automatically uploaded to Imgur and the tags added. Be aware that the format of the image on your clipboard depends on your device or computer. Try not to paste large images from your clipboard as this doesn't give you any control over the file format - it works well for small images though.
[ +- ] Tip:
YouTube

https://i.imgur.com/L9w8WHH.png

Click the "share" link on a YouTube video and put it in a youtube tag to embed videos in your post.

https://i.imgur.com/8P5cnyt.png

BBCode: [youtube]https://youtu.be/1AO-2lEXc4E[/youtube]

Result:
OOC:
Some people use videos for ambient music to play whilst reading the post.
One gotcha. If you want to start from a point in time, the YouTube link will have a "?t=" parameter at the end - you'll need to change that to a "?start=" parameter because YouTube uses a different parameter name for embedded videos.
Last edited January 28, 2022 4:45 pm
Dec 19, 2021 4:17 pm
Tables
BBCode: 
[table]
R1C1 | R1C2 | R1C3
R2C1 | R2C2 | R2C3
R3C1 | R3C2 | R3C3
[/table]

Result:
R1C1 R1C2 R1C3
R2C1 R2C2 R2C3
R3C1 R3C2 R3C3


Tables organise content into grids. Each line is a new row and columns are separated with a | character.
[ +- ] 📺 Video tutorial
Table formatting
Tables can be formatted by adding attributes to the opening tag.

This is an example of a table used for stats. It has a heading and the columns are right aligned.

BBCode: 
[table="stats"]
Heading 1 | Heading 2 | Heading 3
R1C1 | R1C2 | R1C3
R2C1 | R2C2 | R2C3
R3C1 | R3C2 | R3C3
[/table]

Result:
Heading 1 Heading 2 Heading 3
R1C1 R1C2 R1C3
R2C1 R2C2 R2C3
R3C1 R3C2 R3C3


Here are the table formatting options:
Opening tag Effect
[table="stats"]
The first row becomes the heading and the cell contents are right aligned.
[table="center"]
Centres the text horizontally in the cell. "center" and "centre" are both supported.
[table="ht"]
(heading top) - Makes the first row a heading.
[table="hl"]
(heading left). Makes the first column a heading.
[table="htl"]
(heading top and left). Makes the first column and row a heading.
[table="grid"]
Adds grid lines to a table.
[table="zebra"]
Adds shaded horizontal stripes to the table.
[table="compact"]
Prevents the table taking up the full width.
[table="center grid zebra"]
Multiple effects can be added by separating the options with spaces.

Rolls Tables

There's a special type of table for dice rolls. See the Character Sheets BBCode section for more information.
Last edited March 4, 2022 12:08 pm
Dec 19, 2021 4:17 pm
Map https://gamersplane.com/images/gm_icon.png
[map]
https://otfbm.io/26x14/@c60/b5:10x6
--Tokens
/f7-Alice
/h8-Bob
--Background image
?bg=https://i.imgur.com/jIpAjkT.jpg
[/map]

Result:


The map tag is a special img tag with the following changes to allow for simpler formatting:
* separate lines are joined together
* lines beginning with -- ignored
* clicking the image opens it in a new tab

The main purpose is to support OtFBM (On the Fly Battle Maps). OtFBM has many options and features, which are best described by the OtFBM documentation.
[ +- ] 📺 Video tutorial
[ +- ] 🎚 Adjusting colour
[ +- ] 🧩 Generating tokens
[ +- ] 📌 Generating tokens using the OtFBM gm sheet
Zoommap https://gamersplane.com/images/gm_icon.png
https://i.imgur.com/xSy5U2W.png
[zoommap=https://www.aidedd.org/atlas/images/waterdeep-3560-7256.jpg]
2053,4472 | The Yawning Portal | green
610, 2080 | House of Heroes | red
2342, 2888 | Hospice of St. Laupsenn
2358, 5468 | The Skewered Dragon | green
1781, 4238 | Castle Waterdeep | amber
2062, 4603 | The Metal House of Wonders | red
2624, 4771 | The Stone House
[/zoommap]

Result:


Zoommaps allow users to pan and zoom around large maps, and for GMs to place pins at positions.
Each pin is defined on a new line within the zoommap tag.
The x, y coordinates are the pixel coordinates on the image.
The pins contents come next. BBCode is supported in the content (e.g. for links).
The last part is the optional pin colour and can be red, green or amber. If a colour isn't specified then the default is blue.
Last edited May 31, 2022 6:12 am
Dec 19, 2021 4:18 pm
NPC https://gamersplane.com/images/gm_icon.png

BBCode: [npc="Trev the Tap"]https://i.imgur.com/s6xRmWR.jpg[/npc] Lorem ipsum dolor sit...

Result:
https://i.imgur.com/tkbOPKI.png


If you post and put an npc tag in the post containing the title and avatar then it renders that post as if you'd created that character.
[ +- ] 📺 Video tutorial
If you also selected post as, or there are multiple NPCs then it renders the NPCs within the post.

https://i.imgur.com/P3czmMf.png

https://i.imgur.com/0Sa82S3.png

The tag works for players too so it might be useful for familiars, hirelings, or other guest posters.

With the npc tag, where do the npc avatars go? In the post or on the side (as the avatar)? It depends on how many npc tags are in the post and whether you've posted as a character - here's a table with the outcomes.

Post as Player Post as character
0 NPC tags User's avatar Character's avatar
1 NPC tag NPC's avatar. No NPC in the post. Character's avatar. NPC in the post.
2+ NPC tags User's avatar. NPCs in the post. Character's avatar. NPCs in the post.


NPC lists https://gamersplane.com/images/gm_icon.png

There's also an npcs tag for managing lists of NPCs. See the Character Sheets BBCode section for more information.
Last edited December 19, 2021 4:27 pm
Dec 19, 2021 4:18 pm
These BBCode tags are for use on character sheets rather than posts.

Columns
BBCode: 
[2column]
[col]
This is in column 1
[/col]
[col]
This is in column 2
[/col]
[/2column]

Result:
https://i.imgur.com/Wmfkk4v.png


Columns tags are used to organise the content of your character sheets into columns. 2column and 3column tags are available, with the col tags containing the content of each column.

Abilities

BBCode:
[abilities="Abilities"]
# Example heading 1
Example ability 1 description
Supports multiline and BBCode
# Example heading 2
Example ability 2 description
[/abilities]


Result:
https://i.imgur.com/Tlyk74K.png

Character sheet integration:
https://i.imgur.com/yPmnfGA.png


The abilities tag is used to organise your character's abilities, talents, spells, and any other lists of features. The quoted attribute is the name of the abilities section. Each heading starts with a # and the following text will then be rolled up into a dropdown.

Abilities are available from your integrated character sheet during a game. Selecting an ability will add the ability's text to your post inside a collapsible spoiler.
[ +- ] 📺 Video tutorial
Snippets https://gamersplane.com/images/gm_icon.png
BBCode:
[snippets="Maps"]
# Tavern
[map]
https://otfbm.io/26x14/@c60/b5:10x6
--Tokens
/f7-Alice
/h8-Bob
?bg=https://i.imgur.com/jIpAjkT.jpg
[/map]

# Fighting pit
[map]
https://otfbm.io/26x14/@dc60
/m7l-Ogre~gnstt
?bg=https://i.imgur.com/WgZSt8g.jpg
[/map]
[/snippets]

Result:
https://i.imgur.com/72BTmFa.png

Character sheet integration:
https://i.imgur.com/npLSr8C.png


Functionally, snippets work in a very similar way to abilities but when they are used they don't include the spoiler tag. Their main use is for GMs to prepare box text and other material for use in their game. The snippets can then be selected from a GM custom character sheet and the BBCode inserted into their post.

Roll tables

BBCode: 
[table="rolls"]
Weapon | To hit | Damage
Longsword (1h) | 1d20+5 | 1d8+3
Longsword (2h) | 1d20+5 | 1d10+3
[/table]

Result:
Weapon To hit Damage
Longsword (1h) 1d20+5 1d8+3
Longsword (2h) 1d20+5 1d10+3

Character sheet integration:
https://i.imgur.com/yTWdjsw.png


The rolls table is formatted like a ht table (table with a heading at the top), but the main use is that any dice rolls integrate with your character sheet and the dice roller.

Special rolls tables

[table="rolls d20"]


https://i.imgur.com/fZ8pL2r.png

A d20 rolls table will interpret any modifiers (e.g. +3) as 1d20+3 rolls.

[table="rolls d20 dnd5e"]


https://i.imgur.com/eem7C2D.png

A d20 rolls table with dnd5e will interpret any modifiers (e.g. +3) as 1d20+3 rolls AND will automatically add A and D for rolling at advantage or disadvantage.

[table="rolls pool"]

[table="rolls pool-add"]
[ +- ] 📺 Result
A pool rolls table appends the roll to the last basic roll in the rolls section (creating a new one if none exist or the last one is full). pool-add acts like pool, but uses + to separate the rolls.

NPC lists https://gamersplane.com/images/gm_icon.png

BBCode:
[npcs="Undead"]
Ghast | https://i.imgur.com/vvoamvX.jpg
Zombie | https://i.imgur.com/yJU4pFf.jpg
Ghoul | https://i.imgur.com/T4ek2Bk.jpg
[/npcs]

Result:
https://i.imgur.com/hObSc1O.png

Character sheet integration:
https://i.imgur.com/gL485QR.png


The quoted attribute of the npcs tag allows a GM to group their NPC.

Each line of the npcs tag corresponds to an npc. The format is the name of the npc, followed by a |, then the URL of the npc's avatar.

Snippet
BBCode: 
[snippet="Catchphrase"][b]"Hello, my name is Inigo Montoya. 
You killed my father. Prepare to die."[/b][/snippet]

Result:
[ +- ] Catchphrase

Character sheet integration:
https://i.imgur.com/tPDT9rv.png


A snippet appears like a spoiler on the character sheet, but it integrates with the game posts to allow a player or GM to select and add a snippet of BBCode. If you plan to have lots of these then the snippets tag (above) might be preferable.

Custom character sheet logo
BBCode:
[style]
{"logo":"https://s3.amazonaws.com/pmgr-stg/projects/3722/project-logo.png"}
[/style]


Result:
https://i.imgur.com/gWFP9td.png


This is used to provide the logo of a custom character sheet.
Last edited March 20, 2022 7:57 am
Dec 19, 2021 4:19 pm
Post polls https://gamersplane.com/images/gm_icon.png

BBCode: 
[poll="What do you use polls for?" show multi]
Gauging community opinions in the public forums.
As a GM in OOC threads, to find out if there's a consensus view from the players.
For fun and novelty in games.
[/poll]

Result:

What do you use polls for? Multi

Gauging community opinions in the public forums.
As a GM in OOC threads, to find out if there's a consensus view from the players.
For fun and novelty in games.


Flag Result
show Show the results to users before they vote
multi Allows multiple options to be chosen
public Show avatars instead of the GP logo for votes


The poll question is the quoted text, 'show' and 'multi' are options to control the poll's display. Each poll option is on a new line. For more information about using polls see the inline polls guide.

Flip tokens (Star Wars destiny tokens) https://gamersplane.com/images/gm_icon.png

BBCode: 
[fliptokens=9]

Result:
History
Antiproduct January 18, 2022 4:59 am
Antiproduct January 18, 2022 4:59 am
Antiproduct January 18, 2022 4:59 am
Antiproduct January 18, 2022 4:59 am
Adam January 18, 2022 5:14 am
Adam January 18, 2022 5:15 am
KoldikSteelskin January 18, 2022 12:13 pm
szemely January 18, 2022 8:48 pm
szemely January 18, 2022 8:48 pm
Stefron January 18, 2022 10:04 pm
Harrigan January 19, 2022 7:31 am
Harrigan January 19, 2022 7:31 am
Harrigan January 19, 2022 7:31 am
Harrigan January 19, 2022 7:31 am
Adam January 19, 2022 10:46 am
Northman January 20, 2022 9:53 am
Northman January 20, 2022 9:53 am
ZeroHero March 20, 2022 5:16 am
ZeroHero March 20, 2022 5:16 am
saevikas March 27, 2022 4:16 am
Dreamblade March 31, 2022 3:48 pm
Dreamblade March 31, 2022 3:48 pm
Dreamblade March 31, 2022 3:48 pm
Dreamblade March 31, 2022 3:48 pm
Dreamblade March 31, 2022 3:48 pm
runekyndig April 28, 2022 4:17 am
mightywok May 1, 2022 3:00 pm
mightywok May 1, 2022 3:00 pm
mightywok May 1, 2022 3:00 pm
Harrigan May 21, 2022 5:26 pm
Harrigan May 21, 2022 5:26 pm
Harrigan May 21, 2022 5:26 pm
Harrigan May 21, 2022 5:26 pm
WhtKnt May 24, 2022 7:27 pm
WhtKnt May 24, 2022 7:27 pm
WhtKnt May 24, 2022 7:27 pm
WhtKnt May 24, 2022 7:27 pm
WhtKnt May 24, 2022 7:27 pm
WhtKnt May 24, 2022 7:27 pm
WhtKnt May 24, 2022 7:27 pm
seifi May 28, 2022 10:35 pm
seifi May 28, 2022 10:35 pm
ianXian June 1, 2022 2:26 am
ianXian June 1, 2022 2:26 am
ianXian June 1, 2022 2:26 am
ianXian June 1, 2022 2:26 am
ianXian June 1, 2022 2:26 am
ianXian June 1, 2022 2:26 am
WhtKnt June 7, 2022 11:24 pm
huttyman June 9, 2022 3:20 pm
huttyman June 21, 2022 1:19 pm
Ellithar June 29, 2022 2:16 am
Ellithar June 29, 2022 2:16 am
Ellithar June 29, 2022 2:16 am
Ellithar June 29, 2022 2:16 am
Ellithar June 29, 2022 2:16 am
Ellithar June 29, 2022 2:16 am
Ellithar June 29, 2022 2:16 am
9littlebees July 1, 2022 7:40 am
9littlebees July 1, 2022 7:40 am
Sgt.Banter July 29, 2022 2:42 pm
Ellithar August 28, 2022 9:07 pm
Ellithar August 28, 2022 9:08 pm
Pedrop September 8, 2022 12:02 am
Pedrop September 8, 2022 12:02 am
Pedrop September 8, 2022 12:02 am
Pedrop September 8, 2022 12:02 am
CaveJohnson September 9, 2022 1:34 am
Ranimara October 15, 2022 1:42 am
Pedrop October 18, 2022 9:41 pm
Pedrop October 18, 2022 9:41 pm
Yunera January 12, 2023 9:31 am
Faenre January 26, 2023 11:56 pm
Faenre January 26, 2023 11:56 pm
Red_Dragon March 5, 2023 5:02 pm
Red_Dragon March 5, 2023 5:02 pm
Red_Dragon March 5, 2023 5:02 pm
Red_Dragon March 5, 2023 5:02 pm
MasMas March 10, 2023 9:11 pm
MasMas March 10, 2023 9:11 pm
MasMas March 10, 2023 9:11 pm
MasMas March 10, 2023 9:12 pm
MasMas March 10, 2023 9:12 pm
MasMas March 10, 2023 9:12 pm
MasMas March 10, 2023 9:12 pm
MasMas March 10, 2023 9:12 pm
MasMas March 10, 2023 9:12 pm
MasMas March 10, 2023 9:12 pm
MasMas March 10, 2023 9:12 pm
MasMas March 10, 2023 9:12 pm
MasMas March 10, 2023 9:12 pm
MasMas March 11, 2023 9:11 am
remedez April 24, 2023 6:04 pm
remedez April 24, 2023 6:04 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
remedez April 24, 2023 6:05 pm
Chalrytharendir April 24, 2023 7:51 pm
Carcabob July 29, 2023 3:00 am
saccharine_rabbit September 5, 2023 3:50 pm
saccharine_rabbit September 5, 2023 3:50 pm
Ncoturne9 November 10, 2023 8:35 am
Ncoturne9 November 10, 2023 8:36 am
kalajel November 15, 2023 3:16 am
KoldikSteelskin December 14, 2023 5:47 pm
KoldikSteelskin December 14, 2023 5:47 pm
KoldikSteelskin December 14, 2023 5:48 pm


The "9" in this example is the number of tokens shown. They are initially all shown on their light side. Flip tokens can be flipped from the light side to the dark side. They track who turned them, and when. Only one fliptokens tag is allowed per post.

They are designed to track destiny points in Star Wars games.
Last edited March 27, 2022 8:10 am
Dec 19, 2021 4:19 pm
Size

BBCode: [size="150"]150% size[/size]

Result: 150% size

Email addresses

BBCode: [email]test@example.com[/email]

Result: test@example.com

@mentions

It's not BBCode but if you put an @ in front of someone's username then they will be notified with a link to your post on their homepage.

https://i.imgur.com/3OA8Q4z.png

Code

BBCode: [code]This is how to use [b]bold[/b].
[/code]

Result:
This is how to use [b]bold[/b].


The code tag is used when you don't want the BBCode to be parsed, for example when showing someone some BBCode.

CSS
If you're familiar with a technology called CSS then the color tag offers an opportunity to use those skills.


The colour tag: 
[color="red"]Hello world[/color]
becomes the HTML
<span style="colour:red">Hello world</span>


It's really just inserting the bbcode attribute into the span's style. This means we can add other CSS style attributes.

[color=";font-family:aniron;"]Hello world[/color]

becomes the HTML

<span style="colour:;font-family:aniron;">Hello world</span>

which renders as

Hello world

A full tutorial on using CSS styles is beyond the scope of this guide, but if you see a member use some interesting formatting in a post then you might want to click 'Quote' to see their BBCode and discover their tricks.
Mar 4, 2022 12:05 pm
Editable field

Name: [_=Hawk the Slayer]

Name: Hawk the Slayer

Shortcut key: Ctrl+M

Use this to mark parts of your custom character sheets as editable.

Checkboxes

Rage: [_=2/3]

Rage:

The maximum number of checkboxes is 20.

Variables and calculations

Strength bonus: [_str=+2]
Damage: 1d6[_$=+str]

Strength bonus: +2
Damage: 1d6+2
Note that calculations don't work in posts, but are updated live on character sheets.


Text in front of a form field names a variable.
A calculation has a $ in from of the = sign. A field can be a calculation and a new variable too by putting the variable name before the $=.
Prefixing a calculation with + forces it to use the sign (so 5 renders as +5).

There are some built-in functions to help with your calculations.

ceil ceiling (round up)
floor floor (round down)
max returns the maximum of two values
min returns the minimum of two values
d20bonus returns the d20 game system bonus of a value (shortcut for Math.floor((val-10)/2);)
lookupBonus lookupBonus(val, 1,3,-3, 4,5,-2, 6,8,-1, 9,12,0, 13,15,1, 16,17,2, 18,18,3) This takes val and looks for it in the triples. If val is inclusively between 1 and 3 return -3. If between 4 and 5 return -2. etc.
dwBonus(12) This is a shortcut for dungeon world players so they don't need that whole mess of lookupBonus code.


Example:

Int: [_int=18]
Int bonus: [_int_bonus$=+d20bonus(int)]
Proficiency: [_prof=2]
Spell DC: [_$=8+int_bonus+prof]


Int: 18
Int bonus: +4
Proficiency: 2
Spell DC: 14


Using these different techniques, it's possible to make quite advanced character sheets for your players that are usable directly within your game.

https://i.imgur.com/bmV2SQS.png

Distributing custom character sheets

[charsheet=Honey Heist]
I am [_=name], a [_=description] [_=species], the [_=role]

[table="compact ht"]
Stats | Points
Bear | [_=3/6]
Criminal | [_=3/6]
[/table]

[abilities=Notes]
[/abilities]
[/charsheet]


[ +- ] Honey Heist


Wrap custom character sheet BBCode in a charsheet tag to share it. A customchar section contains a "Create character" button at the top right. This means a GM can include a custom character sheet, or even a pregen, to allow players to quickly start playing.
Last edited March 12, 2022 7:18 pm

You do not have permission to post in this thread.