Welcome to Gaia! :: Using BBcode -- Tips and Tricks [Outdated] | Forum

Register FaceBook Login Login

 

Welcome to Gaia's forums, where millions discuss thousands of topics a day.

Lurking is creepy. Quit skulking in the shadows and join the conversation!

Advertisement

Using BBcode -- Tips and Tricks [Outdated] 

Tags: using  bbcode  tips  tricks  outdated 
Share:
forum:92, topic:28432091
1 2 3 ... 13 14 15 >
     
** The following thread is outdated and may contain information that is not true due to changes to the Gaia Online Forums. While a lot of the codes remain use-able, some of them have changed, and this thread will no longer be updated. Last update: Fall 2008 **


http://img522.imageshack.us/img522/2571/bannerko4.png


---------------
In this thread, you will learn:

- Meaning of BBcode
- Using BBcode
- Advanced techniques and hidden BBcode codes
- Thread creating tips
---------------


Lets begin.

You might of heard the term "BBcode" and you might recognize the tags [b] and [/b], but do you know that these two objects are linked?
BBcode- short for Bulletin Board Code- is coding that allows users of message boards, like Gaia, to format their posts. You will
be able to use this coding to make things stand out, and create eye-appealing threads or even PMs, Journal entries, signature, or
your about section in your profile.


** BBCode is only FORUM coding. It CANNOT change anything like a web page or YOUR GAIA PROFILE.

http://img364.imageshack.us/img364/4580/astringogguidesrd3.png
http://img507.imageshack.us/img507/3357/imagemapsor4.png

 
     
     
 
http://img503.imageshack.us/img503/3914/basicsng9.png

BBCode is made of two main things. You have the tag, and then you have the
text.

A tag is a command that the forum recognizes, and it changes depending
on what you make the tag. For example, the code

[b]

is a tag. It will bold your text. However, if you just just one tag, you'll get
something that will look like this:

[b] My text is bolded!

The message board, or forum, doesn't know when you want to stop
bolding, so it gives an error. In this case, the tag does nothing. Therefor,
you must end ALL beginning tags with a closing tag. A proper code to bold
your text would look like this:

[b] My text is bolded! [/b]

However, when you type the [b] and the [/b] in a text box and
click submit, the forum hides the tags, and shows you this:

My text is bolded!

There are many tags you can use to make your text stand out. This guide
will show you almost all the ones you can use on Gaia. Remember, not all
forums will allow use to use the same tags as Gaia does.




ORDERING

Ordering is something that you DON'T need to do, but in most cases it is
easier to work with and the outcome might be better. This is an example
of someone who is coloring, bolding, and underlining their text.

My Text Is Different!

This person has used the following coding to apply these changes:

[color=red][b][u]
My Text Is Different! [/color][/u][/b]

We see here that he starts with a color tag, then a bold tag, and then an
underline tag. His text has come out okay, but the correct and legitament
way to code would look like this:

[color=red][b][u] My Text Is Different! [/u][/b][/color]

Here, you can see that he has closed the tags in order. The underline tag
was last, so we will close it first. The bold tag was second, so it is second
to be closed. And lastly, the color tag is closed.

You might not see a reason to code like this, but once you start getting into
BBCode, and using a bunch of it, coding like this is an advantage and a help.
     
     
http://img294.imageshack.us/img294/8143/beginnersyf4.png

If you've ever used a program like Microsoft Word before, you have
probably either bolded, italicized, or aligned your text. On the
GaiaOnline forums, you can do the same thing, but a bit differently.


If you have ever posted before, you should recognize the buttons
above the text box when submitting a post. Currently (June 07),
it looks somewhat like this:

http://img505.imageshack.us/img505/9553/postinbuttonslc1.png



With a simple click of these buttons, you can add BBCode to your
text.

For example, when you high light some text and click a button or
a drop down list selection, the tags are then automatically added.
Remember, if you want to play around with these buttons, you can
always use them in the test forum to see what you get.


Here are some of the Basic BBCodes out there.



Bold Text
    Example: Text text TEXT
    Code: [b] Text here [/b]



Italicize Text
    Example: Text text TEXT
    Code: [i] Text here [/i]



