Text For(u)matting; or, How To Create Spoiler Tags

rejj

I never knew colour was possible. This is dangerous info!

fridgeboy

captain this is a real service to all! Thanks @captain. Getting ending U was a real pain, but it helps your fellow forum members. Too bad it deletes your account after posting.

captain

fridgeboy lol I’m trying so hard to resist buying Nier

shane

Here’s two good examples of how to format text

The formatter flarum uses https://s9etextformatter.readthedocs.io/Bundles/Forum/#bbcodes
Some more examples https://freeflarum.com/docs/how-to/extensions/bbcode/

SuperEffective

you could also format lists in a table like this:

list 1
list 2
list 3

just use this symbol “>” before what you are listing

Kez

If you put >! in front of some text you can create a “Details” button that lets you toggle all of its content, like so:

captain

Kez NNNNNICE!

saddleblasters

Something that I don’t see mentioned here that I had to figure out for myself just now is that if you want multiple paragraphs in the expandable details tab, you need to put a new >! in front of each double-line-break separated block of text. This will put all of the paragraphs in the same details tab, not in separate ones, which is what I was worried would happen.

beets

How to do tables

(link to docs)

Syntax:

|Header 1 (left aligned) | Header 2 (center aligned) | Header 3 (right aligned) | |:--- | :-------:| ------------:| | Cell 1 | Cell 2 | Cell3 | | cell 3 | cell 4 | cell 6 |

Example:

Header 1 (left aligned)	Header 2 (center aligned)	Header 3 (right aligned)
Cell 1	Cell 2	Cell3
cell 3	cell 4	cell 6

The second line defines how the column will be aligned or justified. The number of - doesn’t matter.

Gaagaagiins

beets

Also as I just learned.

How to Format Code

Syntax:
write code with this character: ` at the start and end fo your line

Example:
write code with this character: at the start and end of your line

or

Syntax:
Use [code] at the start and [/code] at the end of your line.
Example

I am writing code

bool IsUserCool(string _user)
{
     if (InsertCreditForums.Contains(_user))
     {
         return true;
     } 
     printf( "join the forums for a fun time");
     return false;
}

this one is good for doing code blocks and has fancy colours too.

rejj

beets
One can also use triple-backticks ``` to wrap code blocks

Also regarding tables, I found that the markdown to html conversion really wanted to squash columns together, so I had to add a dummy column with an XX in the last row, using forum formatting to make it the same colour as the background ([color="#1a1a1a"]XX[/color]). This was especially noticeable in cases where the headings were longer than any value in their column (such as in your example above)

eg:

| Long heading name | | Other heading | |:-- |:-- | --:| | value | | 3 | | thing | | 5 | | | [color="#1a1a1a"]XX[/color] | |

produces:

Long heading name		Other heading
value		3
thing		5
	XX

Use this easy markdown table generator to help you. It allows you to upload a csv or just paste data in from your clipboard

(tagging Gaagaagiins here also just to make sure)

beets

NEW SKILL: Image Resizing

Using an image from the ‘SHOW’ page:

This is it’s link https://i.insertcred.it/assets/signs/TsRFX39b.png,
and here is it embedded.

We can use the [img][/img] to resize it. Example:

[img width=100]https://i.insertcred.it/assets/signs/TsRFX39b.png[/img]

and
[img height=100]https://i.insertcred.it/assets/signs/TsRFX39b.png[/img]

If only height or width is used the image will resize while keeping the same aspect ratio.
If both height and width are used you can change the aspect ratio of the linked image. Example:

[img width=600 height=100]https://i.insertcred.it/assets/signs/TsRFX39b.png[/img]

This also allows hyper posters to be able to include images in their words like emojis.

connrrr

If you use all the abilities you were designed with, you should become hyper…

▼

Gaagaagiins

connrrr holy shit

captain

This is revolutionary

captain

captain I can’t figure out how it works :(

Do you need to resize an embedded image link? It looks like others are able to resize an image they upload (which creates a link to imgur).

When you upload an image it puts [] brackets around the upload link, but in the example above [img width=100]https://i.insertcred.it/assets/signs/TsRFX39b.png[/img] does not have any. I’ve tried deleting the brackets and get the same result as with the brackets, which is nothing shows up.

connrrr

Events have transpired ominously to imbue @Gaagaagiins with much power.

connrrr

Here’s an example:

[img width=750 height=50]https://c.tenor.com/9GsLEEsw4wMAAAAC/tron-bonne-mega-man-legends.gif[/img]

will get you

(and now we all know this works with animated gifs)

edit The same tags with a drag and drop imgur upload:

captain

connrrr When I click your imgur image it brings me to imgur, but when I click images uploaded by other people it doesn’t being me to imgur. I feel so dense for not understanding

antillese

How do I turn signatures off?

Gaagaagiins

antillese you can join the Insert Credit Forums No Signatures Club (unfortunately, we’re allowed to have one)