BBCode Guide: How to embed YouTube videos, post images etc.

Pirate-Community Members' Forum.

Moderator: English moderators

Post Reply
Matyuv
Gangsta Globox
Posts: 21293
Joined: Thu Apr 29, 2004 10:22 am
Tings: 51371

BBCode Guide: How to embed YouTube videos, post images etc.

Post by Matyuv » Tue May 10, 2011 9:06 pm

BBCode is an implementation of HTML that is used to format posts in ways listed below.


Text Formatting
  • To make a piece of text bold enclose it in [b.][/b] tags, e.g.

    Code: Select all

    [b]Bold text[/b]
    becomes Bold text
  • For underlining use [u.][/u], e.g.

    Code: Select all

    [u]Underlined text[/u]
    becomes Underlined text
  • To italicise text use [i.][/i], e.g.

    Code: Select all

    [i]Italic text[/i]
    becomes Italic text
  • To create strikethrough text use [strike.][/strike], e.g.

    Code: Select all

    [strike]Strikethrough text[/strike]
    becomes Strikethrough text
  • Changing the colour of text is achieved by wrapping it in [color=][/color]. You can specify either a recognised colour name (eg. red, blue, yellow, etc.) or the hexadecimal triplet alternative, e.g. #FFFFFF, #000000. For example, to create red text you could use:

    Code: Select all

    [color=red]Red text[/color]
    or

    Code: Select all

    [color=#FF0000]Red text[/color]
    Both will output Red text
  • Changing the text size is achieved in a similar way using [size=][/size]. You can specify a numerical value representing the text size in percent, starting at 1 through 200. For example:

    Code: Select all

    [size=50]Small text[/size]
    outputs Small text, and

    Code: Select all

    [size=200]Huge text[/size]
    becomes Huge text
  • To create superscript and subscript text use [sup.][/sup] and [sub.][/sub] tags respectively. For example:

    Code: Select all

    2[sup]8[/sup], H[sub]2[/sub]O
    outputs 28, H2O
  • You can combine different format tags, e.g.

    Code: Select all

    [size=125][color=yellow][i]Big yellow italic text[/i][/color][/size]
    becomes Big yellow italic text

Quoting text
There are two ways you can quote text, with a reference or without.
  • To quote text with a reference to a person use [quote.=""][./quote] tags, e.g.

    Code: Select all

    [quote="Darth Vader"]No, I am your father.[/quote]
    outputs
    Darth Vader wrote:No, I am your father.
  • To quote text without reference, simply enclose it in [quote.][/quote] tags.

Adding code
If you want to output a piece of code or in fact anything that requires a fixed width, e.g. Courier type font you should enclose the text in [code.][/code] tags, for example:

Code: Select all

[code][b]BBCode     doesn't work   here[/b]
[/code]outputs

Code: Select all

[b]BBCode     doesn't work   here[/b]

Generating lists
BBCode supports two types of lists, unordered and ordered. An unordered list outputs each item in your list sequentially one after the other indenting each with a bullet character. To create an unordered list you use [list.][/list.] and define each item within the list using [*.]. For example:

Code: Select all

[list][*]Item 1[*]Item 2[*]Item 3[/list]
outputs
  • Item 1
  • Item 2
  • Item 3
The second type of list, an ordered list, gives you control over what is output before each item. To create an ordered list you use [list.=1][/list] to create a numbered list or alternatively [list.=a][/list] for an alphabetical list. As with the unordered list, items are specified using [*]. For example:

Code: Select all

Numbered list: [list=1][*]Item 1[*]Item 2[/list] Alphabetical list: [list=a][*]Item 1[*]Item 2[/list]
outputs
Numbered list:
  1. Item 1
  2. Item 2
Alphabetical list:
  1. Item 1
  2. Item 2

Adding images
To display an image you must surround the URL pointing to the image with [img.][/img] tags. For example:

Code: Select all

[img]http://www.raymanpc.com/wiki/en/images/thumb/f/f3/Rayman_Origins-_blog_logo.png/300px-Rayman_Origins-_blog_logo.png[/img]
outputs
Image


Adding links
phpBB features something called Magic Links, this will turn any syntactically correct URL into a link without you needing to specify any tags or even the leading http://. For example typing

Code: Select all

www.raymanpc.com
into your message will automatically lead to http://www.raymanpc.com being output when you view the message.

To make any text act as a link enclose it in [url.=][/url] tags. You must put the destination URL after the '=' sign, for example:

Code: Select all

[url=http://www.raymanpc.com]Pirate-Community[/url]
outputs Pirate-Community

As with all the BBCode tags you can wrap URLs around any of the other tags such as [img.][/img], [b.][/b], etc. For example:

Code: Select all

[url=http://www.raymanpc.com][img]http://www.raymanpc.com/forum/styles/raymanpc/imageset/forum_unread_subforum.png[/img][/url]
outputs
Image

You must ensure the correct open and close order is following. For example, this:

Code: Select all

[url=http://www.raymanpc.com][img]http://www.raymanpc.com/forum/styles/raymanpc/imageset/forum_unread_subforum.png[/url][/img]
is wrong.


Embedding YouTube videos

To embed a YouTube video to your post use the [youtube][/youtube] tags. You must put the video identifier between the tags. The identifier consists of several random characters that can be found in the video URL usually after the '=' sign, e.g. for this video http://www.youtube.com/watch?v=MvhwWXF-LfU the identifier is MvhwWXF-LfU, so to embed it you must write the following:

Code: Select all

[youtube]MvhwWXF-LfU[/youtube]


---------------------------------------------------
For the most part this was copied from the official BBCode guide.

If you have any questions about BBCode, feel free to leave them here.
P.S. We need a spoiler tag.
MandM81 wrote:YYYYYYYRRRHLHLPYYYYYYPDPPPYYYYYYYYYYYYRRRRRR

DesLife
Dora l'exploratrice
Posts: 19946
Joined: Sat Jun 12, 2004 12:42 pm
Tings: 186263

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by DesLife » Tue May 10, 2011 9:09 pm

Great, now let's hope people will read this, which I doubt. :mrgreen:
Image

MLII
Tarayzan
Posts: 8064
Joined: Sat Jan 03, 2009 10:48 pm
Location: idk man i'm more an abstract concept at this point
Tings: 43075

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by MLII » Tue May 10, 2011 9:40 pm

Mat you are an awesome genius.

I actually didn't know the sub thing existed >>
Image
Image

DesLife
Dora l'exploratrice
Posts: 19946
Joined: Sat Jun 12, 2004 12:42 pm
Tings: 186263

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by DesLife » Tue May 10, 2011 9:43 pm

Actually no one knows about sub and sup, for some reason.
Image

Holy Crap
Jano
Posts: 15930
Joined: Tue Feb 05, 2008 7:54 am
Location: I AM OMNIPRESENT! (Just like God, only better, because I exist)
Contact:
Tings: 80202

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Holy Crap » Wed May 11, 2011 9:20 am

Probably because they don't have a button which does it for you at the top of the posting box.
Image

Jman
Joe
Posts: 9113
Joined: Sat May 06, 2006 5:32 pm
Location: deezzz nuuutttss
Contact:
Tings: 57987

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Jman » Thu May 12, 2011 5:53 am

Oh señor Mat, your wiseness knows no bounds!
ImageImage
6/100 - Not Boon :partyhat:

Raylex
Vendeur
Posts: 16811
Joined: Wed Jul 27, 2005 12:22 pm
Tings: 43081

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Raylex » Thu Jun 30, 2011 10:48 am

Great job dude!
I was wondering if you can embed SoundCloud Waveform? That could be interesting.

Rayman fan2000
Garatta Ciatik
Posts: 1484
Joined: Sun Dec 12, 2010 5:55 pm
Location: London, UK
Tings: 10120

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Rayman fan2000 » Sat Jul 16, 2011 2:13 pm


Did I do it right?
Image

Hunchman801
Bad Rayman
Posts: 77013
Joined: Thu Aug 07, 2003 6:50 pm
Location: Paris, France
Contact:
Tings: 555780

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Hunchman801 » Fri Jul 29, 2011 11:00 pm

Sure... but the video is damn weird.
Image

Xenon
Globox
Posts: 37842
Joined: Sat Dec 04, 2004 10:21 pm
Tings: 132565

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Xenon » Fri Jul 29, 2011 11:06 pm

It's a shame this sticky didn't get more posts... its importance was quite understated.
Image

Matyuv
Gangsta Globox
Posts: 21293
Joined: Thu Apr 29, 2004 10:22 am
Tings: 51371

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Matyuv » Fri Jul 29, 2011 11:08 pm

Yeah, I'm so disappointed.
MandM81 wrote:YYYYYYYRRRHLHLPYYYYYYPDPPPYYYYYYYYYYYYRRRRRR

Xenon
Globox
Posts: 37842
Joined: Sat Dec 04, 2004 10:21 pm
Tings: 132565

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Xenon » Fri Jul 29, 2011 11:09 pm

Don't worry, my sticky didn't get that many more.
Image

Matyuv
Gangsta Globox
Posts: 21293
Joined: Thu Apr 29, 2004 10:22 am
Tings: 51371

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Matyuv » Fri Jul 29, 2011 11:13 pm

What are we doing wrong?
MandM81 wrote:YYYYYYYRRRHLHLPYYYYYYPDPPPYYYYYYYYYYYYRRRRRR

Hunchman801
Bad Rayman
Posts: 77013
Joined: Thu Aug 07, 2003 6:50 pm
Location: Paris, France
Contact:
Tings: 555780

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Hunchman801 » Sat Jul 30, 2011 12:51 am

I'm sure many people read it anyway!
Image

Matyuv
Gangsta Globox
Posts: 21293
Joined: Thu Apr 29, 2004 10:22 am
Tings: 51371

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Matyuv » Sat Jul 30, 2011 1:16 am

That's quite optimistic.
MandM81 wrote:YYYYYYYRRRHLHLPYYYYYYPDPPPYYYYYYYYYYYYRRRRRR

Hunchman801
Bad Rayman
Posts: 77013
Joined: Thu Aug 07, 2003 6:50 pm
Location: Paris, France
Contact:
Tings: 555780

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Hunchman801 » Sat Jul 30, 2011 1:19 am

At least it's a great topic... even if no one reads it!
Image

Matyuv
Gangsta Globox
Posts: 21293
Joined: Thu Apr 29, 2004 10:22 am
Tings: 51371

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Matyuv » Sat Jul 30, 2011 1:31 am

Word to Word gets many more views. :(
MandM81 wrote:YYYYYYYRRRHLHLPYYYYYYPDPPPYYYYYYYYYYYYRRRRRR

Hunchman801
Bad Rayman
Posts: 77013
Joined: Thu Aug 07, 2003 6:50 pm
Location: Paris, France
Contact:
Tings: 555780

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Hunchman801 » Sat Jul 30, 2011 1:56 am

Yeah, I guess it is a much more interesting topic. :paranormal:
Image

Matyuv
Gangsta Globox
Posts: 21293
Joined: Thu Apr 29, 2004 10:22 am
Tings: 51371

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by Matyuv » Sat Jul 30, 2011 1:58 am

Yeah, it's thrilling to see what kind of word associations other users come up with!
MandM81 wrote:YYYYYYYRRRHLHLPYYYYYYPDPPPYYYYYYYYYYYYRRRRRR

El Dango
Clark
Posts: 12896
Joined: Thu Feb 28, 2008 8:01 pm
Location: Where you need me the most
Contact:
Tings: 105675

Re: BBCode Guide: How to embed YouTube videos, post images etc.

Post by El Dango » Sat Jul 30, 2011 2:45 am

Such as zombie goat -> zombie chicken :lol:
Image
Do NOT forget to vote and participate in the SOTM and Manipulate the Image competitions!
(If you don't wanna, however, that's perfectly okay (I'm hardly a role model))

Post Reply