Welcome to Gaia! ::

Guest count since Feb.23, 2007

+1 1 100.0% [ 4139 ]
Total Votes:[ 4139 ]
1 2 3 4 5 6 ... 72 73 74 > >>
Intro & Table of Contents | The tool(bar)s | Size & Color | Text | Images | Put it all together | Examples | Links out, Special Thanks, Link us
Links will open in new tab



User Image
If you find this thread helpful then don't forget to <3 and Share



A simple how-to guide to making your post uniquely yours.
If you have any questions/suggestions leave a reply and I can append this guide biggrin
**Don't forget to test your formats in the Gaia Test Forum to make sure they look just how you want them to!!**


1. Intro & Table of Contents
2. The tool(bar)s
3. Size & Color
4. Text
5. Images
6. Put it all together
7. Examples
8. Links out, Special Thanks, Link us

For easy browsing I also put the links at the top of each post, the will open in new tabs. smile

User Image


The first step to formatting a post is to get the tool, or toolbar in this case, to make it work!

First we have
TekTek.org

And second we have
gaiARCH

TekTek's toolbar gives you the option to create 3 post styles. gaiARCH gives unlimited.
Note: If you do not want to download anything, you will have to copy-paste your code into each post you make.

User Image


Design your look.

Size is easy:
[size=number]Your text[/size]

The standard size is 12 so anything below 12 is small than norm. Like "7" and "24"

-------------------------------------------------------------------------------------

Some colors have names like:
DarkRed, Red, Orange, Brown, Yellow, Green, Olive, Cyan, Blue, DarkBlue, Indigo, Violet
(silv3rxwings has a great list of color names in her Text Color Codes guide)

You can format it by using this code:
[color=colorname]Your text in that color[/color]

I will use red as an example:
[color=red]Hello[/color]

Hello

Some colors do not have names, however, but they have a number. When you want to use a number you have to include a pound sign(#). Like this is #FF66CC
[color=#number]You text[/color]


Again an example:
[color=#88FFCC]Hey there![/color]

Hey there!

-------------------------------------------------------------------------------------
If you want to have an underline one color and your text another you use this code:
[color=colorname][u][color=colorname]whatever you type[/color][/u][/color]

The first colorname is the underline color and the second is text.

example:
[color=green][u][color=purple]Funky cool![/color][/u][/color]

Funky cool!
-------------------------------------------------------------------------------------

Here is a color chart (click to enlarge):
User Image


TekTek.org has this awesome gradient text generator that can make your text look like this:
Pretty cool huh?

It will generate a BBCode for you to copy and paste.

User Image


Now it's time to start typing! First, how do you want your post to look?

1
Twinkle Twinkle little star...

Your text

..how I wonder what you are


1:
[align=left]Whatever you want at the top, like: "Twinkle Twinkle little star..."[/align]

[align=center]Your text[/align]

[align=right]Whatever you want at the bottom, like: "...how I wonder what you are" [/align]




2
You know...

Your text

...that's just Wiggity whack!


2:
[align=right]Whatever you want at the top, like: "You know..."[/align]

[align=center]Your text[/align]

[align=left]Whatever you want at the bottom, like: "...that's just Wiggity whack" [/align]




3
Hey there!

Your text

Goodbye!



3:
[align=center][u]Hey there![/u]

Your text

[u]Goodbye![/u][/align]

User Image


Here's the fun part. Images!

Utena_Tenjou_86
if you use Imgleft and Imgright, it pushes your text to below your images when anyone using IE.


The standard image posting is this:
[img]image url[/img]

Quote:
User ImageBut you see, when you type the text aligns at the bottom. BORING!


So you want the picture to the left?
[imgleft]image url[/imgleft]


Quote:
User ImageNow it aligns to the top. If you want it to be near the center you have to hit "Enter" a few times




[IMGleft]image url[/IMGleft]




Just hitting enter a few times.

Quote:
User Image




Just hitting enter a few times.



-------------------------------------------------------------------------------------

To the right?
[imgright]image url[/imgright]

Quote:
User Image
Again at the top







Hit enter a lot to get here biggrin



-------------------------------------------------------------------------------------
You want both?
[imgleft]image url[/imgleft][imgright]image url[/imgright] [align=center]And you type here[/align]

Quote:
User ImageUser Image





And you type here.

When you have it like this I suggest centering text and entering down until you hit center.



-------------------------------------------------------------------------------------

Top and bottom?*
[align=center][img]image url[/img]

Your text

[img]image url[/img][/align]


Quote:
User Image

Hearts delight

User Image



You can add more than one image if you want. Just put another image in there
like so:

[align=center][img]image url[/img][img]image url[/img]

Your text

[img]image url[/img][img]image url[/img][/align]

You can continue to add.

Quote:
User ImageUser ImageUser Image

Hearts delight

User ImageUser ImageUser Image


*I suggest centering the text and image. having it align left looks a little strange.

User Image


You're almost there!
-------------------------------------------------------------------------------------

User Image
(FireFox Only):
TekTek Guide by xSeraphym



TekTek is more limited than gaiARCH for formatting, but it's also more simple to use. I suggest it for beginners, until you have a better grasp for post formatting. Editing TekTek formats is simple and clean, and great for beginners! You can even auto-format your posts, so you don't have to lift a finger for pretty letters.

1.) Click on the Options drop-down menu to begin.
User Image

2.) Click on Setup Options--the first option that appears with the drop-down list.
User Image

3.) A window like the one below should appear.
User Image
In the Beginning Text: text box, insert what formatting you want to go before your text. You can add size changes, imgright/imgleft, color changes, or any combination of these.
User Image

