Forum Formatting Guide

Welcome to the Funcom Forums! These forums are based on Discourse, and this forum primarily uses a language called “Markdown” instead of the traditional BBCode some may be used to.

Thankfully, Discourse also understands BBCode, so if you really like your brackets, you’ll still be able to style your posts as you’d like. Many options you’d have with HTML tags also work with Discourse.

For a rundown on how to style your posts to your heart’s content, please refer to this handy guide below:


To format, you need “tags”

So that the forum knows, how to format something, you have to tell it the forum, this is usually done with so-called “tags”.
What does such a “tag” look like?

Well in Markdown is it different, but in HTML and BBcode the so-called “tags” have to be always surrounded (encrypted).
In HTML you do this with the help of the keyboard signs <> and </>
in BBcode with [ ] and [/]

Example for “bold” text (bold text):
HTML: <b>sample text</b>sampletext
BBcode: [b]sample text [/b]sampletext
Markdown: **sample text**sampletext

It should be noted, that the respective tags should always be written “enclosing”.

The <>-tag is opened before you write the words or the sentence and then directly closed with </>
as an example for a bold (<b>) and at the same time italic (<i>) text:
It does not matter in what order this happes (so first <b> and then <i>, or first <i> and then <b> does not matter)

First we print the text in bold:

<b>sample text</b>sample text

Around there comes the italic tag

<i><b>sample text</b></i>sample text

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

<b><i>sample text</i></b> → correct

<b><i>sample text</b></i>→ incorrect

So far so good, the rest should not be a problem anymore!

Let’s start

Headings

There are different kinds of headings

In HTML they are written by using <h1>, <h2>, <h3>, etc.
in Markdown you have to put some # at the beginning of the sentence.

<h1>example heading</h1>

Example heading

<h2>Example heading</h2>

Example heading

<h3>Example heading</h3>

Example heading

# Example heading

Example heading

## Example heading

Example heading

### Example heading

Example heading

alternatively by using Markdown

Example heading
===

Example heading

text formatting

Fracture- or handwriting

As you can see, you can also write here in fracture or in handwriting.
But this is a lot of work … the single letters are put together from unicode (at the end of this tutorial there will be an overview to Unicode).
Who (for whatever reason) wants to write a larger text in said writing, can do this by prescribing the whole text and use then “search & replace” (it is still a lot work to do then).

<b>Example text</b>Example text
**Example text**Example text
__Example text__Example text
Short Cut
STRG+B = Example text

italic text

<i>Example text</i>Example text
*Example text*Example text
_Example text_Example text
Short Cut
STRG+i Example text

crossed out text

<s>Example text</s>Example text
~~Example text~~Example text

Abbreviated text (with mouseover w/o abbreviation)

<abbr title=“Hypertext Markup Language”>HTML</abbr> → <abbr title=“Hypertext Markup Language”>HTML

code text, resp pre-formatted text

<code>Example text</code>Example text
Example textExample text
Short Gut
STRG+SHIFT+C Example text

larger text

<big>Example text</big>Example text

smaller text

<small>Example text</small>Example text

superscript text

E = MC<sup>2</sup> → E = MC2

subscript text

H<sub>2</sub>O → H2O

inserted text

Eg to emphasize something after an edit, what you have changed

<ins>Example text</ins>Example text

deleted text

Eg to emphasize after an edit, what had been changed

<del>Example text</del>Example text

Lists

There are unordered and ordered lists in HTML – the ones (<ul>) are marked with a symbol before it, the other (<ol>) with a number.

The lists can be arranged under structured (Lists in Lists), here an example of an unordered list with under structure

