BBCode: Difference between revisions

From PokéHeroes Wiki
Jump to navigation Jump to search
← Older editNewer edit →
Ephenia (talk | contribs)
1,220 edits
Ephenia (talk | contribs)
1,220 edits
Line 259: Line 259:


==Useful Resources==
==Useful Resources==
Full list of valid names for the Text Color BBCode:
<spoiler show="Color Names" hide="Color Names">
<html>
<div style="background-color: #b1d6e4; color: #fd5e53;">
<div style="color: aliceblue">Aliceblue</div>
<div style="color: antiquewhite">Antiquewhite</div>
<div style="color: aqua">Aqua</div>
<div style="color: aquamarine">Aquamarine</div>
<div style="color: azure">Azure</div>
<div style="color: beige">Beige</div>
<div style="color: bisque">Bisque</div>
<div style="color: black">Black</div>
<div style="color: blanchedalmond">Blanchedalmond</div>
<div style="color: blue">Blue</div>
<div style="color: blueviolet">Blueviolet</div>
<div style="color: brown">Brown</div>
<div style="color: burlywood">Burlywood</div>
<div style="color: cadetblue">Cadetblue</div>
<div style="color: chartreuse">Chartreuse</div>
<div style="color: chocolate">Chocolate</div>
<div style="color: coral">Coral</div>
<div style="color: cornflowerblue">Cornflowerblue</div>
<div style="color: cornsilk">Cornsilk</div>
<div style="color: crimson">Crimson</div>
<div style="color: currentcolor">Currentcolor</div>
<div style="color: cyan">Cyan</div>
<div style="color: darkblue">Darkblue</div>
<div style="color: darkcyan">Darkcyan</div>
<div style="color: darkgoldenrod">Darkgoldenrod</div>
<div style="color: darkgray">Darkgray</div>
<div style="color: darkgreen">Darkgreen</div>
<div style="color: darkgrey">Darkgrey</div>
<div style="color: darkkhaki">Darkkhaki</div>
<div style="color: darkmagenta">Darkmagenta</div>
<div style="color: darkolivegreen">Darkolivegreen</div>
<div style="color: darkorange">Darkorange</div>
<div style="color: darkorchid">Darkorchid</div>
<div style="color: darkred">Darkred</div>
<div style="color: darksalmon">Darksalmon</div>
<div style="color: darkseagreen">Darkseagreen</div>
<div style="color: darkslateblue">Darkslateblue</div>
<div style="color: darkslategray">Darkslategray</div>
<div style="color: darkslategrey">Darkslategrey</div>
<div style="color: darkturquoise">Darkturquoise</div>
<div style="color: darkviolet">Darkviolet</div>
<div style="color: deeppink">Deeppink</div>
<div style="color: deepskyblue">Deepskyblue</div>
<div style="color: dimgray">Dimgray</div>
<div style="color: dimgrey">Dimgrey</div>
<div style="color: dodgerblue">Dodgerblue</div>
<div style="color: firebrick">Firebrick</div>
<div style="color: floralwhite">Floralwhite</div>
<div style="color: forestgreen">Forestgreen</div>
<div style="color: fuchsia">Fuchsia</div>
<div style="color: gainsboro">Gainsboro</div>
<div style="color: ghostwhite">Ghostwhite</div>
<div style="color: gold">Gold</div>
<div style="color: goldenrod">Goldenrod</div>
<div style="color: gray">Gray</div>
<div style="color: green">Green</div>
<div style="color: greenyellow">Greenyellow</div>
<div style="color: grey">Grey</div>
<div style="color: honeydew">Honeydew</div>
<div style="color: hotpink">Hotpink</div>
<div style="color: indianred">Indianred</div>
<div style="color: indigo">Indigo</div>
<div style="color: inherit">Inherit <span style="color: black">&nbsp;&nbsp;&nbsp;<-- This takes color from the parent element (you may or may not find this interesting to use)</span></div>
<div style="color: initial">Initial <span style="color: black">&nbsp;&nbsp;&nbsp;<-- You won't find much difference using this over Black, but it's still valid!</span></div>
<div style="color: ivory">Ivory</div>
<div style="color: khaki">Khaki</div>
<div style="color: lavender">Lavender</div>
<div style="color: lavenderblush">Lavenderblush</div>
<div style="color: lawngreen">Lawngreen</div>
<div style="color: lemonchiffon">Lemonchiffon</div>
<div style="color: lightblue">Lightblue</div>
<div style="color: lightcoral">Lightcoral</div>
<div style="color: lightcyan">Lightcyan</div>
<div style="color: lightgoldenrodyellow">Lightgoldenrodyellow</div>
<div style="color: lightgray">Lightgray</div>
<div style="color: lightgreen">Lightgreen</div>
<div style="color: lightgrey">Lightgrey</div>
<div style="color: lightpink">Lightpink</div>
<div style="color: lightsalmon">Lightsalmon</div>
<div style="color: lightseagreen">Lightseagreen</div>
<div style="color: lightskyblue">Lightskyblue</div>
<div style="color: lightslategray">Lightslategray</div>
<div style="color: lightslategrey">Lightslategrey</div>
<div style="color: lightsteelblue">Lightsteelblue</div>
<div style="color: lightyellow">Lightyellow</div>
<div style="color: lime">Lime</div>
<div style="color: limegreen">Limegreen</div>
<div style="color: linen">Linen</div>
<div style="color: magenta">Magenta</div>
<div style="color: maroon">Maroon</div>
<div style="color: mediumaquamarine">Mediumaquamarine</div>
<div style="color: mediumblue">Mediumblue</div>
<div style="color: mediumorchid">Mediumorchid</div>
<div style="color: mediumpurple">Mediumpurple</div>
<div style="color: mediumseagreen">Mediumseagreen</div>
<div style="color: mediumslateblue">Mediumslateblue</div>
<div style="color: mediumspringgreen">Mediumspringgreen</div>
<div style="color: mediumturquoise">Mediumturquoise</div>
<div style="color: mediumvioletred">Mediumvioletred</div>
<div style="color: midnightblue">Midnightblue</div>
<div style="color: mintcream">Mintcream</div>
<div style="color: mistyrose">Mistyrose</div>
<div style="color: moccasin">Moccasin</div>
<div style="color: navajowhite">Navajowhite</div>
<div style="color: navy">Navy</div>
<div style="color: oldlace">Oldlace</div>
<div style="color: olive">Olive</div>
<div style="color: olivedrab">Olivedrab</div>
<div style="color: orange">Orange</div>
<div style="color: orangered">Orangered</div>
<div style="color: orchid">Orchid</div>
<div style="color: palegoldenrod">Palegoldenrod</div>
<div style="color: palegreen">Palegreen</div>
<div style="color: paleturquoise">Paleturquoise</div>
<div style="color: palevioletred">Palevioletred</div>
<div style="color: papayawhip">Papayawhip</div>
<div style="color: peachpuff">Peachpuff</div>
<div style="color: peru">Peru</div>
<div style="color: pink">Pink</div>
<div style="color: plum">Plum</div>
<div style="color: powderblue">Powderblue</div>
<div style="color: purple">Purple</div>
<div style="color: rebeccapurple">Rebeccapurple</div>
<div style="color: red">Red</div>
<div style="color: rosybrown">Rosybrown</div>
<div style="color: royalblue">Royalblue</div>
<div style="color: saddlebrown">Saddlebrown</div>
<div style="color: salmon">Salmon</div>
<div style="color: sandybrown">Sandybrown</div>
<div style="color: seagreen">Seagreen</div>
<div style="color: seashell">Seashell</div>
<div style="color: sienna">Sienna</div>
<div style="color: silver">Silver</div>
<div style="color: skyblue">Skyblue</div>
<div style="color: slateblue">Slateblue</div>
<div style="color: slategray">Slategray</div>
<div style="color: slategrey">Slategrey</div>
<div style="color: snow">Snow</div>
<div style="color: springgreen">Springgreen</div>
<div style="color: steelblue">Steelblue</div>
<div style="color: tan">Tan</div>
<div style="color: teal">Teal</div>
<div style="color: thistle">Thistle</div>
<div style="color: tomato">Tomato</div>
<div style="color: transparent">Transparent <span style="color: black">&nbsp;&nbsp;&nbsp;<-- This is Transparent (invisible text)</span></div>
<div style="color: turquoise">Turquoise</div>
<div style="color: unset">Unset  <span style="color: black">&nbsp;&nbsp;&nbsp;<-- Leaves the color unset and would also inherit color from the parent if it has color (sort of similar to Inherit)</span></div>
<div style="color: violet">Violet</div>
<div style="color: wheat">Wheat</div>
<div style="color: white">White</div>
<div style="color: whitesmoke">Whitesmoke</div>
<div style="color: yellow">Yellow</div>
<div style="color: yellowgreen">Yellowgreen</div>
</div>
</html>
</spoiler>
* <html><a href="//www.w3schools.com/colors/colors_picker.asp" target="_blank">HTML Color Picker</a></html> (for Hexadecimal values)