4.) In the Ending Text: text box, close all of your tags and/or insert formatting you want at the end of your post.
User Image

5.) Then, for forum posts, select a post style. Keep in mind that this won't work for anything but forum posts.
User Image

6.) Once you're done, click the "Save Changes" button, and you've set up your first formatting style!
User Image

7.) To post with your newly-created format, simply type your post like normal, and click on the "tekFormat 1" button--since that's where you edited the formatting.
User Image
User Image
_____________________________________________

AUTO-FORMATTING:

Auto-formatting with TekTek makes post-formatting so much easier--never accidentally forget to add your format again!

1.) Click on Options, then setup options. We've done this before.
User Image
User Image

2.) Once the pop-up window appears, click on the AutoFormat tab.
User Image
Each of the drop-lists indicate what kind of post you want to format automatically--they're pretty self-explanatory.
--Autoformat Forum Posts:
This option lets you pick a format for forum posts.
--Autoformat Guild Posts:
This option lets you pick a format for Guild forum posts.
--Autoformat Private Messages:
This option lets you pick a format for your privae messages. Remember that if you chose a post style for your formatting, it won't apply here.
--Autoformat Comments:
This option lets you pick a format for comments you make on journals, arenas, and profiles. Post style for formatting also doesn't work here.

3.) Let's choose Text Format 1 for Forum Posts, Guild Posts, and Private Messages. We can do Comments, too, but we don't want to spam up someone's comments with a picture, so let's leave that out.
User Image

4.) Then, click Save Changes, close the window and you're done! Your posts will now automatically format with Text Format 1 whenever you send a message. you have the option to skip autoformatting if you want, near the Preview/Submit buttons.
User Image
User Image

-------------------------------------------------------------------------------------
User Image

Click to enlarge
User Image

Step 1: Add a new style
User Image


Step 2: Pick your border and give it a name
User Image


Step3: Set as default style and have it autoformat
User Image
User Image


Step4: What you want at top
User Image
This will be any text/image you want before your text. (You can put the imgleft and imgright here)


Step5: What you want at bottom
User Image
This will be any text/image you want after your text.


Step6: Format your text
User Image
This will dictate the size, color and style (bold, underline, etc) of your text. Leave open tags like the example.


Step7: Close those tags
User Image
Close the tags that correspond with the last step.


Step8: Save it.
User Image


Step9: Ok and go!
User Image



Example

User Image

User Image
Make sure that the "Auto-format with GaiArch" is checked

