Some (not all) BB Codes.

In this section, players can learn how to construct their own post templates for their roleplays. Inside is a list of BBCode available on the site as well as how to use it. If anyone needs any help with developing a template, feel free to hop into chat or PM someone for assistance.

Moderator: Staff

Post Reply Request an XP Review Claim Wealth Thread
User avatar
Pegasus Pug!!!
City Moderator
City Moderator
Posts: 10462
Joined: Sun Sep 11, 2016 1:08 am
Race: Prophet
Renown: 666
Plot Notes
Office
Templates
Point Bank Thread
Wealth Tier: Tier 1

Featured

Contribution

Milestones

RP Medals

Staff

Miscellaneous

Events

Some (not all) BB Codes.

Below is a list of BB Codes we use on the site. This thread is stickied, but not locked - if there is a BB Code which we've missed, please add it, following the format below.


Highlighting Text

Code: Select all

[highlight=insert color name or #930000]This is your text.[/highlight]
What It Looks Like
This is your text.


Glowing Text

Code: Select all

[glow=insert color name or #930000]This is your text.[/glow]
What It Looks Like
This is your text.


Shadow Text

Code: Select all

[dropshadow=insert color name or #930000]This is your text.[/dropshadow]
What It Looks Like
This is your text.


Fading Text

Code: Select all

[fade]This is your text.[/fade]
What It Looks Like
This is your text.


Spoiler Title

Code: Select all

[sptitle=Click here because this is my really long title]This is text.[/sptitle]
What It Looks Like
Click here because this is my really long title
This is text.

The Use of Anchors
Anchors are used when linking to specific spots in a post. Keep in mind anchors are used for links within a post, not within a thread.

Code: Select all

[anchor=whatever name you want to call this][/anchor]
What It Looks Like
It doesn't look like anything because it's an anchor.
Go To Anchor Link

Code: Select all

[goto=whatever name you want to call this]This Is You Link's Title[/goto]
What It Looks Like
This Is Your Link's Title


Creating A Table With Tabs

Code: Select all

[tabmenu][tab=This is a Tab]This is the text.[/tab][tab=This is a Tab]This is the other text.[/tab][/tabmenu]
What It Looks Like

This is a Tab

This is the text.

This is a Tab

This is the other text.

Inserting URL

Code: Select all

[url=http://upload.wikimedia.org/wikipedia/commons/d/d3/Nelumno_nucifera_open_flower_-_botanic_garden_adelaide2.jpg]This Is You Link's Title[/url]
What It Looks Like
This Is You Link's Title

Wrapping Text Around An Image

Code: Select all

[float=left][img]http://www.crafttownhobbylandusa.com/prodimages/PunchBunch/small_heart_small.gif[/img][/float]
What It Looks Like
Image
"At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat."

Code: Select all

[float=right][img]http://www.crafttownhobbylandusa.com/prodimages/PunchBunch/small_heart_small.gif[/img][/float]
What It Looks Like
Image
"At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat."


Using CSS Styles Box
This is what players use as to create post templates.

Code: Select all

[style=max-width: 300px; border: 1px solid black; padding: 10px;]This is your text[/style]
What It Looks Like
This is your text
You may also use

Code: Select all

[style2=this is your CSS content;]This is your text[/style2]
and

Code: Select all

[style3=this is your CSS content;]This is your text[/style3]
to put a style box within a style box. Go ahead and test it out!


Using Google Fonts

Code: Select all

[googlefont=Google Font]This is your text[/googlefont]
What It Looks Like
This is your text!



Using Tables

Code: Select all

[table][tr][td]Put [/td][td] your [/td][td] information here[/td][/tr]
[tr][td]Like this because [/td][td] this is how [/td][td] they separate.[/td][/tr][/table]
What It Looks Like
Put your information here
Like this because this is how they separate.
Using Colored Tables

Code: Select all

[table background_color=[tr][td]put a color or #000000 (background color) border_color=put a color or #000000 (border color)] Put [/td][td] your [/td][td] information here[/td][/tr]
[tr][td]Like this because [/td][td] this is how [/td][td] they separate.[/td][/tr]
[/table]
What It Looks Like
Put your information here
Like this because this is how they separate.


Marquee Text

Code: Select all

 [marq=left] Just flying in!![/marq]
What it Looks Like
Just flying in!!
word count: 877
Image
~~Red in hoof and claw... ~~


Family visiting. Send help!
Top
User avatar
Pegasus Pug!!!
City Moderator
City Moderator
Posts: 10462
Joined: Sun Sep 11, 2016 1:08 am
Race: Prophet
Renown: 666
Plot Notes
Office
Templates
Point Bank Thread
Wealth Tier: Tier 1

Featured

Contribution

Milestones

RP Medals

Staff

Miscellaneous

Events

Part 2

Notes to appear over text
You write the text to appear on the board hereAnd the text to appear over it in a mouseover here

Code: Select all

[note=You write the text to appear on the board here]And the text to appear over it in a mouseover here[/note]
It could be great for theme music too. Hold it in place[youtube][/youtube]

Code: Select all

[note=It could be great for theme music too. Hold it in place by clicking the little pin][youtube]https://www.youtube.com/watch?v=5anLPw0Efmo[/youtube][/note]
Here are normal words, but look!
And here's the image I used in the Global 717 Endgame. Isn't it pretty?
13247
It's using image ID and so it's a bit smaller. Another option is:
Image
This gives us the images in the original size

Code: Select all

[note=Here are normal words, but look!]
And here's the image I used in the Global 717 Endgame. Isn't it pretty? 
[image]13247[/image]
It's using image ID and so it's a bit smaller. Another option is:
[img]https://dev.standingtrials.com/app.php/gallery/image/13247/medium[/img]
This gives us the images in the original size [/note]


Much the same thing, just done differently
only words here and no coding

Code: Select all

[ooc=notes to appear here] only words here and no coding [/ooc]


Line across the page:

Code: Select all

 [hr]


Different colour text
This is red
This is blue
This is the colour hex code #44aa11

Code: Select all

[color=red] This is red [/color]
[color=blue] This is blue [/color]
[color=#44aa11] This is the colour hex code #44aa11 [/color]


Of course, there's bold , italic, underline and strikethrough

Also, we have superscript, subscript and blurred (in red, for example)

Code: Select all

Of course, there's [b]bold [/b], [i]italic[/i], [u]underline[/u] and [s]strikethrough[/s]

Also, we have [sup]superscript[/sup], [sub]subscript[/sub] and [blur=red]blurred (in red, for example) [/blur]


Tables have a lot of functionality:
Table Title
Title1 Title2 Title3
Text11 Text21 Text31
Text12 Text22 Text32
Text13 Text23 Text33
Text14 Look AT ME!!!! Text34
Text15 Text25 Text35
Text16 Text26 Text36
Text17 Text27 Text37
Text18 Text28 Text38

Code: Select all

[size=130]Table Title[/size]
[table style=background-image: url('https://www.finetunedfinances.com/wp-content/uploads/2018/01/fun-on-a-holiday-768x576.jpg'); border_color=orange ]
	[thead]
		[tr]
			[th style=background-color: #c234e1;]Title1[/th]
			[th]Title2[/th]
			[th]Title3[/th]
		[/tr]
	[/thead]
	[tbody]
		[tr]
			[td width=30px style=background-color: red;]Text11[/td]
			[td]Text21[/td]
			[td]Text31[/td]
		[/tr]
		[tr]
			[td]Text12[/td]
   			[td style=background-color: red;]Text22[/td]
			[td]Text32[/td]
		[/tr]
		[tr]
 			[td]Text13[/td]
 			[td]Text23[/td]
 			[td style=background-color: red;]Text33[/td]
		[/tr]
		[tr]
			[td style="border: 1px solid red;"]Text14[/td]
			[td style=height: 22px; text-align: center; padding-top: 6px; background-color: #e9e9e9; text-transform: uppercase; font-size: 16px; color: #000000; letter-spacing: 2px; margin-right: 5px;]Look AT ME!!!! [/td]
			[td]Text34[/td]
		[/tr]
		[tr]
			[td]Text15[/td]
			[td style="border: 1px solid red;"]Text25[/td]
			[td]Text35[/td]
		[/tr]
		[tr]
			[td]Text16[/td]
			[td]Text26[/td]
			[td style="border: 1px solid red;"]Text36[/td]
		[/tr]
		[tr]
			[td]Text17[/td]
			[td]Text27[/td]
			[td]Text37[/td]
		[/tr]
		[tr style="background-color: red;"]
			[td]Text18[/td]
			[td]Text28[/td]
			[td]Text38[/td]
		[/tr]
	[/tbody]
[/table]


Indenting your text.

No indent
Indent of 30 px
Indent of 150px

Code: Select all

No indent
[indent=30] Indent of 30 px
[indent=150] Indent of 150px
word count: 606
Image
~~Red in hoof and claw... ~~


Family visiting. Send help!
Top
User avatar
Darius Baer Bottom
Wiki Worker
Wiki Worker
Posts: 1440
Joined: Sun Jan 05, 2020 10:46 am
Race: Human
Profession: Woodworker / Sailor
Renown: 1110
Character Sheet
Character Wiki
Letters
Point Bank Thread
Wealth Tier: Tier 9

Featured

Contribution

Milestones

RP Medals

Miscellaneous

Events

Re: Some (not all) BB Codes.

Horizontal Line (Ideal for time transitions or location transitions.)

Code: Select all

[hr][/hr]
What It Looks Like
word count: 18
Top
Post Reply Request an XP Review Claim Wealth Thread

Return to “Post Templates”