Posted by Kim on March 20, 2013, 10:50amToday, we present Jane's final tutorial on taking your character profiles to the next level.
Check out the first and second tutorials, and then dive in to this chapter on giving some final polish to how text and information is presented on your profiles.
How to make your profile look clean and neatly aligned
Your profile is already pretty, but you want that final touch to make it look very clean and orderly?
You might want to align the text as blocktext, meaning all your sentences will extend to both sides of the page, using this:
[justify] text goes here [/justify]
Don't use the same size for your text on your whole site.
This looks plain and makes it hard to read. Some important points or words should be emphasized to lead the eye through the profile. Less important information can be made smaller so people can read it if they want, or skip it if they are looking for the main points.
The code for changing the size of your text is:
[size=2] text goes here [/size]
You can use numbers 1 through 7 when picking your size.
BBcode gives you many possibilities you can use to your advantage to make text stand out.
[b] text goes here [/b] = bold [i] text goes here [/i] = italics [u] text goes here [/u] = underlined [s] text goes here [/s] = strike out
The text on your profile sticks to the top/bottom, no matter what you do?
"White space" or blank characters like enter or lots of spaces are trimmed off the beginning and end of text widgets when they are saved. If you want a way around this, insert some BBCode and do not put any text inside it, just hit enter a few times. Then this "White space" will not be at the beginning of your text, so it will not be trimmed off when you hit save.
[b][/b] I did not put anything inside the bold tag, so nothing will appear on my profile. But the new lines above this sentence will be preserved.
Removing the default titles from widgets
I personally use a single text-widget for my sites. However if it confuses you, you can use more.
You don't have to put text into the widget's title box. Leave it blank if you think it doesn't go well with your layout.
A neat way to organize the statistics of a char is to use columns.
You can find the code for the columns here.
You can use other Bbcodes in the columns too, for example the collape tag.
You will find out that the size of the columns depends on the text. This can make the columns look cluttered, because they aren't aligned the way you want them.
A solution is to create a transparent picture of a certain size.
The picture has to be just a pixel in height, and for example 250 pixels wide.
If you add that picture in the first line of every column, they will all have the same size.
Different screen resolutions
If your profile looks all pretty but another user points out that some of the alignments you made are not working, it could always be that the other user is using a different resolution to view sites.
Use Ctrl + Mouse Wheel to zoom in/out, to see how the page would look in different resolutions.
Just do your best to make it look good, but if you are worried, you can include a note that informs people that they may need to try a different resolution to see your best work.
Jane has generously offered to prettify one lucky person's profile! Just leave a comment on this news post that includes the words "I am entering to win that profile." Next week, we will draw a winning name!
Only players who have not previously had Jane prettify one of their profiles may enter, to give everyone a chance to experience her talents.
Thank you Jane!
As thanks for sharing some of her tricks of the trade, Jane has been awarded a nice big shiny trophy for her profile. If you appreciate these tips too, please shower her in kudos explaining her generous and helpful spirit to the world!