BBCode: Difference between revisions

From PokéHeroes Wiki
Jump to navigation Jump to search
No edit summary
Ephenia (talk | contribs)
No edit summary
Line 1: Line 1:
[[Category:Help]]
[[Category:Help]]
BBCode are codes which can enchance your text and make it the way you want it to be.
BBCode consists of codes which can enchance your text and make it the way you want it to be.


BBCode can only be used in the Forums, or in the ''About Me'' section on your [[userprofile]]
BBCode can only be used on the [[Forum|Forums]], in feeds, [[Pal Pad]], Private Messages, or in the ''About Me'' section & Custom Panels on your [[userprofile]].
==What is BBCode?==
==What is BBCode?==
BBCode or Bulletin Board Code is a lightweight markup language used to format posts in many message boards. The available tags are usually indicated by square brackets ([ ]) surrounding a keyword, and they are parsed by the message board system before being translated into a markup language that web browsers understand—usually HTML or XHTML.
BBCode or Bulletin Board Code is a lightweight markup language used to format posts in many message boards. The available tags are usually indicated by square brackets ([ ]) surrounding a keyword, and they are parsed by the message board system before being translated into a markup language that web browsers understand—usually HTML or XHTML.


{| align="center" border="2" cellpadding="1" cellspacing="1" class="wikitable" style="padding:0px auto; width: 700px; right:300;"
{| align="center" border="2" cellpadding="1" cellspacing="1" class="wikitable" style="padding:0px auto; width: 780px; right:300; background: #b1d6e4"
|-
|-
! scope="col" style="text-align:center;border:1px solid #606060;  background: -webkit-linear-gradient(90deg, #CCCCCC, #FFFFFF) repeat scroll 0 0 transparent;"|Name
! scope="col" style="text-align:center;border:1px solid #606060;  background: -webkit-linear-gradient(90deg, #4e8aa5, #d2e1e9) repeat scroll 0 0 transparent;"|Name
! scope="col" style="text-align:center;border:1px solid #606060; background:#D8D8D8;  background: -webkit-linear-gradient(90deg, #CCCCCC, #FFFFFF) repeat scroll 0 0 transparent;"|Code
! scope="col" style="text-align:center;border:1px solid #606060; background:#D8D8D8;  background: -webkit-linear-gradient(90deg, #4e8aa5, #d2e1e9) repeat scroll 0 0 transparent;"|Code
! scope="col" style="text-align:center;border:1px solid #606060; background:#D8D8D8;  background: -webkit-linear-gradient(90deg, #CCCCCC, #FFFFFF) repeat scroll 0 0 transparent;"|Example
! scope="col" style="text-align:center;border:1px solid #606060; background:#D8D8D8;  background: -webkit-linear-gradient(90deg, #4e8aa5, #d2e1e9) repeat scroll 0 0 transparent;"|Example
! scope="col" style="text-align:center;border:1px solid #606060; background:#D8D8D8;  background: -webkit-linear-gradient(90deg, #4e8aa5, #d2e1e9) repeat scroll 0 0 transparent; width: 250px;"|Notes
! scope="col" style="text-align:center;border:1px solid #606060; background:#D8D8D8;  background: -webkit-linear-gradient(90deg, #4e8aa5, #d2e1e9) repeat scroll 0 0 transparent; width: 80px;"|Restricted
|-
|-
| style="border:1px solid #606060;text-align:center"|Bold
| style="border:1px solid #606060;text-align:center"|Bold
| style="border:1px solid #606060;text-align:center"|[b]Text Here[/b]
| style="border:1px solid #606060;text-align:center"|[b]Text Here[/b]
| style="border:1px solid #606060;text-align:center"|[[File:Screenshot 19.png]]
| style="border:1px solid #606060;text-align:center"|<font style="font-weight: bold>Text Here</font>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|This will let your text be bold!
| style="border:1px solid #606060;text-align:center"|No
|-
|-
| style="border:1px solid #606060;text-align:center"|Italic
| style="border:1px solid #606060;text-align:center"|Italic
| style="border:1px solid #606060;text-align:center"|[i]Text Here[/i]
| style="border:1px solid #606060;text-align:center"|[i]Text Here[/i]
| style="border:1px solid #606060;text-align:center"|[[File:Screenshot 1.png]]
| style="border:1px solid #606060;text-align:center"|<i>Text Here</i>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|This will let your text be italicized!
| style="border:1px solid #606060;text-align:center"|No
|-
|-
| style="border:1px solid #606060;text-align:center"|Underline
| style="border:1px solid #606060;text-align:center"|Underline
| style="border:1px solid #606060;text-align:center"|[u]Text Here[/u]
| style="border:1px solid #606060;text-align:center"|[u]Text Here[/u]
| style="border:1px solid #606060;text-align:center"|[[File:Screenshot 2.png]]
| style="border:1px solid #606060;text-align:center"|<u>Text Here</u>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|This will let your text be underlined!
| style="border:1px solid #606060;text-align:center"|No
|-
|-
| style="border:1px solid #606060;text-align:center"|Struck-Out
| style="border:1px solid #606060;text-align:center"|Strikethrough
| style="border:1px solid #606060;text-align:center"|[s]Text Here[/s]
| style="border:1px solid #606060;text-align:center"|[s]Text Here[/s]
| style="border:1px solid #606060;text-align:center"|[[File:Screenshot 3.png]]
| style="border:1px solid #606060;text-align:center"|<strike>Text Here</strike>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|Don't like it? Strike it!
| style="border:1px solid #606060;text-align:center"|No
|-
|-
| style="border:1px solid #606060;text-align:center"|Text Color
| style="border:1px solid #606060;text-align:center"|Text Color
| style="border:1px solid #606060;text-align:center"|[color=red]Text Here[/color]
| style="border:1px solid #606060;text-align:center"|[color=red]Text Here[/color]
| style="border:1px solid #606060;text-align:center"|[[File:Screenshot 4.png]]
| style="border:1px solid #606060;text-align:center"|<font color="red">Text Here</font>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|Give your text color!
 
Many color names are supported, and you can also use hexadecimal values to get very specific colors such as <font color="#0000FF">#0000FF</font>!
| style="border:1px solid #606060;text-align:center"|No
|-
|-
| style="border:1px solid #606060;text-align:center"|Text Size
| style="border:1px solid #606060;text-align:center"|Text Size
| style="border:1px solid #606060;text-align:center"|[size=14]Text Here[/size]
| style="border:1px solid #606060;text-align:center"|[size=14]Text Here[/size]
| style="border:1px solid #606060;text-align:center"|[[File:Screenshot 5.png]]
| style="border:1px solid #606060;text-align:center"|<font style="font-size: 14pt">Text Here</font>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|Make your text shrink and grow!
 
Only sizes 6|8|10|12|14|16|18|20|22 are supported!
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
| style="border:1px solid #606060;text-align:center"|Image
| style="border:1px solid #606060;text-align:center"|Image
| style="border:1px solid #606060;text-align:center"|[img]Image Link[/img]
| style="border:1px solid #606060;text-align:center"|[img]Image Link[/img]
| style="border:1px solid #606060;text-align:center"|[[file:Pokedollar.png]]
| style="border:1px solid #606060;text-align:center"|<html><img src="//upload.pokeheroes.com/img/avatar/708283049.png?t=1559594301"></html>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|Use links of images that display by themselves within a tab or page. Use links that have image file extensions on the end of them such as ".png", ".jpeg", etc. You can also right click, and copy the image link of images on pages to easily get their links.
 
The image BBCode also supports .GIF images!
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
| style="border:1px solid #606060;text-align:center"|Url
| style="border:1px solid #606060;text-align:center"|URL
| style="border:1px solid #606060;text-align:center"|[url=Link Here]Text Here[/url]
| style="border:1px solid #606060;text-align:center"|[url=Link Here]Text Here[/url]
| style="border:1px solid #606060;text-align:center"|[http://wiki.pokeheroes.com/index.php?title=Main_Page The Example]
| style="border:1px solid #606060;text-align:center"|<html><a href="//pokeheroes.com/" target="_blank">PokéHeroes Main Page</a></html>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|All purpose way to make links, and or to hyperlink.
 
One of the more common BBCodes you'll see being used.
| style="border:1px solid #606060;text-align:center"|No
|-
|-
| style="border:1px solid #606060;text-align:center"|Quote
| style="border:1px solid #606060;text-align:center"|Quote
| style="border:1px solid #606060;text-align:center"|[quote]Text Here[/quote]
| style="border:1px solid #606060;text-align:center"|[quote]Text Here[/quote]
| style="border:1px solid #606060;text-align:center"|??
| style="border:1px solid #606060; height: 100px; width: 300px"|<div style="font-family: Verdana,sans-serif; border: 1px solid #111; background-color: #dcf0fd; width: 90%; position: relative; left: 2.5%; padding: 4px; margin-left: 2px; color: #053b55; line-height: 0.5em; text-size-adjust: none;">
<span style="padding: 3px; border: 1px solid #111; font-weight: 700; background-color: #dcf0fd; font-size: 11px; width: auto; margin-left: 10px; position: relative; top: -18px; overflow: hidden;">Quote</span><br>
Text Here
</div>
| style="border:1px solid #606060;text-align:center"|<font style="font-size: 11px">Feeling fancy and don't want to surround text with quote marks the traditional way?
 
Then this is for you!</font>
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
| style="border:1px solid #606060;text-align:center"|Quote with Username
| style="border:1px solid #606060;text-align:center"|Quote with Username
| style="border:1px solid #606060;text-align:center"|[quote=Username]Text Here[/quote]
| style="border:1px solid #606060;text-align:center"|[quote=Username]Text Here[/quote]
| style="border:1px solid #606060;text-align:center"|??
| style="border:1px solid #606060; height: 100px; width: 300px"|<div style="font-family: Verdana,sans-serif; border: 1px solid #111; background-color: #dcf0fd; width: 90%; position: relative; left: 2.5%; padding: 4px; margin-left: 2px; color: #053b55; line-height: 0.5em; text-size-adjust: none;">
<span style="padding: 3px; border: 1px solid #111; font-weight: 700; background-color: #dcf0fd; font-size: 11px; width: auto; margin-left: 10px; position: relative; top: -18px; overflow: hidden;">Quote from <i>Ephenia</i></span><br>
I have an attitude.
</div>
| style="border:1px solid #606060;text-align:center"|<font style="font-size: 11px">A great way to reply to specific parts of what other Users may be saying on forum threads. Also good if you would want to quote someone, or something specific in general!<font>
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
| style="border:1px solid #606060;text-align:center"|Spoiler
| style="border:1px solid #606060;text-align:center"|Spoiler
| style="border:1px solid #606060;text-align:center"|[spoiler]Text Here[/spoiler]
| style="border:1px solid #606060;text-align:center"|[spoiler]Text Here[/spoiler]
| style="border:1px solid #606060;text-align:center"|??
| style="border:1px solid #606060;text-align:left"|<span>
<html><img src="//staticpokeheroes.com/img/misc/spoiler_plus.png">&nbsp;<a href="javascript:void(0)" style="color: #080b49; font-weight: bold; text-decoration: underline; line-height: 18px; position: absolute; padding-top: 5px;;">Show hidden content</a></html>
<hr style="border: 1px solid #444; color: #277980; background-color: #277980; height: 1px;">
</span>
<hr style="border: 1px solid #444; color: #277980; background-color: #277980; height: 1px;">
 
<span>
<html><img src="//staticpokeheroes.com/img/misc/spoiler_minus.png">&nbsp;<a href="javascript:void(0)" style="color: #080b49; font-weight: bold; text-decoration: underline; line-height: 18px; position: absolute; padding-top: 5px;;">Hide content</a></html>
<hr style="border: 1px solid #444; color: #277980; background-color: #277980; height: 1px;">
</span>
<div style="border: 2px solid #444; background-color: #d0e5e6; margin-top: 5px; padding: 8px; color: #053b55;">Text Here</div>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|Spoilers are a great way to hide and conceal content.
 
They are very useful for being considerate with sensitive information while avoiding trouble by ruining the fun for others!
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
| style="border:1px solid #606060;text-align:center"|Left
| style="border:1px solid #606060;text-align:center"|[left]Left Text[/left]
| style="border:1px solid #606060;text-align:left"|Left Text
| style="border:1px solid #606060;text-align:center;font-size: 11px"|Used for making text or content shift and align to the left.
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
| style="border:1px solid #606060;text-align:center"|Center
| style="border:1px solid #606060;text-align:center"|Center
| style="border:1px solid #606060;text-align:center"|[center]Text Here[/center]
| style="border:1px solid #606060;text-align:center"|[center]Center Text[/center]
| style="border:1px solid #606060;text-align:center"|??
| style="border:1px solid #606060;text-align:center"|Center Text
| style="border:1px solid #606060;text-align:center;font-size: 11px"|Used for making text or content align to the center.
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
| style="border:1px solid #606060;text-align:center"|Right
| style="border:1px solid #606060;text-align:center"|[right]Text Here[/right]
| style="border:1px solid #606060;text-align:right"|Right Text
| style="border:1px solid #606060;text-align:center;font-size: 11px"|Used for making text or content shift and align to the right.
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
| style="border:1px solid #606060;text-align:center"|Horizontal Line
| style="border:1px solid #606060;text-align:center"|Horizontal Line
| style="border:1px solid #606060;text-align:center"|[hr]
| style="border:1px solid #606060;text-align:center"|[hr]
| style="border:1px solid #606060;text-align:center"|[[File:Screenshot 6.png]]
| style="border:1px solid #606060;text-align:center"|<hr style="border: 0; color: #277980; background-color: #277980; height: 1px;">
| style="border:1px solid #606060;text-align:center"|<font style="font-size: 11px">Useful if you would want to divide posts or content into different sections.</font>
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
| style="border:1px solid #606060;text-align:center"|Heading
| style="border:1px solid #606060;text-align:center"|Heading
| style="border:1px solid #606060;text-align:center"|[h]Your text Here[/h]
| style="border:1px solid #606060;text-align:center"|[h]Your text Here[/h]
| style="border:1px solid #606060;text-align:center"|[[File:Screenshot 7.png]]
| style="border:1px solid #606060;text-align:center"|<font style="display: block; font-size: 1.5em; margin-block-start: 0.83em; margin-block-end: 0.83em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold; margin: 0;>Your text here</font>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|An easy way to make text slightly bigger and bold. It works great for headers, of course.
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
| style="border:1px solid #606060;text-align:center"|Pokemon Show Icon
| style="border:1px solid #606060;text-align:center"|Pokemon Show Icon
| style="border:1px solid #606060;text-align:center"|[pkmn]1[/pkmn]
| style="border:1px solid #606060;text-align:center"|[pkmn]1[/pkmn]
| style="border:1px solid #606060;text-align:center"|[[File:1.png]]
| style="border:1px solid #606060;text-align:center"|<html><img src="//staticpokeheroes.com/img/pokemon/bw_field/1.png"></html>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|Shows the icon of Pokemon with its specified Pokédex or ID number.
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
| style="border:1px solid #606060;text-align:center"|Pokemon Show Big
| style="border:1px solid #606060;text-align:center"|Pokemon Show Big
| style="border:1px solid #606060;text-align:center"|[pkmnbig]1[/pkmnbig]  
| style="border:1px solid #606060;text-align:center"|[pkmnbig]2[/pkmnbig]  
| style="border:1px solid #606060;text-align:center"|[[File:01.png]]
| style="border:1px solid #606060;text-align:center"|<html><img src="//staticpokeheroes.com/img/pokemon/bw_front/02.png"></html>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|Shows the sprite of Pokemon with its specified Pokédex or ID number.
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
| style="border:1px solid #606060;text-align:center"|Pokemon Show Big Shiny
| style="border:1px solid #606060;text-align:center"|Pokemon Show Big Shiny
| style="border:1px solid #606060;text-align:center"|[pkmnbig=s]1[/pkmnbig]  
| style="border:1px solid #606060;text-align:center"|[pkmnbig=s]3[/pkmnbig]  
| style="border:1px solid #606060;text-align:center"|[[File:11.png]]
| style="border:1px solid #606060;text-align:center"|<html><img src="//staticpokeheroes.com/img/pokemon/bw_front/13.png"></html>
| style="border:1px solid #606060;text-align:center;font-size: 11px"|Shows the shiny sprite of Pokemon with its specified Pokédex or ID number.
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
| style="border:1px solid #606060;text-align:center"|User Tag
| style="border:1px solid #606060;text-align:center"|User Tag
| style="border:1px solid #606060;text-align:center"|[user]Username[/user]
| style="border:1px solid #606060;text-align:center"|[user]Username[/user]
| style="border:1px solid #606060;text-align:center"|[http://www.pokeheroes.com/userprofile.php?name=Riako Riako]
| style="border:1px solid #606060;text-align:center"|<html><a href="//www.pokeheroes.com/userprofile.php?name=Ephenia" target="_self">Ephenia</a></html>
| style="border:1px solid #606060;text-align:center"|<font style="font-size: 11px">This is preferred and much easier to use over using the URL BBCode for linking to someone's Userprofile.
 
It also opens the specified Userprofile in the same tab!</font>
| style="border:1px solid #606060;text-align:center"|No
|-
|-
| style="border:1px solid #606060;text-align:center"|Code Tag
| style="border:1px solid #606060;text-align:center"|Code Tag
| style="border:1px solid #606060;text-align:center"|[code]Code Goes here[/code]  
| style="border:1px solid #606060;text-align:center"|[code]Code Goes here[/code]  
| style="border:1px solid #606060;text-align:center"|??
| style="border:1px solid #606060;text-align:center"|<div style="border: 1px solid grey; background-color: #fff; padding: 4px; width: 95%; color: #000; font-family: Arial;>
Code blocks are a good way to show other code such as [b]bold[/b]
</div>
| style="border:1px solid #606060;text-align:center"|<font style="font-size: 11px">Best way to show code without putting it into action!</font>
| style="border:1px solid #606060;"|
*Pal Pad
*Feeds
|-
|-
|! scope="col"  colspan="3" style="text-align:center;border:1px solid #606060;  background: -webkit-linear-gradient(90deg, #CCCCCC, #FFFFFF) repeat scroll 0 0 transparent;"|More to be added.
|! scope="col"  colspan="5" style="text-align:center;border:1px solid #606060;  background: -webkit-linear-gradient(90deg, #4e8aa5, #d2e1e9) repeat scroll 0 0 transparent;font-weight: bold;"|More to be added.
|}
|}
==Useful Resources==
* <html><a href="//pokeheroes.com/forum_thread?id=105" target="_blank">Original BBCode Guide</a></html> by <html><a href="//pokeheroes.com/userprofile?name=-Max">-Max</a></html>
* <html><a href="//pokeheroes.com/forum_thread?id=105&site=3#110992" target="_blank">Compilation list of Pokedex & ID numbers</a></html> by <html><a href="//pokeheroes.com/userprofile?name=Liirah" target="_blank">Liirah</a></html>

Revision as of 01:35, 16 June 2019

BBCode consists of codes which can enchance your text and make it the way you want it to be.

BBCode can only be used on the Forums, in feeds, Pal Pad, Private Messages, or in the About Me section & Custom Panels on your userprofile.

What is BBCode?

BBCode or Bulletin Board Code is a lightweight markup language used to format posts in many message boards. The available tags are usually indicated by square brackets ([ ]) surrounding a keyword, and they are parsed by the message board system before being translated into a markup language that web browsers understand—usually HTML or XHTML.

Name Code Example Notes Restricted
Bold [b]Text Here[/b] Text Here This will let your text be bold! No
Italic [i]Text Here[/i] Text Here This will let your text be italicized! No
Underline [u]Text Here[/u] Text Here This will let your text be underlined! No
Strikethrough [s]Text Here[/s] Text Here Don't like it? Strike it! No
Text Color [color=red]Text Here[/color] Text Here Give your text color!

Many color names are supported, and you can also use hexadecimal values to get very specific colors such as #0000FF!

No
Text Size [size=14]Text Here[/size] Text Here Make your text shrink and grow!

Only sizes 6|8|10|12|14|16|18|20|22 are supported!

  • Pal Pad
  • Feeds
Image [img]Image Link[/img] Use links of images that display by themselves within a tab or page. Use links that have image file extensions on the end of them such as ".png", ".jpeg", etc. You can also right click, and copy the image link of images on pages to easily get their links.

The image BBCode also supports .GIF images!

  • Pal Pad
  • Feeds
URL [url=Link Here]Text Here[/url] PokéHeroes Main Page All purpose way to make links, and or to hyperlink.

One of the more common BBCodes you'll see being used.

No
Quote [quote]Text Here[/quote]

Quote
Text Here

Feeling fancy and don't want to surround text with quote marks the traditional way?

Then this is for you!

  • Pal Pad
  • Feeds
Quote with Username [quote=Username]Text Here[/quote]

Quote from Ephenia
I have an attitude.

A great way to reply to specific parts of what other Users may be saying on forum threads. Also good if you would want to quote someone, or something specific in general!
  • Pal Pad
  • Feeds
Spoiler [spoiler]Text Here[/spoiler]

 Show hidden content



 Hide content


Text Here
Spoilers are a great way to hide and conceal content.

They are very useful for being considerate with sensitive information while avoiding trouble by ruining the fun for others!

  • Pal Pad
  • Feeds
Left [left]Left Text[/left] Left Text Used for making text or content shift and align to the left.
  • Pal Pad
  • Feeds
Center [center]Center Text[/center] Center Text Used for making text or content align to the center.
  • Pal Pad
  • Feeds
Right [right]Text Here[/right] Right Text Used for making text or content shift and align to the right.
  • Pal Pad
  • Feeds
Horizontal Line [hr]
Useful if you would want to divide posts or content into different sections.
  • Pal Pad
  • Feeds
Heading [h]Your text Here[/h] Your text here An easy way to make text slightly bigger and bold. It works great for headers, of course.
  • Pal Pad
  • Feeds
Pokemon Show Icon [pkmn]1[/pkmn] Shows the icon of Pokemon with its specified Pokédex or ID number.
  • Pal Pad
  • Feeds
Pokemon Show Big [pkmnbig]2[/pkmnbig] Shows the sprite of Pokemon with its specified Pokédex or ID number.
  • Pal Pad
  • Feeds
Pokemon Show Big Shiny [pkmnbig=s]3[/pkmnbig] Shows the shiny sprite of Pokemon with its specified Pokédex or ID number.
  • Pal Pad
  • Feeds
User Tag [user]Username[/user] Ephenia This is preferred and much easier to use over using the URL BBCode for linking to someone's Userprofile.

It also opens the specified Userprofile in the same tab!

No
Code Tag [code]Code Goes here[/code]

Code blocks are a good way to show other code such as [b]bold[/b]

Best way to show code without putting it into action!
  • Pal Pad
  • Feeds
More to be added.

Useful Resources