User Image

User Image


Quote:
Last Night I had a dream about you...




I used TekTek's gradient text color generator for this biggrin
...In this dream I'm dancing right beside you.User Image


Quote:
User ImageUser Image









I'm using "navy" for my color and my text size is 10


Quote:
User ImageUser ImageUser ImageUser Image

Lovely~

User ImageUser ImageUser ImageUser Image
Intro & Table of Contents | The tool(bar)s | Size & Color | Text | Images | Put it all together | Examples | Links out, Special Thanks, Link us
Links will open in new tab

User Image

Gaia Test Forum - Test your toolbar out in this forum.
TekTek.org - This is a site every Gaian should know and love.
GAvSIM - "Gaia's first avatar simulation program"
Gaia Cards - A fun little card maker for your avatar.
Avatar Arena FAQs - Great resource if you're entering the Avatar Arena
User Image - Blocked by "Display Image" Settings. Click to show.


User Image

x- PantalaimoN -x xSeraphym x___s y l p h For suggesting adding images to the guide. And making the How-to for the TekTek toolbar part! (Much heart to you!)
Also thank you SO much for taking care of all the questions in this guide while I am absent <3<3

User Image


1.
User Image - Blocked by "Display Image" Settings. Click to show.
[url=http://www.gaiaonline.com/forum/gaia-guides-and-resources/a-gaian-s-basic-guide-to-post-style-formatting/t.38387255/]
[IMG]http://i31.tinypic.com/5374f6.gif[/IMG][/url]

Tiny URL version:
[url=http://tinyurl.com/2lu26a][IMG]http://i31.tinypic.com/5374f6.gif[/IMG][/url]


2.
User Image - Blocked by "Display Image" Settings. Click to show.
[url=http://www.gaiaonline.com/forum/gaia-guides-and-resources/a-gaian-s-basic-guide-to-post-style-formatting/t.38387255/]
[IMG]http://i44.tinypic.com/f3rujs.png[/IMG][/url]

Tiny URL version:
[url=http://tinyurl.com/2lu26a][IMG]http://i44.tinypic.com/f3rujs.png[/IMG][/url]
User Image - Blocked by "Display Image" Settings. Click to show.
Good guide--and it makes sense to those of us who have the toolbars, but I suggest explaining how to insert the formatting into the toolbars, because it took me a while to figure out how to do that.

Also, I would suggest explaining how to use auto-formatting. I have the TekTek toolbar, but I've never used the other one, so I don't know if it works the same way...but yeah.

This guide tells you what you need, but it doesn't really tell you how to put it in, and using the toolbars is so much easier than using the text box--especially Auto-Format.

Edit;; Oh, and the hexidecimal chart is wonderful! The closest thing I could get to one until yours was waaay smaller, so I only got a few colors, so thanks for putting a good one up. :3

Also, first post, woo~
Very organized and helpful guide.
Will helps newbies learn the basics.
:3 Urr, thanks and congrats? xD
User Image - Blocked by "Display Image" Settings. Click to show.






It's starting to look much cleaner and easier to read now that you've added some banners, I think that was a great idea. :3
The Faerie of Darkness's avatar

7,450 Points
  • Citizen 200
  • Window Shopper 100
  • Dressed Up 200
When you wish upon a falling star, your dream will come true...



Great guide! I actually used this guide for my post format! whee *using Tektek toolbar right now*



Unless it's a blazing meteor ready to destroy all Earth!
Last Night I had a dream about you...



@Niks125: XD Thank you for your input! You've instantly made my day brighter. (It's doom and gloom rainy outside)

@x- PantalaimoN -x: Banners did make it nicer looking too, huh?

@dannyluvr101: I'm so glad you found this guide useful! You are the first (to my knowledge) to have actually used it!
...In this dream I'm dancing right beside you.User Image

Quick Reply

Submit
Manage Your Items
Other Stuff
Get GCash
Offers
Get Items
More Items
Where Everyone Hangs Out
Other Community Areas
Virtual Spaces
Fun Stuff
Gaia's Games