[Tutorial] The BBcode Guide
5 posters
Page 1 of 1
[Tutorial] The BBcode Guide
BBcode
What is BBcode?
BBCode is a special implementation of HTML. Whether you can actually use BBCode in your posts on the forum is determined by the administrator. In addition, you can disable BBCode on a per post basis via the posting form. BBCode itself is similar in style to HTML: tags are enclosed in square brackets [ and ] rather than < and > and it offers greater control over what and how something is displayed. Depending on the template you are using you may find adding BBCode to your posts is made much easier through a clickable interface above the message area on the posting form. Even with this you may find the following guide useful.
Text Formatting
BBCode includes tags to allow you to quickly change the basic style of your text. This is achieved in the following ways:
To make a piece of text bold enclose it in:
For underlining use:
To italicize text use:
To strike some text:
test
How to change the text colour or size
To alter the color or size of your text the following tags can be used. (Keep in mind that how the output appears will depend on the viewers browser and system):
To change your text color, you can specify a known color (ex: red, blue, yellow, etc.), or an hexadecimal color code (ex: #FFFFFF, #000000):
To change your text size, you must specify the text size in pixel, from 1 (so small you won't see it) to 29 (very huge):
To change the font, you must specify a recognized font (ex: Verdana, Arial) if the user hasn't got the font, a default one will be displayed :
Can I combine formatting tags?
Yes, of course you can; for example to get someones attention you may write:
Although, we recommend you not to use much text as above ! Remember that it's your task to correctly shut the tags. The following example is incorrect:
Quoting and outputting fixed-width text
Quoting text in replies
There are two ways you can quote text: with a reference or without.
The reference example, to quote a post wrote by Mr. Blobby, you must enter:
The second method allows you to blindly quote something. To use it :
Outputting code or fixed width data
If you want to output a piece of code (HTML or other) or in fact anything that requires a fixed width with a Courier-type font, you must use the following BBCode :
Generating lists
Creating an Un-ordered list
An un-ordered list produces a list which entries are one underneath the others and indented with a bullet character.
Creating an Ordered list
The second list type gives you the control on what will be displayed before each entry. To create an ordered list, you've got two possibilites :
A numbered list :
An alphabetical list :
Creating Links
Linking to another site
The BBcode supports several methods to create links, most commonly known under URLs.
First method, to create for an example a link to forumotion.com you must use :
Second method, if you want the link to display directly the URL :
Third method, this forum owns a functionality called 'Magic Links', that will convert automatically an URL into a clickable link, without needing to insert a BBCode tag nor http://. For an example, by typing
Showing images in posts
Adding an image to a post
The BBCode incorporates a tag for including images in your posts. Two very important things to remember when using this tag are: many users do not appreciate lots of images being shown in posts and second, the image you display must already be available on the Internet (it cannot exist only on your computer, for example, unless you run a webserver!). You can upload for free your images on internet by an image hosting such as www.servimg.com. To display an image, you need to proceed as following :
You can place an image into a link if you wish (by insuring yourself that the opening and closure tags are correct), for an example :
Text positioning
Four positions possibilities are proposed :
Left alignment
The centering :
Right alignment :
The justification :
Scrolling text
Make a message scroll horizontally
If you wish to make a text scroll horizontally, you need to use the following BBcode :
The second way to make a text scroll is vertically, with the following BBcode :
--END
(c)BBcode Tutorial from Forumotion.
What is BBcode?
BBCode is a special implementation of HTML. Whether you can actually use BBCode in your posts on the forum is determined by the administrator. In addition, you can disable BBCode on a per post basis via the posting form. BBCode itself is similar in style to HTML: tags are enclosed in square brackets [ and ] rather than < and > and it offers greater control over what and how something is displayed. Depending on the template you are using you may find adding BBCode to your posts is made much easier through a clickable interface above the message area on the posting form. Even with this you may find the following guide useful.
Text Formatting
BBCode includes tags to allow you to quickly change the basic style of your text. This is achieved in the following ways:
To make a piece of text bold enclose it in:
- Code:
[b]Hello[/b]
For underlining use:
- Code:
[u]Hello[/u]
To italicize text use:
- Code:
[i]Great![/i]
To strike some text:
- Code:
[strike]Test[/strike]
How to change the text colour or size
To alter the color or size of your text the following tags can be used. (Keep in mind that how the output appears will depend on the viewers browser and system):
To change your text color, you can specify a known color (ex: red, blue, yellow, etc.), or an hexadecimal color code (ex: #FFFFFF, #000000):
- Code:
[color=red]Red color (red)[/color] or [color=#FF0000]Red color (#FF0000)[/color]
To change your text size, you must specify the text size in pixel, from 1 (so small you won't see it) to 29 (very huge):
- Code:
[size=9]SMALL[/size] or [size=24]HUGE[/size]
To change the font, you must specify a recognized font (ex: Verdana, Arial) if the user hasn't got the font, a default one will be displayed :
- Code:
[font=Arial]Arial font[/font] or [font=Comic Sans Ms]Comic sans MS font[/font]
Can I combine formatting tags?
Yes, of course you can; for example to get someones attention you may write:
- Code:
[size=18][color=red][b]LOOK AT ME ![/b][/color][/size]
Although, we recommend you not to use much text as above ! Remember that it's your task to correctly shut the tags. The following example is incorrect:
- Code:
[b][u]This is incorrect[/b][/u]
- Code:
[b][u]This is correct[/u][/b]
Quoting and outputting fixed-width text
Quoting text in replies
There are two ways you can quote text: with a reference or without.
The reference example, to quote a post wrote by Mr. Blobby, you must enter:
- Code:
[quote="Mr. Blobby"]The text wrote by Mr. Blobby must be placed here[/quote]
Remember that you must include the quotation marks "" around the name you are quoting -- they are not optional.Mr. Blobby wrote:The text wrote by Mr. Blobby must be placed here
The second method allows you to blindly quote something. To use it :
- Code:
[quote]Blind quote[/quote]
Blind quote
Outputting code or fixed width data
If you want to output a piece of code (HTML or other) or in fact anything that requires a fixed width with a Courier-type font, you must use the following BBCode :
- Code:
[code]echo "This is some code";[/code]
- Code:
echo "This is some code";
Generating lists
Creating an Un-ordered list
An un-ordered list produces a list which entries are one underneath the others and indented with a bullet character.
Creating an Ordered list
The second list type gives you the control on what will be displayed before each entry. To create an ordered list, you've got two possibilites :
A numbered list :
- Code:
[list=1][*]Do shopping[*]Buy a new computer[*]Yell to its computer when it crashes[/list]
- Do shopping
- Buy a new computer
- Yell to its computer when it crashes
An alphabetical list :
- Code:
[list=a][*]First possible answer[*]Second possible answer[*]Third possible answer[/list]
- First possible answer
- Second possible answer
- Third possible answer
Creating Links
Linking to another site
The BBcode supports several methods to create links, most commonly known under URLs.
First method, to create for an example a link to forumotion.com you must use :
- Code:
[url=http://www.forumotion.com/]Visit forumotion.com ![/url]
Second method, if you want the link to display directly the URL :
- Code:
[url]http://www.forumotion.com/[/url]
Third method, this forum owns a functionality called 'Magic Links', that will convert automatically an URL into a clickable link, without needing to insert a BBCode tag nor http://. For an example, by typing
- Code:
www.forumotion.com
Showing images in posts
Adding an image to a post
The BBCode incorporates a tag for including images in your posts. Two very important things to remember when using this tag are: many users do not appreciate lots of images being shown in posts and second, the image you display must already be available on the Internet (it cannot exist only on your computer, for example, unless you run a webserver!). You can upload for free your images on internet by an image hosting such as www.servimg.com. To display an image, you need to proceed as following :
- Code:
[img]http://i77.servimg.com/u/f77/18/11/57/84/images11.jpg[/img]
You can place an image into a link if you wish (by insuring yourself that the opening and closure tags are correct), for an example :
- Code:
[url=https://www.facebook.com/Eisu.chan/][img]http://i77.servimg.com/u/f77/18/11/57/84/images11.jpg[/img][/url]
Text positioning
Four positions possibilities are proposed :
Left alignment
- Code:
[left]text aligned to the left[/left]
text aligned to the left
The centering :
- Code:
[center]Text centered[/center]
Text centered
Right alignment :
- Code:
[right]Text aligned to the right[/right]
Text aligned to the right
The justification :
- Code:
[justify]Otaku is derived from a Japanese term for another's house or family (お宅, otaku). This word is often used metaphorically, as an honorific second-person pronoun. In this usage, its literal translation is "you". For example, in the anime Macross, first aired in 1982, Lynn Minmay uses the term this way.[/justify]
Otaku is derived from a Japanese term for another's house or family (お宅, otaku). This word is often used metaphorically, as an honorific second-person pronoun. In this usage, its literal translation is "you". For example, in the anime Macross, first aired in 1982, Lynn Minmay uses the term this way.
Scrolling text
Make a message scroll horizontally
If you wish to make a text scroll horizontally, you need to use the following BBcode :
- Code:
[scroll]My message[/scroll]
The second way to make a text scroll is vertically, with the following BBcode :
- Code:
[updown]My message[/updown]
--END
(c)BBcode Tutorial from Forumotion.
Re: [Tutorial] The BBcode Guide
How to make a spoiler ? >.>
Skynet- Posts : 845
Coins : 21587
Liked : 4
Join date : 2013-04-20
Age : 28
Location : Malaysia
Re: [Tutorial] The BBcode Guide
How to put gif files in the signature? (;_;)
Prince_Ciel_22- Posts : 177
Coins : 20762
Liked : 5
Join date : 2013-04-18
Age : 23
Location : Philippines
Re: [Tutorial] The BBcode Guide
for the spoiler:
and for the gif in sig? you just have to put the img bbcode.
- Code:
[spoiler]Your message here...[/spoiler]
and for the gif in sig? you just have to put the img bbcode.
- Code:
[img]Your image link here...[/img]
Re: [Tutorial] The BBcode Guide
oh , thanks .
Skynet- Posts : 845
Coins : 21587
Liked : 4
Join date : 2013-04-20
Age : 28
Location : Malaysia
Re: [Tutorial] The BBcode Guide
i thought there's no spoiler here just noticed lol
MacMac21.xD- Posts : 435
Coins : 20935
Liked : 6
Join date : 2013-04-30
Re: [Tutorial] The BBcode Guide
Nice tutorial :)
PainAkatsuki- Posts : 26
Coins : 20171
Liked : 0
Join date : 2013-10-02
Age : 28
Location : Akatsuki hideout
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum
|
|
Wed Jul 22, 2015 3:01 pm by Mae Mhae
» Hello to all
Sun Jul 06, 2014 5:24 pm by Ara Haan
» [Battle] Shinichi Kudo or L Lawliet
Sat Nov 16, 2013 3:36 pm by EnmaAifromhell
» Anime Recommendation! 01
Tue Nov 12, 2013 6:36 pm by KeiHiroyuki
» Anime You've Watched Today?
Thu Nov 07, 2013 10:13 am by Kya09_
» [VOTE] Is Cat ears and Tails are justice Or FLAT?
Mon Nov 04, 2013 10:45 am by xXOTAKU.KnightXx
» Kill La Kill Episode 6
Mon Nov 04, 2013 10:37 am by xXOTAKU.KnightXx
» Anime Suggestion's
Sun Nov 03, 2013 2:18 pm by xXOTAKU.KnightXx
» Summer and Fall anime of 2013
Sun Nov 03, 2013 6:47 am by RApollos
» Durarara!!
Fri Nov 01, 2013 5:22 pm by Kya09_