<ul>
<li>Example text 1
<ul>
<li>Under point 1</li>
<li>Under point 2</li>
</ul>

  • Example text 1
    • Under point 1
    • Under point 2

    or in Markdown – simply put a blank in front of he next point

    Example text 1
    * Under point 1
    * Under point 2
    

    Example text 1

    • Under point 1
    • Under point 2

    unordered list

    <ul>

    <li>Example text 1</li>

    <li>Example text 2</li>

    <li>Example text 3</li>

    </ul>

    • Example text 1
    • Example text 2
    • Example text 3

    or

    * Example text 1

    * Example text 2

    * Example text 3

    turns out

    • Example text 1

    • Example text 2

    • Example text 3

    ordered list

    <ol>
    <li>Example text 1</li>
    <li>Example text 2</li>
    <li>Example text 3</li>
    </ol>

    1. Example text 1
    2. Example text 2
    3. Example text 3

    or in Markdown:
    (here it does not matter which number is in front, the text will be equal which numbered)

    1. Example text 1
    1. Example text 2
    1. Example text 3

    turns out

    1. Example text 1
    2. Example text 2
    3. Example text 3

    In HTML you can also specify, from which point you like a numbering:

    <ol start=1000>

    <ol start=1000>
    <li>Example text 1</li>
    <li>Example text 2</li>
    <li>Example text 3</li>
    </ol>

    1. Example text 1
    2. Example text 2
    3. Example text 3
Tables

Tables are a little bit more complicated/ cumbersome, you should already know several tags
<table> → so the forum knows here starts a table
<th> → is practically the heading of the lines
<tr> → indicates that here a line starts
<td> → indicates, that here a cell starts
The more <th> or <td> are in a <tr>, the more columns has the table.

Example of a table with a heading row, 2 rows and 3 Columns

<table>
<tr>
<th> Column 1</th> <th>Column 2</th> <th> Column 3</th>
</tr>
<tr>
<td>Cell 1</td>``<td>Cell 2</td>``<td>Cell 3</td>
</tr>
<tr>
<td>Cell 4</td>``<td>Cell 5</td>``<td>Cell 6</td>
</tr>
</table>

Column 1 Column 2 Column 3
Cell 1 Cell 2 Cell 3
Cell 4 Cell 5 Cell 6

Markdown:

Here it does not matter how many – you insert, or if there are blanks before or after then| .

That | is by the way the sign, which one can inserted by clicking the ALT GR -key and the < -key on the keyboard (german keyboard at the bottom left ).

|**Column 1**|**Column 2**|**Column 3**|
| --- | --- | --- |
|Cell 1|Cell 2|Cell 3|
|Cell 4|Cell 5|Cell 6|

Column 1 Column 2 Column 3
Cell 1 Cell 2 Cell 3
Cell 4 Cell 5 Cell 6

Here you can also change the text alignment, this workes with
a colon in the 2nd row

|Left-aligned|Centered text|Right-aligned|

|:---|:---:|---:|

|Cell 1|Cell 2|Cell 3|

Left-aligned Centered text Right-aligned
Cell 1 Cell 2 Cell 3
miscellaneous

miscellaneous

Make text look like a keyboard key

<kbd>STRG</kbd>STRG

^1234567890ß´
TabQWERTZUIOPÜ+
CAPSASDFGHJKLÖÄ#
SHIFT<YXCVBNM,.-SHIFT
STRGALT
Space ___ALT GRFNSTRG

Horizontal dividing line
<hr>
or with Markdown insert simply a in an empty line


Boxes
To insert a box, you have to put a > in front of the line
>Examplebox

Examplebox

It is possible to do this several times

Examplebox (with great effect :joy:)

Wordwrap

<br>

Pop-up boxes (to display spoiler or similar)

in HTML you use two tags
<details>to indicate, here starts such a box
<summary>to indicate, how the box should be named

pop-up boxText

by using Markdown you need just a single tag

[details="pop-up box"]

text

[/details]

pop-up box

text

Polls

Polls are also tied to the trust level a member has, that means not everyone can create one and I am not able to show you an example aufzeigen.

[poll type="regular"]

* Option 1

* Option 2

* Option 3

[/poll]

[poll type="regular"]
  • Option 1

  • Option 2

  • Option 3

