Mar 28, 2024, 04:27 PM

News:

Support us on Patreon and get exclusive perks!


[Guide] BBCode

Started by AtomicPulse, Sep 15, 2018, 03:31 PM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

AtomicPulse

Sep 15, 2018, 03:31 PM Last Edit: Dec 12, 2020, 05:05 PM by blalp
BBCode

Thanks to @wealthywalnut who contributed to creating this.

What Is BBCode?
BBCode stands for Bulletin Board Code and is a lightweight markup language used to format posts. The available tags are usually surrounded with square brackets, such as [ b ].



Basics
Closing tags often use the same as the opening, just with a / at the beginning, ie: [ b ] [ /b ]
NOTE: The brackets don't need spaces, its just to show the code.

NOTE: When using bbcode the order doesn't matter however the order must match in reverse order.
For example if you use bold then italics then you must close italics first followed by bold.
[ b ][ i ]example[ /i ][ /b ]

To make something bold, you type:
[ b ]example[ /b ]
Bold Text looks like this

To make something underlined, you type:
[ u ]example[ /u ]
Underlined text looks like this

To make something italic, you type:
[ i ]example[ /i ]
Italic text looks like this

To give something a strike-through, type:
[ s ]example[ /s ]
Text with a strike-through looks like this

Combining them also works,
EG: [ b ][ i ][ u ]example[ b ][ i ][ u ]
Combining Italic, Bold and Underlined looks like this



Adding Colors

Colours can also be added to your text, this can be done pretty easily:
[ color=blue ]text[ /color ] is an example.

This will turn out like the following,
text

The following colours can be used:
  • Black
  • Red - Generally used for Admins or Elders
  • Yellow
  • Pink - Generally used for Engineers
  • Green - Generally used for JMods
  • Orange
  • Purple - Generally used for Contributers
  • Blue
  • Biege
  • Brown
  • Teal
  • Navy - Generally used for Moderators
  • Maroon - Generally used for Manager
  • LimeGreen - Generally used for EventHosts



Sizes, Fonts and Alignment

Sizes

Sizes can be added to your text, this can be used to create smaller messages, or larger ones for titles.
The default size is 2 and the maximum is 7

To change a size, type:
[ size = 4 ]this is changing sizes[ /size ]

The sizes look like this:
This is Size 1 (Smallest)
This is Size 2 (Default)
This is Size 3
This is Size 4
This is Size 5
This is Size 6
This is Size 7 (largest)

Fonts

As well as size, you can add fonts to your text. This can simply be done like this:

[ font=Arial Black ]test[ /font ]
The most similar font to default is Arial, although it's not exact.

The list of available fonts are:
  • Arial ---------- > This is Arial
  • Arial Black ---------- > This is Arial Black
  • Comis Sans MS ---------- > This is Comic Sans MS
  • Courier New ---------- > This is Courier New
  • Georgia ----------- > This is Georgia
  • Impact ---------- > This is Impact
  • Sans-serif ---------- > This is Sans-Serif
  • Serif ---------- > This is Serif
  • Times New Roman ---------- > Times New Roman
  • Trebuchet MS ----------- > This is Trebuchet MS
  • Verdana ---------- > This is Verdana

    Alignment

    Text Alignment can also be done using BBCode.

    To make text go to the right, type
    [ right ]Test[ /right ]

    To make text go to the left, type
    [ left ]Test[ /left ]

    To make something go to the center, type
    [ center ]Test[ /center ]

    Alignment looks like this:
    This is text on the left
    This is text on the right
    This is text in the center

    Images and Embedding Links

    Inserting Images

    Adding images can be done by typing:
    [ img ]Link Here[ /img ]

    An example of an image added is shown here:


    Embedding Links

    You can embed a link into a message by typing,

    [ url=link ] Displayed Word Here [ /url ]

    An example for using these would be in the Staff List, the link to the profile would be the link and the displayed word is the staffs name.
    Using the link as a link to the rules list and the displayed name as `here` is also a common use in ban appeals.

    Extra Things

    There are some extra thing you can use in BBCode.

    Code

    [ code ] text [ /code ]
    The code tags create selectable code, this is useful for formats or a way someone can easily copy something.

    An example of code looks like this:
    This is Code!
    It can go on many lines!
    Tags also can be seen here, ie [b]

    Lists
    Creating lists, with bullet points, can be done like this:
    [ list ]
    [ li ]hello[ /li ]
    [ li ]hello[ /li ]
    [ /list ]
    This will look like this:
    • hello
    • hello

    Bullet Points can also be done by typing,
    [ * ] hey
    Which reads out as,
  • hey

Creating lists with numbers can be done like this:
[ list type=decimal ]
[ li ]heyo[ /li ]
[ li ]heyo[ /li ]
[ /list ]
The outcome looks like this:
  • heyo
  • heyo

Spoiler and HR

Inserting a clickable spoiler can be done by typing,
[ spoiler ] text [ /spoiler ]

The outcome is:
Spoiler: show
 This is a spoiler!


Horizontal lines to seperate sections can simply be made by doing [ hr ]
One will be shown to separate this section and the next.



TABLES GUIDE

Tables are a great way to format a post and clean up the layout but they can be tricky to understand at first.

Opening and closing a bracket set before writing anything is a great way to minimize problems.
Again, for this example, spaces are used so the formatting can be viewed outside of the text editor.

NOTE: The formatting as seen above can also be used in a table to further add to the looks of the post.

[ table ] declares that everything until the [ /table ] is to be inside the tables.
[ tr ] and [ /tr ] declare that the text is part of a row. This goes outside a set of [ td ] text
[ td ] and [ /td ] sort the information into appropriate columns.
You can make the table with as many rows and columns as can fit. Just be sure that the brackets match from beginning to end.
When combined they look like this:

[ center ][ table ] [tr ][ td ] [b ]First Column[ /b ][ /td ][ td ] [b ]Second Column[ /b ][ /td ][ td ][ b ]Third Column[ /b ][ /td ][ /tr ]
[ tr ][ td ]Information 1[ /td ][ td ]Information 2[ /td ][ td ]Information 3[ /td ][ /tr ]
[ tr ][ td ]Other info[ /td ][ td ]Other info 2[ /td ][ td ]Other Info 3[ /td ][ /tr ][ /table ][ /center ]

First ColumnSecond ColumnThird Column
Information 1Information 2Information 3
Other infoOther info 2Other Info 3
One moreOne more 2One more 3


NOTE: Using [ center ][ /center ] around the outside of the table, as seen above, can make the information within the table be centered within its respective column.

If you think anything else should be added or anything is wrong please contact myself on discord or forums.
BTeam Owner | Survival Admin | Creative JMod

Ex - Factions FMod | Prison Guard