Underline Text
    Example: Text text TEXT
    Code: [u] Text here [/u]



Strike Through
    Example: Text text TEXT
    Code: [strike] Text here [/strike]



Quote Text
    Example:
    Quote:
    Text text TEXT

Code: [quote] Text here [/quote]



Font Colors
    Example: Text text TEXT
    Code: [color=COLORHERE] Text here [/color]



Align Font Left/Center/Right
    Example:
    Text text TEXT

    Example:
    Text text TEXT

    Example:
    Text text TEXT

    Code: [align=LEFT/CENTER/RIGHT] Text here [/align]



Code Font
    Example:
    You can type tags here, and they show [u] whee [/u]

Code: [code] Text here [/code]


Font Size
    Example:
Text text TEXT
Code: [size=NUMBER 0-24 HERE] Text here [/size]


 
     
     
 
http://img512.imageshack.us/img512/8703/intermediatehs4.png

Okay, so you understand the basics, and how BBCode works. But how do
we post links, color out fonts special colors, and other tricks? Well, even
though the buttons might not be shown, there are many more tags we can
use to enhance our posts.


Posting a text URL
    Example: Text text TEXT
    Code: [url=ADDRESS HERE] Text and tags here [/url]



Posting an Image
    Example:
    Code: [img]IMAGE URL HERE[/img]



Aligning an Image
    Example:
    Code: [imgleft]IMAGE URL HERE[/imgleft]
    Example:
    Code: [imgright]IMAGE URL HERE[/imgright]
    Example:

    Code: [align=center][img]IMAGE URL HERE[/img][/align]



Quotes With A Title
    Example:
    TITLE LALALALA
    Text text TEXT

Code: [quote="TITLE OF QUOTE HERE"] Text and tags here [/quote]