* <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" target="_blank">Original BBCode Guide</a></html> by <html><a href="//pokeheroes.com/userprofile?name=-Max">-Max</a></html>
* <html><a href="//codepen.io/MaxM30/full/ygNwaE" target="_blank">Progress Bar Helper v1</a> and <a href="//www.phme.ga/" target="_blank">Progress Bar Helper v2</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>
* <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 15:59, 3 August 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!

  • Pal Pad
  • Feeds
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] Displays images that you would like or want to show.

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
Train/Share Widget [widget=inter]Pokémon ID[/widget]
Train
 Widgets are great for helping get more exposure for your Pokemon.

You can easily get Widgets for your Pokémon over at the Share Widgets page.

  • Pal Pad
  • Feeds
Progress Bar v.1
[img]//staticpokeheroes.com/img/event_distribution/interact_progress.php?percent=PERCENTAGE&col=COLOR[/img]
 Replace "PERCENTAGE" in the link with the percent you want, decimals are supported.

Replace "COLOR" in the link with a number 1 through 7 depending on which color you would want.

  • Pal Pad
  • Feeds
Progress Bar v.2
[img]//staticpokeheroes.com/img/exp_bar.php?percent=PERCENTAGE[/img]
Replace "PERCENTAGE" in the link with the percent you want, decimals are supported. Only max of 99% is also supported.

To get the bottom green colored bar, just add "color=green&" (without the quotes) after "?" and before "percent" in the link.

  • Pal Pad
  • Feeds
Progress Bar v.3
[img]//staticpokeheroes.com/img/lovemeter.php?percent=PERCENTAGE[/img]
 Replace "PERCENTAGE" in the link with the percent you want, decimals are supported.
  • Pal Pad
  • Feeds
More to be added.

Useful Resources

Full list of valid names for the Text Color BBCode:

Retrieved from "https://wiki.pokeheroes.com/index.php?title=BBCode&oldid=91301"