RP Post Layout Guide & Tutorial + Sources + Codes + Tips

Do you want a...

Pic Monkey Tricks Tutorial?	13.8%	[ 120 ]
GIMP Tricks tutorial?	23.0%	[ 199 ]
Additional links to model search?	4.4%	[ 38 ]
More codes!	25.8%	[ 224 ]
POLL GOLD! YES!	33.0%	[ 286 ]
Total Votes:			[ 867 ]

[In Desolation]

THIS IS EVERYTHING YOU NEED TO KNOW ABOUT MAKING YOUR OWN POST LAYOUT. LINKS AND FREE CODES TO HELP WITH CONSTRUCTION AND EXPERIMENTS. L-SHAPE AND FRAME TUTORIALS INCLUDED. BEST VIEWED ON A BROWSER OTHER THAN FIREFOX. SCROLL DOWN TO SEE IT ALL OR...

NAVIGATION

0. List of Resources, Links To Graphics & Photo Editors

1. Code Skeletons (Reference/Resource Sheet for Intermediate and Experts)

2. Step by Step Code Construction Instructions


3. How To Crop L-Shape Post Layouts (instructions for GIMP)

4. Advanced L-Shape Post Layouts (in Pic Monkey)


5. How To Add A Realistic Picture Frame (in Pic Monkey)

6. Tektek Gradient Trick Part I and Part II

7. Three Ways to Collage in GIMP

8. How To Get Rid of White in Photoshop with Magic Eraser Tool

9. How to Code Fancy Text

10. Simplifying Header Code


11. How to Push Text Body from the Right with a Spacer

12. Collaging in GIMP What to do if your shape image isn't black and white. And where the Snap to Grid options are. Use them

13. How To Code Bookend Style Post Layouts An image on the left and an image on the right. Text in the middle

14. Free RP Thread Template It's a skeleton for creating your own RP thread. Customize with colored text and your own graphics


UPDATE 03/08 LAST PAGE ALWAYS HAS UPDATES

THE BASIC POST LAYOUT FORMAT
It gets the job done cleanly and well. Easy to customize from here. Text by default goes left. Use the ImgRight instead of regular Img and it will place your image out of the way of your text. Try it out now in a test thread!

(Best used with images that have a thin white border added around them which you can do in picmonkey with the "Frames" options)


[imgright]Insert an image link here. No spaces.[/imgright][align=right][color=charactercolor][size=15][b]NAME[/b][/size][/color]
[size=11]
Descriptive text, descriptive text, descriptive text. [color=charactercolor][b]"Character dialogue in colored bold."[/b][/color] Some sort of text going on here. [color=charactercolor][i]Thoughts in colored italics.[/i][/color] Descriptive text, descriptive text, descriptive text.
[/size]
[size=9]WWWHW: Who, what, where, how, why?
OOC: Blank.
[/size]

*Scroll all the way down in this thread for more premade code sets AND A SMALL TUTORIAL on how to construct an L-Shape Corner Graphic

Become an affiliate! Post to inquire with link to where. You link to me. I'll link to you!