[/ [poll ]
links and images

To post links and images you have to reach a specific trust level,unfortunately you arent’t able to post from beginning.
You can reach this level automatically, participating on the forums and positive behaviour play a good part of it.

Everyone who reached not the matching trust level, is able to post links.
You have to post the links just in a CodeBox / preformatted text(see above under text formatting):

https://forums.funcom.com/
https://forums.funcom.com/

Images
<img> is our Image-Tag in HTML
however, this is written together with several attributes, which one should also know

src=""→ this attribute indicates, from where the forum should get the image

alt="" → this attribute indicates, what should be there as text if the image, which should be uploaded, does not exist or is not available

height="" → this attribute indicates, in which height the images should be displayed

width="" → this attribute indicates which width the image should have

Imgur: The magic of the Internet here is a Conan Exils Logo, which I uploaded on imgur.
The official link from the offical webside, would be a little to long, to show you some examples……you would quickly lose the overview.
It can also be every other images, it has simply be available via link.

<img src=“https://imgur.cm/a/rCQlV9y”> → here would the image be displayed, in the present size,… if the image would not exist, nothing would stand there

<img src=“https://imgur.com/a/rCQlV9y” alt=“logo”> → here would be the images displayed, in the present size,… if the image would not exist, there would be the text “logo” be displayed

“logo”

<img src=“https://imgur.com/a/rCQlV9y” alt=“logo” height=“100” width=“100”> → here would be the image displayed, in the size 100x100px,… if the images would not exist, the text “logo” would be displayed

“logo”

or by using Markdown

[Conan Exiels logo](https://imgur.com/a/rCQlV9y)
Conan Exiels logo
[Conan Exiels logo](https://imgur.com/a/rCQlV9y)
Conan Exiels logo
what stands in the square bracket does not matter, this is practically the “alt”-tag by HTML

Links

<a> is our linktag in HTML, this tag is given an attribute (href=""), so that it works.
Between <a> and </a> you have to write a text, which will appear there in a clickable form.

<a href=“https://forums.funcom.com/”> Funcom Forum → Funcom Forum (this word would work as a clickable link and https://forums.funcom.com/ would pop up, when you click on it)

or with Markdown
[Funcom Forum](https://forums.funcom.com/)
Funcom Forum

Links with images

You can create of course a picture, in that way, when you click on it, a website will pop up.
Just replace the text that would normally be there with a hyperlink (<a>), with the image-tag (<img>).

<a href=“https://forums.funcom.com/”><img src=“https://imgur.com/a/rCQlV9y” alt=“logo”></a>
“logo”

Now would there appear the Conan Exils Logo and when you click on the picture/logo you end up to be on: https://forums.funcom.com/

A small list of a few symbols / special characters:

ALT-Codes

What are ALT-codes?
That is a real simpel question: These are codes, that you insert with the help of the ALT-key, and then you can insert symbols in the text.
E.g.: You press down the ALT-key, then tap on the number pad e.g. 3, release the ALT- key and you get a heart → :heart: → Funcom turns some the the codes automatically into a emote → :heart:

Nummer Symbol
1 :relaxed: :slight_smile:
2 :slight_smile: :slight_smile:
3 :heart: :heart:
4 :diamonds: :diamonds:
5 :clubs: :clubs:
6 :spades: :spades:
11
12
13
14
15
16
17
30
31
23
24
25
26
27
29 :left_right_arrow:
176
177
178
Unicode

Also Unicode works, simply copy&paste the symbols with e.g.the following link:

https://en.wikipedia.org/wiki/Unicode
:monkey_face: :crown:⌘❖ ✲ ⎈ ^ ⌃ ❖ ⎇ ⌥ ◆ ◇ ✦ ✧ ⇧ ⇪ 🄰 :a: ⇪ ⇫ ⇬ ⇮ ⇯ :capital_abcd: :abcd::1234: :abc: :leftwards_arrow_with_hook: ↵ ⏎ ⌤ ⎆ ▤ ☰ 𝌆 ⎄ ↹ ⇄ ⇤ ⇥ ↤ ↦ ⎋ ⌫ ⟵ ⌦ ⎀ ⎚ ⌧ :arrow_upper_left: :arrow_lower_right: ⇤ ⇥ ⤒ ⤓ ⇱ ⇲ ⇞ ⇟ △ ▽ ▲ ▼ ⎗ ⎘ ↑ ↓ ← → :arrow_backward: :arrow_forward: ▲ ▼ ◁ ▷ △ ▽ ⇦ ⇨ ⇧ ⇩ :arrow_left: :arrow_right: :arrow_up: :arrow_down: ⎉ ⎊ ⎙ ⍰ :question: :grey_question: :information_source: 🛈 ☾ ⏏ :email: :house: :house_with_garden::scissors: ✄ ⎌ ↶ ↷ ⟲ ⟳ ↺ ↻ :mag: :mag_right: :low_brightness: :high_brightness: :mute: :speaker: :sound: :loud_sound: 🕨 🕩 🕪 :black_medium_square: :play_or_pause_button: :previous_track_button: :next_track_button: :rewind: :fast_forward: :arrow_double_up: :arrow_double_down::world_map:🕱:dark_sunglasses: :fire::underage:
𝄞 ♩ ♪ ♫ ♬ ♭ ♯ ♮
🗸🗹🗴🗵🗳🗪🗣🗚🗛🗑🖰🕏

Fracturewriter

𝔄 𝔅 ℭ 𝔇 𝔈 𝔉 𝔊 ℌ ℑ 𝔍 𝔎 𝔏 𝔐 𝔑 𝔒 𝔓 𝔔 ℜ 𝔖 𝔗 𝔘 𝔙 𝔚 𝔛 𝔜 ℨ
𝔞 𝔟 𝔠 𝔡 𝔢 𝔣 𝔤 𝔥 𝔦 𝔧 𝔨 𝔩 𝔪 𝔫 𝔬 𝔭 𝔮 𝔯 𝔰 𝔱 𝔲 𝔳 𝔴 𝔵 𝔶 𝔷
𝕬 𝕭 𝕮 𝕯 𝕰 𝕱 𝕲 𝕳 𝕴 𝕵 𝕶 𝕷 𝕸 𝕹 𝕺 𝕻 𝕼 𝕽 𝕾 𝕿 𝖀 𝖁 𝖂 𝖃 𝖄 𝖅
𝖆 𝖇 𝖈 𝖉 𝖊 𝖋 𝖌 𝖍 𝖎 𝖏 𝖐 𝖑 𝖒 𝖓 𝖔 𝖕 𝖖 𝖗 𝖘 𝖙 𝖚 𝖛 𝖜 𝖞 𝖟

Script or handwriting

𝒜 ℬ 𝒞 𝒟 ℰ ℱ 𝒢 ℋ ℐ 𝒥 𝒦 ℒ ℳ 𝒩 𝒪 𝒫 𝒬 ℛ 𝒮 𝒯 𝒰 𝒱 𝒲 𝒳 𝒴 𝒵
𝒶 𝒷 𝒸 𝒹 ℯ 𝒻 ℊ 𝒽 𝒾 𝒿 𝓀 𝓁 𝓂 𝓃 ℴ 𝓅 𝓆 𝓇 𝓈 𝓉 𝓊 𝓋 𝓌 𝓍 𝓎 𝓏

Some of the Unicode symbols are used on the forum as emoji.

HTML-special characters
Code Zeichen
&nbsp; (erzwungenes Leerzeichen)
&larr;
&bdquo;
&ldquo;
&laquo; «
&raquo; »
&uarr;
&rarr;
&darr;
&harr; :left_right_arrow:
&crarr;
&lArr;
&uArr;
&rArr;
&dArr;
&hArr;
&copy; ©
&reg; ®
&plusmn; ±
&ne;
&asymp;
&cong;
&le;
&ge;
&micro; µ
&para;
&laquo; «
&raquo; »
&frac14; ¼
&frac12; ½
&frac34; ¾
&times; ×
&divide; ÷
&infin;
&permil;
&Oshlash; Ø
&alpha; α
&beta; β
&Delta; Δ
&delta; δ
&Omega; Ω
&omega; ω

[top]

3 Likes