New BBCodes! (including Spoiler Tags)

Information · Postby **Information** » Mon Dec 23, 2013 3:15 pm

New BBCodes! Some of them are practical, some are novelty, and still others skirt the boundary between both worlds. Here's a quick rundown of the new codes on the block:

Code: Select all

[highlight]text[/highlight]

If you want to highlight text as particularly important, we now have a highlight feature. Please use sparingly.

Code: Select all

[spoiler]text[/spoiler]
[spoiler=label]text[/spoiler]

We now have spoiler tags! They don't use JavaScript, so they should be fairly stable across a multitude of platforms.

e.g. At the end of Return of the Jedi,

Spoiler:

!

Code: Select all

[strike]text[/strike]

You can now ~~strikethrough~~ text using the new strike tags...

Code: Select all

[sup]text[/sup]

... and use superscript for those rare situations where you'd like to use superscript...

a² + b² = c²

Code: Select all

[sub]text[/sub]

... and subscript for those even rarer equations where you'd like to use subscript.

v = v₀ + at

Code: Select all

[text]text[/text]

Finally, let's say you want to type something and you'd prefer your characters not only to have fixed width, but the number of spaces preserved as well.

Well, the  text   tag    now     makes      that       a        possibility.

Let's say you want to align content, like text or images:

Code: Select all

[center]text[/center]

Well, now you can with the center tag...

Code: Select all

[right]text[/right]

... and the right tag!

Code: Select all

[mouseover="message"]text[/mouseover]

Have a message that you want revealed when someone hovers over your text or images?

No need to fear, the mouseover tag is here!

Hover your cursor over this text for a demonstration.

Code: Select all

[pic=http://image_url]WIDTHxHEIGHT[/pic]
[pic=http://image_url]WIDTHx [/pic]
[pic=http://image_url] xHEIGHT[/pic]

Finally, here's one that was suggested by Fatzilla.

Let's say you'd like to resize your picture for display, but don't really want to edit the file. Instead of using the img tag, now you can post a manually-resized image on the spot with the pic tag!

Be careful with this one; it has a mildly tricky interface.

Code: Select all

[Hr][/Hr]

Let's say you want to divide some of your content with a horizontal rule.

Well now you can with the hr tag!

Code: Select all

[border=WIDTH,TYPE,COLOUR]text[/border]

How about a border for your text or images?

The border tag is the solution you need!

Here's an explanation of the syntax:

WIDTH

(1, 2, 3, 4, 5, 6, 7, etc.)

TYPE

(dotted, dashed, solid, double, groove, ridge, inset, or outset)

COLOUR

#0000FF

blue

Code: Select all

[typeface="style"]text[/typeface]

You can also select different font families using the typeface tag...

... because Jokerman is professional and should be used whenever possible...

... and because Vivaldi, despite its unreadability, is really pretty!

Please Note: Since font families are client-side, support may vary from system to system. My suggestion would be to preview your selection prior to submittal.

Per Jahgee's suggestion, we now have a YouTube tag!

Just place the link to a video in between the YouTube tags, like so...

Code: Select all

[YouTube]http://www.youtube.com/watch?v=xczDd2_X0DI[/YouTube]

... and voilà:

Now, there has been some very legitimate concern about this idea; so, if the new feature gets out of hand, maybe we'll consider dismantling it.

So it turns out there's this archaic HTML tag called the MARQUEE tag...

... muahahaha... :huge:

... and now it's a custom BBCode! If you don't select a numeric value after the equal sign, it defaults to a 100ms delay:

Code: Select all

[Marquee]This is the default speed![/Marquee]

This is the default speed!

If you select a lower value, it's faster!

Code: Select all

[Marquee=60]I'm on a sugar high![/Marquee]

I'm on a sugar high!

If you select a higher value, it's slower!

Code: Select all

[Marquee=140]Don't rush me, sonny![/Marquee]