[url=http://www.gaiaonline.com/forum/gaia-guides-and-resources/rp-post-layout-guide-tutorial-sources-codes-tips/t.88997643/][img]http://i1070.photobucket.com/albums/u485/doublefrappuccino/rppostlayoutguide_zpswzsor15z.png[/img][/url]

[In Desolation]

THE BASIC STEPS FOR CODING DO NOT SKIP READING ANYTHING

1. Get a graphic(s). Do edits as needed. Upload to an Image Host like ImgShack, Photobucket, or TinyPic
2. Select and Copy the Direct Link provided by preferred Image Host. Paste into the message box
3. If you hate complexity. Paste image link, select, and hit Gaia's ImgRight button. Or do it manually and type the [] and [/] out. Paste the link inbetween

[imgright]http://DirectLinkHereNoSpacesDoNotDoubleHttp[/imgright]

4. Then you can start typing. Message is automatically left aligned so it won't overcrowd a right aligned image

5. If you want more. Then after you have the image link. Figure out if you want ImgLeft or Align=Center

Center Coding looks like this

[align=center][img]http://DirectLinkHereNoSpacesDoNotDoubleHttp[/img][/align]

ImgLeft Coding looks like this

[imgleft]http://DirectLinkHereNoSpacesDoNotDoubleHttp[/imgleft]

6. You start with one of the above. Then you Copy/Paste a number of List codes [] and an equal number of end List Codes [/]. Takes experimenting to find out how many you need.

For every 100px the Img Width is then you need ten Lists. If you have an Img that is 300px in width then you need about thirty to thirty-one Lists

Altogether. Thirty to thirty-one List [] codes and thirty to thirty-one End List Codes [/]. About sixty to sixty-two

Looks like for Left

[imgleft]http://DirectLinkHereNoSpacesDoNotDoubleHttp[/imgleft][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list]



[/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list]

You'll find out that it's more necessary for Left to know how many you need. For Center you can put as many or as little as you want. The example below has a few

Looks like for Center

[align=center][img]http://DirectLinkHereNoSpacesDoNotDoubleHttp[/img][/align][list][list][list][list][list]



[/list][/list][/list][/list][/list]

7. Text next. It goes between the List codes. For good previews especially if you own a shop you need a substantial amount of preview text. For this example we'll skip it (but I have provided Lorem Ipsum in this thread)

Looks like for Left

[imgleft]http://DirectLinkHereNoSpacesDoNotDoubleHttp[/imgleft][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list]

[size=11]Descriptive text. [color=TYPEACOLORNAMEHERE][b]"Colored Speech."[/b][/color] More descriptive text. [color=TYPESECONDARYCOLORHERE][i]Thoughts.[/i][/color][/size]

[/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list]

Looks like for Center

[align=center][img]http://DirectLinkHereNoSpacesDoNotDoubleHttp[/img][/align][list][list][list][list][list]

[size=11]Descriptive text. [color=TYPEACOLORNAMEHERE][b]"Colored Speech."[/b][/color] More descriptive text. [color=TYPESECONDARYCOLORHERE][i]Thoughts.[/i][/color][/size]

[/list][/list][/list][/list][/list]

Most RP rules indicate that speech must be in bold. Thus the Bold [] codes around the dialogue. Thoughts are always in Italic [] codes

8. Last step is footer. Paste above end List [/] codes. Not every RP has them. Most of them want it though. For summary and extra Info. Or shorthand OOC

Looks like for Left

[imgleft]http://DirectLinkHereNoSpacesDoNotDoubleHttp[/imgleft][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list]

[size=11]Descriptive text. [color=TYPEACOLORNAMEHERE][b]"Colored Speech."[/b][/color] More descriptive text. [color=TYPESECONDARYCOLORHERE][i]Thoughts.[/i][/color][/size]

[size=9]LOCATION:
COMPANY:
OOC:[/size]

[/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list]

Looks like for Center

[align=center][img]http://DirectLinkHereNoSpacesDoNotDoubleHttp[/img][/align][list][list][list][list][list]

[size=11]Descriptive text. [color=TYPEACOLORNAMEHERE][b]"Colored Speech."[/b][/color] More descriptive text. [color=TYPESECONDARYCOLORHERE][i]Thoughts.[/i][/color][/size]

[size=9]LOCATION:
COMPANY:
OOC:[/size]

[/list][/list][/list][/list][/list]

Footers are usually smaller then the Body Text. That's not the rule. Literate RP never uses Body Text sizes bigger than 11. Generally that's how it works

EXAMPLES PROVIDED BOTTOM OF PAGE.
LIST CODES, BODY TEXT RESOURCES, AND FOOTER RESOURCES

NOTES ABOUT CONSTRUCTING L-SHAPE CODE

Link to the L-Shape Cropping Tutorials

I always dissect a whole image into a top ledge and a left corner support. Top and bottom. You'll notice that some people's post layouts don't line up on your browser especially if you're looking at it from a browser that isn't on Fullscreen mode.

They have a flawed code involving a left half and right half of the image that probably looks like this

[imgleft]http://[/imgleft][img]http://[/img]

To make the L-Shape line up on all browsers and all monitors the code must look like this

[align=left][img]http://TOPIMAGELINK[/img][/align][imgleft]http://CORNERSUPPORTLINK[/imgleft]

Plain image codes without alignment or left or right directions are free to float because their position isn't fixed. If you try to make them both ImgLeft that won't work either and they'll compete with each other for the same space

Listing codes can go before the Top Image ledge or after the supporting Bottom Image.

Putting the Listing codes before pushes everything together to the right.

[list][list][list][list][align=left][img]http://TOPIMAGELINK[/img][/align][imgleft]http://CORNERSUPPORTLINK[/imgleft][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list]

[/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list]

Four listing codes. Image codes. Then more listing codes. Altogether this one has twenty-four list codes and twenty-four end list codes

Putting the listing codes after the Bottom Image pushes only the Text body.

[align=left][img]http://TOPIMAGELINK[/img][/align][imgleft]http://CORNERSUPPORTLINK[/imgleft][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list]
"TEXT BODY HERE."
[/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list]

I don't recommend putting more than four to five listing codes before the Top Image ledge because you risk pushing the images too far and they'll cut off.

Remember, one listing code equals ten pixels. That's my rough estimate. If your supporting Bottom Image is 200 in width then you need a minimum of twenty to twenty-one list codes to place the text body perfectly along side it

[In Desolation]

USEFUL RESOURCES FOR PICTURES


FOR EDITING, CROPPING, and RESIZING. (In order of usefulness). ALWAYS BORDER POSTING PICTURE WITH THIN WHITE BORDER IF YOU DON'T LIST
PicMonkey In browser. It also has a Google Chrome app.
pixlr.com There is a mobile app version of pixlr you can find and utilize if you are working from a mobile gadget.
pixlr Express In browser. Very fast. Nice frames.
EZIMBA Quick fast easy image editor and converter
Canva
PsykoPaint
Thumba
PhotoCat. It's OK.
BeFunky has great frames. Mess with Blend Modes is a must.
PiZap is slow, interface is ugly, but collage capabilities are acceptable and fancy.

PIXENATE also has ugly interface. Fun Effects are mildly useful. Would not use. CITRIFY is so basic that it's crap. Phixr and LUNAPIC good for memes. Maybe. Nothing else.

GIMP For those with your own computer but no programs.
Tricks with layering? Multiply, overlay, addition, and screen.
GIMP is trustworthy. It was made by nerds. Nerds like me...
There is also a quick fixer available on photoshop.com (in their Online Tools menu drop) and the free Aviary app. If I haven't listed something here. It's because I don't trust it... I tried iPiccy and Ribbet. I didn't like them.

FOR DRAWING
If you don't have photoshop and hate GIMP. These are the other free options
firealpaca
krita
Artweaver Scroll down to find free version.

FOR FINDING EVER WONDER WHERE THOSE COOL PICS IN BARTON TOWN COME FROM? LOOK NO FURTHER THAN HERE
lookbook.nu Regular people who want to be... looked at.
Chictopia Like lookbook but differently formatted
NEXT MANAGEMENT Modeling agency. A big one. Just pick a city. Select models. Select gender to browse
PhotoGenics Modeling Agency Professionals. Click on models to view men or women. You can always google "modeling agency" and find more of these portfolio sites.*
pixiv.com For Japanese anime. Customize the picture for use though. (Customize everything. Even real pictures).
morguefile.com Free stock photos. For miscellaneous purposes.
Getty Images Royalty free stock images for building graphics. Collages. Things for your RP thread

*Another way to get pictures and various images from the same model is to simply pick a fashion line like Gucci or Burberry. And type into the search engine "Gucci collection" or "Gucci ad campaign". You can literally type in "Burberry model" and find a face. Too many people use actors and actresses

STORAGE DO YOU REALLY NEED HELP FINDING THESE? I'LL LIST THEM ANYWAY
Photobucket
Photobucket Mobile
Imgshack
Imgshack Mobile
tinypic.com Good site for slow computers.
flickr, Picasa, and imgur are your other alternatives.
I don't recommend Snapfish.
If you use anything other than photobucket, to view them requires selecting "show all images" in account preferences' image display settings.

FOR SHORTENING AN EXCESSIVELY LONG PIC URL NECESSARY FOR SIGNATURES SOMETIMES
tinyurl
bit.ly

NOTE: If Gaia is centered, the maximum width for images without page distortion is about 600 pixels.
It can go as wide as 700 pixels but it might break the post border if you're using a Post Style other than the default "Say".

USEFUL FOR TEXT AND SYMBOL DESIGN CREATION

Fuzzimo's Label Maker If you're tired of plain font this place makes label stickers
TEXT GEN EDITOR Fancy lettering made by symbols you can copy paste

FOR COLORS AND THINGS
colourlovers for premade palettes. This one is excellent. Perfectly good for all sorts of graphic making.
bighugelabs for making your own palette from a picture.
UTCCG is a thread of just about every shade for every color you could possibly want.
Adobe Kuler
Colourcode
Collor
Colors Palette Generator
Pictaculous
Web Color Data

FOR NAME GRAPHICS
FontMeme.com Try it. It's easy. No download required. In browser.

BannerFans.com is a pretty useful label, title, and... banner maker.

FOR FLIPPING PLAIN TEXT ONLY
Reverse Text Generator Makes things backwards.

FOR MAKING IT UPSIDE DOWN PLAIN TEXT ONLY
Upside down word generator Enter and copy paste.

FOR SHORT TEXT GRADIENT (RAINBOW GEN) PLAIN TEXT ONLY
http://www.tektek.org/color/

http://www.wordcounter.net/ Best word counter. To check length.

QUICK TIP FOR POSTING FROM MOBILE DEVICES If you have little to no access to a computer, make your first post via a computer.
Then when you are on your mobile device, hit the quote button (beware of hitting edit on accident).
Delete the quotes (and the spoiler if applicable, if the GM stores your post layout somewhere in the thread itself) brackets and you'll be ready to go in style.

[In Desolation]

TIP SHEET

Q: How big can my image(s) be?

A: For best results without incurring the wrath of Gaia and various browsers on different monitors. Do NOT use wallpaper as your post layout image. Or the graphic for your RP. Or Guild

Why? Think about it. Bigger images load slower. I personally never use anything wider than 700px. If you absolutely have to the maximum width is 1000px since the majority of screen resolutions is around 1200. Height depends on how many images you want to use. For L-Shapes I wouldn't make a Top Img's height bigger than 500px. 300 - 350px is best.

Q: How many images can I have?

A: Max four (Up, Left, Right, Bottom). If you plan on having four then it's either a white ImgRight or a white ImgLeft. A blank, all white ImgRight is commonly used for pushing Body Text towards the left. Because there is no list code for pushing it to the left

That's for advanced users. If you're not going for that. For best results don't go beyond using two images (Top image & ImgLeft Side Bar, or L-Shape)

The use of a third image is usually for a fancy footer. It's your choice to have that. If you do. Make the height no bigger than 200px

The more images you have. The slower they load. If you want to decrease your chances of browser crash during a huge post Preview then keep things simple. You have to realize that below the message box when you reply is everyone else's previous posts including yours. Those Images will add up

Q: Why are my Images coming out pixelated when I save? How do I prevent this?

A: Easiest solution is to save it as a .PNG and to never trust .JPGs again.

The latter format is smaller and this compactness is attractive. If you still want .JPGs you have to pay attention to things like slider bars, Options, and Quality.

In Pic Monkey, saving gives you three options for .JPGs : Roger, Pierce, and Sean. ALWAYS PICK SEAN

In Pixlr Express it gives you a Quality Slider Bar you must drag to 100 because the default is 85

[In Desolation]

EXAMPLE

Text. "Lorem ipsum dolor sit amet, consectetur adipiscing elit." Vivamus sem sem, lobortis eget sollicitudin id, sollicitudin eu elit. Vestibulum in elit nunc, ultricies consequat felis. Vivamus eu dolor id tortor interdum pharetra et a libero. In sit amet est nibh, quis molestie risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius augue mi. Mauris eu lectus et nibh facilisis mattis eget et leo. Ut pharetra tortor sit amet nulla egestas semper. Praesent ac enim urna, in consectetur libero. Praesent semper purus ut mi cursus euismod. Aliquam aliquam, magna sit amet feugiat bibendum, massa libero gravida est, non mollis massa quam nec ipsum. Nam sollicitudin pretium tincidunt. Suspendisse quis nibh velit, nec congue risus. Aliquam erat volutpat. Integer et lacus lectus.

Text. "Lorem ipsum dolor sit amet, consectetur adipiscing elit." Vivamus sem sem, lobortis eget sollicitudin id, sollicitudin eu elit. Vestibulum in elit nunc, ultricies consequat felis. Vivamus eu dolor id tortor interdum pharetra et a libero. In sit amet est nibh, quis molestie risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius augue mi. Mauris eu lectus et nibh facilisis mattis eget et leo. Ut pharetra tortor sit amet nulla egestas semper. Praesent ac enim urna, in consectetur libero. Praesent semper purus ut mi cursus euismod. Aliquam aliquam, magna sit amet feugiat bibendum, massa libero gravida est, non mollis massa quam nec ipsum. Nam sollicitudin pretium tincidunt. Suspendisse quis nibh velit, nec congue risus. Aliquam erat volutpat. Integer et lacus lectus.

Text. "Lorem ipsum dolor sit amet, consectetur adipiscing elit." Vivamus sem sem, lobortis eget sollicitudin id, sollicitudin eu elit. Vestibulum in elit nunc, ultricies consequat felis. Vivamus eu dolor id tortor interdum pharetra et a libero. In sit amet est nibh, quis molestie risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius augue mi. Mauris eu lectus et nibh facilisis mattis eget et leo. Ut pharetra tortor sit amet nulla egestas semper. Praesent ac enim urna, in consectetur libero. Praesent semper purus ut mi cursus euismod. Aliquam aliquam, magna sit amet feugiat bibendum, massa libero gravida est, non mollis massa quam nec ipsum. Nam sollicitudin pretium tincidunt. Suspendisse quis nibh velit, nec congue risus. Aliquam erat volutpat. Integer et lacus lectus.

Text. "Lorem ipsum dolor sit amet, consectetur adipiscing elit." Vivamus sem sem, lobortis eget sollicitudin id, sollicitudin eu elit. Vestibulum in elit nunc, ultricies consequat felis. Vivamus eu dolor id tortor interdum pharetra et a libero. In sit amet est nibh, quis molestie risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius augue mi. Mauris eu lectus et nibh facilisis mattis eget et leo. Ut pharetra tortor sit amet nulla egestas semper. Praesent ac enim urna, in consectetur libero. Praesent semper purus ut mi cursus euismod. Aliquam aliquam, magna sit amet feugiat bibendum, massa libero gravida est, non mollis massa quam nec ipsum. Nam sollicitudin pretium tincidunt. Suspendisse quis nibh velit, nec congue risus. Aliquam erat volutpat. Integer et lacus lectus.

Text. "Lorem ipsum dolor sit amet, consectetur adipiscing elit." Vivamus sem sem, lobortis eget sollicitudin id, sollicitudin eu elit. Vestibulum in elit nunc, ultricies consequat felis. Vivamus eu dolor id tortor interdum pharetra et a libero. In sit amet est nibh, quis molestie risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius augue mi. Mauris eu lectus et nibh facilisis mattis eget et leo. Ut pharetra tortor sit amet nulla egestas semper. Praesent ac enim urna, in consectetur libero. Praesent semper purus ut mi cursus euismod. Aliquam aliquam, magna sit amet feugiat bibendum, massa libero gravida est, non mollis massa quam nec ipsum. Nam sollicitudin pretium tincidunt. Suspendisse quis nibh velit, nec congue risus. Aliquam erat volutpat. Integer et lacus lectus.


♪ LOCATION [The listing doesn't show up in previews. ]
♫ COMPANY [The list brackets have to be in equal number or it won't work.]
♪ OOC [Below is what the code for this looks like.]


[imgleft]http://i43.tinypic.com/dz1n8.jpg[/imgleft]
[list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][size=24][b]EXAMPLE[/b][/size]
[size=11]
Text. [color=blue][b]"Lorem ipsum dolor sit amet, consectetur adipiscing elit."[/b][/color] Vivamus sem sem, lobortis eget sollicitudin id, sollicitudin eu elit. Vestibulum in elit nunc, ultricies consequat felis. [color=red][i]Vivamus eu dolor id tortor interdum pharetra et a libero. [/i][/color]In sit amet est nibh, quis molestie risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius augue mi. Mauris eu lectus et nibh facilisis mattis eget et leo. Ut pharetra tortor sit amet nulla egestas semper. Praesent ac enim urna, in consectetur libero. Praesent semper purus ut mi cursus euismod. Aliquam aliquam, magna sit amet feugiat bibendum, massa libero gravida est, non mollis massa quam nec ipsum. Nam sollicitudin pretium tincidunt. Suspendisse quis nibh velit, nec congue risus. Aliquam erat volutpat. Integer et lacus lectus.

This was constructed using the building blocks from above.
[/size]

[size=18]♪[/size][size=9] LOCATION [The listing doesn't show up in previews. ][/size]
[size=18]♫[/size][size=9] COMPANY [The list brackets have to be in equal number or it won't work.][/size]
[size=18]♪[/size][size=9] OOC [Below is what the code for this looks like.][/size]
[/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list]

[In Desolation]

EXAMPLE FOR CENTER ALIGNMENT


Text. "Lorem ipsum dolor sit amet, consectetur adipiscing elit." Vivamus sem sem, lobortis eget sollicitudin id, sollicitudin eu elit. Vestibulum in elit nunc, ultricies consequat felis. Vivamus eu dolor id tortor interdum pharetra et a libero. In sit amet est nibh, quis molestie risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius augue mi. Mauris eu lectus et nibh facilisis mattis eget et leo. Ut pharetra tortor sit amet nulla egestas semper. Praesent ac enim urna, in consectetur libero. Praesent semper purus ut mi cursus euismod. Aliquam aliquam, magna sit amet feugiat bibendum, massa libero gravida est, non mollis massa quam nec ipsum. Nam sollicitudin pretium tincidunt. Suspendisse quis nibh velit, nec congue risus. Aliquam erat volutpat. Integer et lacus lectus.

No. Listing margins don't work for putting in a wide right margin. There are tricks, but they involve using a white image as a spacer. I like to keep it simple. Let's just do that

☆ WHERE WHO [x]
☆ WHAT NOW [x]
☆ OOC [This is how.]


[list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][align=center][img]http://i43.tinypic.com/dz1n8.jpg[/img][/align]
[align=center][size=18][color=blue][b]IT WORKS FOR CENTERED IMAGES TOO[/b][/color][/size][/align]
[size=11]
Text. [color=darkblue][b]"Lorem ipsum dolor sit amet, consectetur adipiscing elit."[/b][/color] Vivamus sem sem, lobortis eget sollicitudin id, sollicitudin eu elit. Vestibulum in elit nunc, ultricies consequat felis. [color=blue][i]Vivamus eu dolor id tortor interdum pharetra et a libero. [/i][/color]In sit amet est nibh, quis molestie risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius augue mi. Mauris eu lectus et nibh facilisis mattis eget et leo. Ut pharetra tortor sit amet nulla egestas semper. Praesent ac enim urna, in consectetur libero. Praesent semper purus ut mi cursus euismod. Aliquam aliquam, magna sit amet feugiat bibendum, massa libero gravida est, non mollis massa quam nec ipsum. Nam sollicitudin pretium tincidunt. Suspendisse quis nibh velit, nec congue risus. Aliquam erat volutpat. Integer et lacus lectus.

No. Listing margins don't work for putting in a wide right margin. There are tricks, but they involve using a white image as a spacer. I like to keep it simple. Let's just do that

[/size]
[size=13][color=blue]☆[/color][/size][size=9] WHERE WHO [color=purple][x][/color][/size]
[size=13][color=darkblue]☆[/color][/size][size=9] WHAT NOW [color=purple][x][/color][/size]
[size=13][color=blue]☆[/color][/size][size=9] OOC [color=darkblue][This is how.][/color][/size][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list]

[In Desolation]

CONSTRUCTION CODE SHEET WITH FOOTER AND COLOR PREVIEWS

THIS IS THE AVERAGE AMOUNT OF LISTS YOU NEED TO MARGIN THE TEXT BODY WHICH GOES HERE WHERE THIS INSTRUCTION IS. DEPENDING ON HOW WIDE YOUR IMG IS YOU MAY NEED MORE OR LESS BUT MAKE SURE TOP NUMBER OF [ list] CODES ARE EQUAL TO BOTTOM NUMBER OF [ / list] CODES.

HOW BIG SHOULD THE WIDTH OF AN IMAGE OR A BOTTOM CORNER BE? MY PREFERENCE IS 300 - 350px in WIDTH.

[list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list][list]
THIS IS THE AVERAGE AMOUNT OF LISTS YOU NEED TO MARGIN THE TEXT BODY WHICH GOES HERE WHERE THIS INSTRUCTION IS.
[/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list][/list]

STUFFING JUNK (ADD TEXT COLORS THYSELF).

[size=10]
Text. [color=color1][b]"Lorem ipsum dolor sit amet, consectetur adipiscing elit."[/b][/color] Vivamus sem sem, lobortis eget sollicitudin id, sollicitudin eu elit. Vestibulum in elit nunc, ultricies consequat felis. [color=color2][i]Vivamus eu dolor id tortor interdum pharetra et a libero. [/i][/color]In sit amet est nibh, quis molestie risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius augue mi. Mauris eu lectus et nibh facilisis mattis eget et leo. Ut pharetra tortor sit amet nulla egestas semper. Praesent ac enim urna, in consectetur libero. Praesent semper purus ut mi cursus euismod. Aliquam aliquam, magna sit amet feugiat bibendum, massa libero gravida est, non mollis massa quam nec ipsum. Nam sollicitudin pretium tincidunt. Suspendisse quis nibh velit, nec congue risus. Aliquam erat volutpat. Integer et lacus lectus.

Text. [color=color1][b]"Lorem ipsum dolor sit amet, consectetur adipiscing elit."[/b][/color] Vivamus sem sem, lobortis eget sollicitudin id, sollicitudin eu elit. Vestibulum in elit nunc, ultricies consequat felis. [color=color2][i]Vivamus eu dolor id tortor interdum pharetra et a libero. [/i][/color]In sit amet est nibh, quis molestie risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius augue mi. Mauris eu lectus et nibh facilisis mattis eget et leo. Ut pharetra tortor sit amet nulla egestas semper. Praesent ac enim urna, in consectetur libero. Praesent semper purus ut mi cursus euismod. Aliquam aliquam, magna sit amet feugiat bibendum, massa libero gravida est, non mollis massa quam nec ipsum. Nam sollicitudin pretium tincidunt. Suspendisse quis nibh velit, nec congue risus. Aliquam erat volutpat. Integer et lacus lectus.

Text. [color=color1][b]"Lorem ipsum dolor sit amet, consectetur adipiscing elit."[/b][/color] Vivamus sem sem, lobortis eget sollicitudin id, sollicitudin eu elit. Vestibulum in elit nunc, ultricies consequat felis. [color=color2][i]Vivamus eu dolor id tortor interdum pharetra et a libero. [/i][/color]In sit amet est nibh, quis molestie risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius augue mi. Mauris eu lectus et nibh facilisis mattis eget et leo. Ut pharetra tortor sit amet nulla egestas semper. Praesent ac enim urna, in consectetur libero. Praesent semper purus ut mi cursus euismod. Aliquam aliquam, magna sit amet feugiat bibendum, massa libero gravida est, non mollis massa quam nec ipsum. Nam sollicitudin pretium tincidunt. Suspendisse quis nibh velit, nec congue risus. Aliquam erat volutpat. Integer et lacus lectus.
[/size]

FOOTNOTE JUNK (ADD COLORS OR MAKE SLIGHT CHANGES THYSELF)

✈ WHERE [x]
☻ WITH WHO[x]
☎ OOC [x]

☀ WWWW&H [x]
☁ MOOD[x]
☂ OOC [x]

★ WHERE WHO [x]
☆ WHAT NOW[x]
★ OOC [x]

♠ WHERE WHO [x]
♣ WHAT NOW[x]
♦ OOC [x]

♪ LOCATION [x]
♫ COMPANY [x]
♩ OOC [x]

☺ WHERE WHO [x]
☻ WHAT NOW [x]
☺ OOC NOTES [x]

♔ LOCATION →
♕ COMPANY →
♖ SONG →
♘ OUTFIT →
♙ OOC →

♚ LOCATION →
♛ COMPANY →
♜ SONG →
♞ OUTFIT →
♟ OOC →

[size=18]✈[/size][size=9] WHERE [x][/size]
[size=18]☻[/size][size=9] WITH WHO[x][/size]
[size=18]☎[/size][size=9] OOC [x][/size]

[size=18]☀[/size][size=9] WWWW&H [x][/size]
[size=18]☁[/size][size=9] MOOD[x][/size]
[size=18]☂[/size][size=9] OOC [x][/size]

[size=18]★[/size][size=9] WHERE WHO [x][/size]
[size=18]☆[/size][size=9] WHAT NOW[x][/size]
[size=18]★[/size][size=9] OOC [x][/size]

[size=18]♠[/size][size=9] WHERE WHO [x][/size]
[size=18]♣[/size][size=9] WHAT NOW[x][/size]
[size=18]♦[/size][size=9] OOC [x][/size]

[size=18]♪[/size][size=9] LOCATION [x][/size]
[size=18]♫[/size][size=9] COMPANY [x][/size]
[size=18]♩[/size][size=9] OOC [x][/size]

[size=18]☺[/size][size=9] WHERE WHO [x][/size]
[size=18]☻[/size][size=9] WHAT NOW [x][/size]
[size=18]☺[/size][size=9] OOC NOTES [x][/size]

♔ [size=9]LOCATION → [/size]
♕ [size=9]COMPANY → [/size]
♖ [size=9]SONG → [/size]
♘ [size=9]OUTFIT → [/size]
♙ [size=9]OOC → [/size]

♚ [size=9]LOCATION → [/size]
♛ [size=9]COMPANY → [/size]
♜ [size=9]SONG → [/size]
♞ [size=9]OUTFIT → [/size]
♟ [size=9]OOC → [/size]

FLAT FOOTERS Tired of the chunk? Want more compact look? OK

↳ OOC [ ... ] ↳ WHERE [ ... ] ↳ WITH [ ... ]

[size=9]↳ OOC [[color=color1] ... [/color]] ↳ WHERE [[color=color2] ... [/color]] ↳ WITH [[color=color3] ... [/color]][/size]

You've seen Barton. How these work. Same location as my classic stacked footers in the Code Index. Or place them at the top of your Text Body. Center Align optional.

You could make your own. Or copy paste some from me while you're here

↘ OOC [ .. .] ↘ LOCALE [ ... ] ↘ COMPANY [ ... ]

[size=9]↘ OOC [[color=color1] .. .[/color]] ↘ LOCALE [[color=color2] ... [/color]] ↘ COMPANY [[color=color3] ... [/color]][/size]

My preference for customizing these is with arrows but you can use other symbols

→ ↦ ⇉ ↪ ↳ ↱ ↬ ↠ ↣ ↝ ⇥ ⇝ ⇒ ⇢ ⇨ ➸ ☛ ☞
← ⇇ ↜ ↞ ↢ ↤ ↩ ↫ ↰ ↲ ↵ ⇤ ⇦ ⇐ ⇜ ⇠ ☚ ☜
↥ ↑ ⇈ ⇑⇡↟⇧ ☝ ↧ ↓ ↡ ↴ ⇊ ⇓ ⇣ ⇩ ☟ ↖ ⇖ ↸ ↗ ⇗ ✐
↘ ☈ ✎ ☇ ⇘ ⇙ ↙ ↶ ↷ ↻ ↺

The thing about flat footers (sometimes used as header to Text Body) is that the longer they are then the more likely they will bump into the next row of text. Keep them short. Fewer accidents.

If you don't mind them going before the Images then you can put them in first. Before all of the lists

FOOTER STUFFING (ADVICE)

I see Polyvore links in footers. All the time. I never click. I hover. If you're part of the culture who does. I should give you advice on the best way to use it. Without wasting your time

When to use Polyvore link:
1. When the model face in your profile and post layout are almost naked
2. When the model face in your profile and post layout are wearing something plain. Normcore

Wasting time? Hours. In looking for photos of models wearing clothes appropriate for the RP. Days. Searching for. Haute couture. Grungy? Classy? But then you post a link to what they're wearing?

Don't care about what they're wearing in the picture if you're going to post the Polyvore link. Crop the face out. Close up. Pop it in your layout. Decorate it with abstract patterns. Text. Lyrics. Then use the link in your footer

♚ LOCATION →
♛ COMPANY →
♜ SONG →
♞ OUTFIT → Stain magnet
♟ OOC →

If you like spending hours searching for an outfitted model. And hours collecting clothes on Polyvore. Don't mind me. It's cool. Just saying. It makes perfect sense when your model is shirtless. Or wearing only a shirt. Especially when you like their face but everything else about the photo they're in is wrong and you wish that you could use only their face

HIT SPOILER BUTTON TO SEE ALL THE COLORS THAT CAN BE USED WITHOUT USING HEX NUMBER

[color=TYPECOLORNAMEHERENOSPACES]TEST THIS OUT.[/color]

WHAT FONT 11 BOLD, NORMAL, AND ITALIC LOOK LIKE AND IF THEY'RE VISIBLE TO YOU OR NOT

pink, lightpink, palevioletred, hotpink, deeppink, red, tomato, crimson, firebrick, indianred

darkred, maroon, brown, sienna, saddlebrown, rosybrown, tan, darkkhaki, BurlyWood, chocolate, peru, darkgoldenrod, lightcoral, coral, lightsalmon, salmon, darksalmon, orangered, darkorange, orange, sandybrown, goldenrod, khaki, gold, yellow

greenyellow, lightgreen, lawngreen, chartreuse, lime, springgreen, mediumspringgreen,
limegreen, green, forestgreen, darkgreen,
seagreen, mediumseagreen, darkseagreen,
olive, olivedrab, darkolivegreen

azure, aliceblue, lightcyan, paleturquoise, lightblue, lightsteelblue, powderblue, cyan, aqua, aquamarine, turquoise, lightskyblue, skyblue, mediumaquamarine,
mediumturquoise, darkturquoise, deepskyblue, cadetblue, cornflowerblue, steelblue, slateblue, mediumslateblue,royalblue, dodgerblue, lightseagreen, teal,darkcyan, blue, mediumblue,darkslateblue, navy, darkblue, midnightblue

indigo, blueviolet, mediumpurple, mediumorchid, purple, darkmagenta, darkviolet, darkorchid, lavender, thistle, plum, violet, orchid, magenta, fuchsia, mediumvioletred

darkslategray, dimgray, gray, slategray, darkgray, silver

pink, lightpink, palevioletred, hotpink, deeppink, red, tomato, crimson, firebrick, indianred
darkred, maroon, brown, sienna, saddlebrown, rosybrown, tan, darkkhaki, BurlyWood, chocolate, peru, darkgoldenrod lightcoral, coral, lightsalmon, salmon, darksalmon, orangered, darkorange, orange, sandybrown, goldenrod, khaki, gold, yellow

greenyellow, lightgreen, lawngreen, chartreuse, lime, springgreen, mediumspringgreen,
limegreen, green, forestgreen, darkgreen,
seagreen, mediumseagreen, darkseagreen,
olive, olivedrab, darkolivegreen

azure, aliceblue, lightcyan, paleturquoise, lightblue, lightsteelblue, powderblue, cyan, aqua, aquamarine, turquoise, lightskyblue, skyblue, mediumaquamarine,
mediumturquoise, darkturquoise, deepskyblue, cadetblue, cornflowerblue, steelblue, slateblue, mediumslateblue,royalblue, dodgerblue, lightseagreen, teal,darkcyan, blue, mediumblue,darkslateblue, navy, darkblue, midnightblue

indigo, blueviolet, mediumpurple, mediumorchid, purple, darkmagenta, darkviolet, darkorchid, lavender, thistle, plum, violet, orchid, magenta, fuchsia, mediumvioletred

darkslategray, dimgray, gray, slategray, darkgray, silver

pink, lightpink, palevioletred, hotpink, deeppink, red, tomato, crimson, firebrick, indianred
darkred, maroon, brown, sienna, saddlebrown, rosybrown, tan, darkkhaki, BurlyWood, chocolate, peru, darkgoldenrod
lightcoral, coral, lightsalmon, salmon, darksalmon, orangered, darkorange, orange, sandybrown, goldenrod, khaki, gold, yellow

greenyellow, lightgreen, lawngreen, chartreuse, lime, springgreen, mediumspringgreen,
limegreen, green, forestgreen, darkgreen,
seagreen, mediumseagreen, darkseagreen,
olive, olivedrab, darkolivegreen

azure, aliceblue, lightcyan, paleturquoise, lightblue, lightsteelblue, powderblue, cyan, aqua, aquamarine, turquoise, lightskyblue, skyblue, mediumaquamarine,
mediumturquoise, darkturquoise, deepskyblue, cadetblue, cornflowerblue, steelblue, slateblue, mediumslateblue,royalblue, dodgerblue, lightseagreen, teal,darkcyan, blue, mediumblue,darkslateblue, navy, darkblue, midnightblue

indigo, blueviolet, mediumpurple, mediumorchid, purple, darkmagenta, darkviolet, darkorchid, lavender, thistle, plum, violet, orchid, magenta, fuchsia, mediumvioletred

darkslategray, dimgray, gray, slategray, darkgray, silver

FONT 10 BOLD, NORMAL, AND ITALIC LOOK LIKE AND IF THEY'RE VISIBLE TO YOU OR NOT

pink, lightpink, palevioletred, hotpink, deeppink, red, tomato, crimson, firebrick, indianred

darkred, maroon, brown, sienna, saddlebrown, rosybrown, tan, darkkhaki, BurlyWood, chocolate, peru, darkgoldenrod, lightcoral, coral, lightsalmon, salmon, darksalmon, orangered, darkorange, orange, sandybrown, goldenrod, khaki, gold, yellow

greenyellow, lightgreen, lawngreen, chartreuse, lime, springgreen, mediumspringgreen,
limegreen, green, forestgreen, darkgreen,
seagreen, mediumseagreen, darkseagreen,
olive, olivedrab, darkolivegreen

azure, aliceblue, lightcyan, paleturquoise, lightblue, lightsteelblue, powderblue, cyan, aqua, aquamarine, turquoise, lightskyblue, skyblue, mediumaquamarine,
mediumturquoise, darkturquoise, deepskyblue, cadetblue, cornflowerblue, steelblue, slateblue, mediumslateblue,royalblue, dodgerblue, lightseagreen, teal,darkcyan, blue, mediumblue,darkslateblue, navy, darkblue, midnightblue

indigo, blueviolet, mediumpurple, mediumorchid, purple, darkmagenta, darkviolet, darkorchid, lavender, thistle, plum, violet, orchid, magenta, fuchsia, mediumvioletred

darkslategray, dimgray, gray, slategray, darkgray, silver

pink, lightpink, palevioletred, hotpink, deeppink, red, tomato, crimson, firebrick, indianred
darkred, maroon, brown, sienna, saddlebrown, rosybrown, tan, darkkhaki, BurlyWood, chocolate, peru, darkgoldenrod lightcoral, coral, lightsalmon, salmon, darksalmon, orangered, darkorange, orange, sandybrown, goldenrod, khaki, gold, yellow

greenyellow, lightgreen, lawngreen, chartreuse, lime, springgreen, mediumspringgreen,
limegreen, green, forestgreen, darkgreen,
seagreen, mediumseagreen, darkseagreen,
olive, olivedrab, darkolivegreen

azure, aliceblue, lightcyan, paleturquoise, lightblue, lightsteelblue, powderblue, cyan, aqua, aquamarine, turquoise, lightskyblue, skyblue, mediumaquamarine,
mediumturquoise, darkturquoise, deepskyblue, cadetblue, cornflowerblue, steelblue, slateblue, mediumslateblue,royalblue, dodgerblue, lightseagreen, teal,darkcyan, blue, mediumblue,darkslateblue, navy, darkblue, midnightblue

indigo, blueviolet, mediumpurple, mediumorchid, purple, darkmagenta, darkviolet, darkorchid, lavender, thistle, plum, violet, orchid, magenta, fuchsia, mediumvioletred

darkslategray, dimgray, gray, slategray, darkgray, silver

pink, lightpink, palevioletred, hotpink, deeppink, red, tomato, crimson, firebrick, indianred
darkred, maroon, brown, sienna, saddlebrown, rosybrown, tan, darkkhaki, BurlyWood, chocolate, peru, darkgoldenrod
lightcoral, coral, lightsalmon, salmon, darksalmon, orangered, darkorange, orange, sandybrown, goldenrod, khaki, gold, yellow

greenyellow, lightgreen, lawngreen, chartreuse, lime, springgreen, mediumspringgreen,
limegreen, green, forestgreen, darkgreen,
seagreen, mediumseagreen, darkseagreen,
olive, olivedrab, darkolivegreen

azure, aliceblue, lightcyan, paleturquoise, lightblue, lightsteelblue, powderblue, cyan, aqua, aquamarine, turquoise, lightskyblue, skyblue, mediumaquamarine,
mediumturquoise, darkturquoise, deepskyblue, cadetblue, cornflowerblue, steelblue, slateblue, mediumslateblue,royalblue, dodgerblue, lightseagreen, teal,darkcyan, blue, mediumblue,darkslateblue, navy, darkblue, midnightblue

indigo, blueviolet, mediumpurple, mediumorchid, purple, darkmagenta, darkviolet, darkorchid, lavender, thistle, plum, violet, orchid, magenta, fuchsia, mediumvioletred

darkslategray, dimgray, gray, slategray, darkgray, silver

[In Desolation]

CHUNKS & THINGS

ａ ｂ ｃ ｄ ｅ ｆ ｇ ｈ ｉ ｊ ｋ ｌ ｍ ｎ ｏ ｐ ｑ ｒ ｓ ｔ ｕ ｖ ｗ ｘ ｙ ｚ

Ａ Ｂ Ｃ Ｄ Ｅ Ｆ Ｇ Ｈ Ｉ Ｊ Ｋ Ｌ Ｍ Ｎ Ｏ Ｐ Ｑ Ｒ Ｓ Ｔ Ｕ Ｖ Ｗ Ｘ Ｙ Ｚ

α в c ם/∂/δ є ғ ɢ н ι נ к ℓ м и σ ρ q я s т υ v ω x ץ/ч z

ℭ ℌ ℑ ℜ ℨ

⒜ ⒝ ⒞ ⒟ ⒠ ⒡ ⒢ ⒣ ⒤ ⒥ ⒦ ⒧ ⒨ ⒩ ⒪ ⒫ ⒬ ⒭ ⒮ ⒯ ⒰ ⒱ ⒲ ⒳ ⒴ ⒵

Ⓐ Ⓑ Ⓒ Ⓓ Ⓔ Ⓕ Ⓖ Ⓗ Ⓘ Ⓙ Ⓚ Ⓛ Ⓜ Ⓝ Ⓞ Ⓟ Ⓠ Ⓡ Ⓢ Ⓣ Ⓤ Ⓥ Ⓦ Ⓧ Ⓨ Ⓩ

ⓐ ⓑ ⓒ ⓓ ⓔ ⓕ ⓖ ⓗ ⓘ ⓙ ⓚ ⓛ ⓜ ⓝ ⓞ ⓟ ⓠ ⓡ ⓢ ⓣ ⓤ ⓥ ⓦ ⓧ ⓨ ⓩ


┄ ┅ ┆ ┇ ┈ ┉ ┊ ┋ ⋮ ⋯ ⋰ ⋱
─ ━ │ ┃┌ ┐ ┍ ┑ ┎ ┒ ┏ ┓ └ ┘ ┕ ┙ ┖ ┚ ┗ ┛
┞ ┟ ┢ ┡ ┦ ┧ ┩ ┪
┣ ┫┝ ┥┠ ┨├ ┤
┬ ┭ ┮ ┯ ┰ ┱ ┲ ┳ ┴ ┵ ┶ ┷ ┸ ┹ ┺ ┻ ┼ ┽ ┾ ┿
╀ ╁ ╂ ╃ ╄ ╅ ╆ ╇ ╈ ╉ ╊ ╋ ╌ ╍ ╎ ╏
═ ║ ╒ ╓ ╔ ╕ ╖ ╗ ╘ ╙ ╚ ╛ ╜ ╝ ╞ ╟
╠ ╡ ╢ ╣ ╤ ╥ ╦ ╧ ╨ ╩ ╪ ╫ ╬
╭ ╮ ╯ ╰ ╱ ╲ ╳ ╴ ╵ ╶ ╷ ╸ ╹ ╺ ╻
≡ ≢ ≣ ≤ ≥ ≦ ≧ ≨ ≩ ≪ ≫ ≭ ≮ ≯ ≰ ≱ ≲ ≳ ≴ ≵ ≶ ≷ ≸ ≹ ≺ ≻ ≼ ≽ ≾ ≿
⊀ ⊁ ⊂ ⊃ ⊄ ⊅ ⊆ ⊇ ⊈ ⊉ ⊊ ⊋ ⊏ ⊐ ⊑ ⊒
⊕ ⊖ ⊗ ⊘ ⊙ ⊚ ⊛ ⊜ ⊝ ⊞ ⊟
⊠ ⊡ ⊢ ⊣ ⊤ ⊥ ⊦ ⊧ ⊨ ⊩ ⊪ ⊫ ⊬ ⊭ ⊮ ⊯
⊰ ⊱ ⊲ ⊳ ⊴ ⊵ ⊶ ⊷ ⊸ ⊹ ⊺ ⊻ ⊼ ⊽ ⊾ ⊿
⋀ ⋁ ⋂ ⋃ ⋄ ⋅ ⋆ ⋇ ⋈ ⋉ ⋊ ⋋ ⋌ ⋍
⋎ ⋏ ⋐ ⋑ ⋒ ⋓ ⋔ ⋖ ⋗ ⋘ ⋙ ⋚ ⋛ ⋜ ⋝ ⋞ ⋟
⋠ ⋡ ⋢ ⋣ ⋤ ⋥ ⋦ ⋧ ⋨ ⋩ ⋪ ⋫ ⋬ ⋭

❛❜❝❞【】〖〗►◄﹃﹄『』◢ ◣◥ ◤

BASIC DIVIDERS

████████████████████████████████ ████████████████ ███████

████████████████████████████████ ████████████████ ███████

████████████████████████████████ ████████████████ ███████

[color=color1]████████████████████████████████[/color] [color=color2]████████████████[/color] [color=color3]███████[/color]

≎≎≎≎≎≎≎≎
==== ☠ ====
☆═━┈┈━═☆
± : . : ± : . : ± : . : ±
▄▀▄▀▄▀▄▀▄▀▄▀▄▀▄
╔══════════════╗

╚══════════════╝
┏━━━━━━━━━┓

┗━━━━━━━━━┛
║│║▌│█│║▌││█║║██║▌│█║▌│║║█║║▌║

₪₪₪₪₪₪₪₪₪₪₪₪₪₪₪₪₪₪₪₪₪₪₪₪

▂▂ ▃ ▄ ▅ ▆ ▇ █___█ ▇ ▆ ▄ ▃ ▂▂

▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲

▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼

╬╠╬╠╬╠╬╬╠╬╠╬╠╬╬╠╬╠╬╠╬╬╠╬╠╬╠╬╬

Oº°‘¨_ _ _¨‘°ºO
•°o.O_ _ _O.o°•
¨°o.O_ _ _O.o°¨
—¤÷(`[¤*_ _ _*¤]´)÷¤—
•·.·´¯`·.·•_ _ _•·.·´¯`·.·•´
`·.(`·.¸_ _ _¸.·´).·´
`·» »-(¯`v´¯)-» _ _ _
`•.¸¸.•´¯`•.¸¸.•´
`•.¸¸.••´´¯``•• .¸¸.•´
`•.•●•۰• ••.•´
׺°”˜`”°º×_ _ _׺°”˜`”°º×
ண

♡ ♣ ♤ ♥ ♡ ♣ ♤ ♥ ♡ ♣ ♤ ♥ ♡ ♣ ♤ ♥ ♡

▀▄▄▀▄▄▀▄▄▀▄▄▀▄▄▀▄▄▀▄▄▀▄▄▀

Credit for the RP Resource below goes to my friend Crocodylus. If you see him RPing around high five him or something

Free Headers To Use For Roleplays
(Using tinypic! Select show_all_images in Account Preferences under Image Display.)

[IMG]http://i42.tinypic.com/2elxund.jpg[/IMG]

[IMG]http://i44.tinypic.com/206c3gk.jpg[/IMG]

[IMG]http://i43.tinypic.com/j08aw2.jpg[/IMG]

[IMG]http://i40.tinypic.com/oqgn84.jpg[/IMG]

[IMG]http://i41.tinypic.com/23hlpiv.jpg[/IMG]

[IMG]http://i44.tinypic.com/11iebs6.jpg[/IMG]

To customize the headers into buttons, the image code goes between the URL codes. It'll look like the code below. The link goes in the first URL code chunk. (Look!)

[url=http://][IMG]http://i42.tinypic.com/2elxund.jpg[/IMG][/url]

Example:

[In Desolation]

fancy text and how to layer code in Barton Town (Doesn't work in Guilds)


If you want the text to be orange. Color code the text orange first. Or any other color of your choosing

LIKE THIS

[color=orange]LIKE THIS[/color]

Then to color the text style line separately you put the color codes outside of the text style. NOT inside

LIKE THIS

[color=blue][u][color=orange]LIKE THIS[/color][/u][/color]

LIKE THIS

[color=blue][strike][color=orange]LIKE THIS[/color][/strike][/color]

To cut text in half you code the strike color to be white

LIKE THIS

[color=white][strike][color=orange]LIKE THIS[/color][/strike][/color]

Combined code looks like this

COMBINED LOOKS LIKE THIS

[color=red][strike][color=blue][u][color=green]COMBINED LOOKS LIKE THIS[/color][/u][/color][/strike][/color]

*This kind of code layering to my knowledge doesn't work in guilds

REGARDING GUILD CODING

Compliments of a sdrawkcab the following:

Until I read your guide, I thought it was impossible to create text and have an underlined text in another color in the forums. I've been doing that in guild threads for years.
In this post, you say this code layering doesn't work in guilds. So~ I thought I'd share.

In forums, the code is:

[color=blue][u][color=orange]LIKE THIS[/color][/u][/color]

*I tried the code that you provided in a guild, and as you said, it didn't work.

But in guilds, the code for the same thing is:

[color=blue][u][b][/color][color=orange]LIKE THIS[/color][/u][/b]

*This code does not work in the forums, but works in guilds. In forums, the underline just turns white. That bold code has no visual effect in both forums and guilds.

I've never tested the strike through text, so I don't know how that would work.

[In Desolation]

TIP

The rumor is that you can't use listing codes in guilds. That's not true. For listing to work in guilds you need an equal amount [] and [/]

How to check if you lose count? Put your post lay out in a Journal entry and Submit

If you have too many or too little of either []'s or [/]'s then they'll show up. If you have the correct amount then they won't show up in a journal entry

Note. Listing doesn't happen in journal entires. But the codes still function if you insert them in a regular forum or guild post afterwards