More Font Colors
    Example: Text text TEXT
    Code: [color=#HEXCODE HERE] Text and tags here [/color]


     
     
http://img515.imageshack.us/img515/1455/advancedry3.png

Now that we have learned almost all the tags that we can use on Gaia's
forums, lets learn how to use special codes to do things you might have
always wanted to know how to do.


LISTS

Lists are used to indent text and pictures for a more organized look.
Gaia offers several different types of lists, so you have your choices.

Example:

Things to Do

  • Finish Thread
  • Make Graphics
  • My Shop


Code:

[list]
[*] Bullet One
[*] Bullet Two
[*] Bullet Three[/list]


As you can see, each [*] makes a bullet point. We can add a different
tag to make the bullet become letters or numbers. For letters, you will use
this: [list=a] and for numbers, you will use this: [list=1].
Additionally, we can add a list inside a list. For example:

  • Finish Thread
    1. Intermediate Codes
    2. FAQ's
    3. MISC


Code:


[list=a][*] Finish Thread
[list=1][*] Intermediate Codes
[*] FAQ's
[*] MISC [/list][/list]

Notice, that since we have two lists, we close our tag by adding two close
list tags ([/list]). Experimenting with lists can do you some good.







CODING

Throughout this guide you have seen me post tags without using the
[code] tag, and they show up as a tag. How do I do this? Well,
there is a simple explanation. Let me show you how to do this, using
an organized list.

Step 1

  • Type out your codes/coding

Step 2

  • Add a [i][/i] after each [, and before each /

Step 3

  • Preview, and submit.


Example:

I am posting a [b] tag without doing the [/code] tag!

Code:

I am posting a [[i][/i]b] tag without doing the [[i][/i]/code] tag!

This can get tricky, so it might take a while to perfect, but it is nice to be
able to show codes without having to post a bulky box, like what the
coding tag does.






CHANGING UNDERLINE'S COLOR

You might have seen people posting with green text, and a gray underline.
Cool, huh? Well, here's how it's done:

Example: TEXT text Text

Coding:

[color=#FF00CC][u][b][/color][color=#666666] TEXT AND TAGS HERE [/color][/u][/b]

The first color tag names the color of the underline, and the second names the color of the following text. However, you might notice that if you try to
underline or bold your text when using this, the coding might screw up.








CHANGING QUOTE TITLES

When using the quote tag, one may notice the title of the tags
(username Wrote smile stays that one color that seems to never match. With
this trick, we can also apply basic tags.
Well, there is a way to change this.

Example:
[color=red]Look, [u]I'm[/u] [i]red[/i]![/color]
Look! I'm red too! We match http://img144.imageshack.us/img144/2479/contentwn2.gif



Code: [quote="[color=red]TITLE HERE[/color]"] QUOTE TEXT HERE [/quote]


As you can see, the "Wrote:" part cannot change color. However, the title
color change can be a nice addition to any quote box.
 
     
     
 
http://img442.imageshack.us/img442/117/threadsqj3.png

When making a thread, it's best to try to get appeal. When users see
something they like, they have a higher rate to post in that thread than if
the introduction posts didn't look all that great. Here are a few tips on how
to make your thread appealing, but to keep it from going insane.


  • Don't over do it.
    Many threads makers like to use random font colors, odd sizes, and post
    images all over the place. Stick to a theme of about three colors or less.
    When you're posting images, try not to make things look un-organized.

  • Watch your alignment
    A lot of users like to select all -> align -> Center. This is not bad, but
    sometimes it looks odd. When centering, usually users like it better if its a
    single image, like a banner, instead of the whole thread. Text is easier to
    read if it is aligned to the left or right.

  • Continue a theme
    If in the first post you have bolded underlined size 14 headers, you should
    have bolded underlined size 14 headers in all. It is not appealing to have to
    re-adjust to a new post style every single post, and can be confusing to a
    person browsing.

  • Watch your text format
    When you are posting a lot of information in one area or paragraph, some
    times its better to make that block look smaller than it actually is. To tell
    you the truth, people don't want to read a thread that looks huge when it
    comes to words. Using font sizes 9 through 11 can help make a lot look like
    a little.



I hope this helps you when you create any thread, whether it be a shop,
quest, a guide, or even just a topic in the Chatterbox.

If you have any question or comments, please post them in the thread.
Thanks!
     
     
reserved
 
     
 
You can delete my post if I posted too soon, but I have a specific question.

Right now I have a classic block profile but I want to customize it. Is there anyway I can make one image the background or the main focus of my profile??
     
     
    • I'm sorry, you're confused.

      The type of coding that profiles on Gaia use, is called CSS.
      BBCode is just for posting and the sort. I'm sorry if the intro confused you,
      I need to specify that.

      However, I can help you out in this area.

      Add this code to your profile, but this is all I am going to say. Please go to
      a CSS tutorial and ask there for more information.

      body {background: #fff url(URL OF IMAGE HERE} top left no repeat;}

      #content {background: transparent;}

. . . . . .
 
     
 
Okay, thanks. That makes more sense (again fill free to delete post).
     
All I want for Christmas is a Pink Magical Giftbox

Fangirls: 22
Boys: 16
     
    • Alright~

      I'm done for now. If you have any questions don't be shy of asking 3nodding

. . . . . .
 
     
     
 
    Get FireFox ~ It Is Groovy

    http://i14.tinypic.com/68h5teu.png

  • I give it a thumb ups!
    + Subscribed http://gaiarch.gaiatools.com/emotes/5oxlvl.gif







    Get GaiArch While Your At It ~ Cuz` It is Super Cool! :0
     
http://H3Xploit.com <-- My Website
Buying Anything With 5mill +
http://www.gaiaonline.com/forum/t.30322635/
Member since 2005
     
Very interesting. There were some things I didn't know (just 2 things, but it helped me XD)
Subscribed + Thumbs Up http://gaiarch.gaiatools.com/emotes/5oxlvl.gif
EDIT :: Some spelling errors and the text was to big .-.
PS. Mods took the fifth post T*T
 
     
]: Retired Gaian :[

Just a night-logger XD
*Only logs in at night o:*

But only when I have nothing to do XD
     
 
    • Thanks for the props~
      I hope to add more as I stumble upon tricks.

. . . . . .
     
    • Editing basics~

. . . . . .
 
     
http://tinyurl.com/66bfd4

oh hey

im zarkis
1 2 3 ... 13 14 15 >

Quick Reply

Enter both words below, separated by a space:

Can't read the text? Click here

Submit