MagiStream

Rosehill, do you have a header "stencil" you use to know where to put the words?

[center][color=#8000FF][b][/b][/color][/center]

A couple finished requests:

CSS for Cassowary
CSS for Feathersun

I will work on the rest of the graphics requests next week and hope to get most of them done. After that I will be on Summer Vacation and won't work on the graphics before the middle of August when I get back.

In the meanwhile, here's a tutorial about how I make the profile header images:

1) I create a new document of 850 pixels wide and 250 pixels tall with a white background.
2) (Link to image)I place horizontal guides at 20 pixels, 184 pixels, 204 pixels and 240 pixels. The first two line the area where the "Magistream" text is in the default header. The last two line the area where the gold and shard amounts are as well as where the Forum, Shops, Trades etc. links are.
3) (Link to image) I place vertical guides at 32, 150, 228, 300, 378, 486, 560, 612 and 646 pixels. This image demonstrates what kind of areas the horizontal and vertical guides create together: (Link to image)
A = the area where the "Magistream" text is on the default header and that links to the stream
B = the area where the text "Forum" is on the default header and that links to the forum index
C = the area where the text "Shops" is on the default header and that links to the shops
D = the area where the text "Trades" is on the default header and that links to the trades
E = the area where the text "The Keep" is on the default header and that links to the Keep
F = the area where the text "World" is on the default header and that links to the world page
G = the area where the text "Donate" is on the default header and that links to the donation page
H = the area where the gold and shard amounts are presented
I (this applies to the whole pink horizontal bar from the left edge to the end of "Donation" block) = the area where the yellow background bar for the links is.

4) (Link to image) After I have the guides set I start the actual work. I put in the actual background colour on a new layer and add the texts for the links.
5) (Link to image) I make the rest of the image and voila, the header image is ready.

Here is an image you can use as the base if you can't use guides or find them too complex to use: (Link to image)

In order to use the header image on a profile this is the code to put on the profile's Custom CSS field.

That looks complicated but I think I'll try, once I take my sleep

The profile header images are pretty much like normal images, the only a bit more "tricky" part is getting the link texts on the correct place and even with those it doesn't matter if they are a few pixels from their designated area. As with all grpahics, playing around and trying out new things and making a few practise versions goes a long way.

The CSS, signature set and profile header image tutorials have been what people have asked about the most and I haven't planned making another tutorial, but if there are some types of graphics that someone wants a tutorial of I can of course make it.

You mean like a header for a thread? Not the profile header?

Rosehill wrote:You mean like a header for a thread? Not the profile header?

A header for a thread.

*bookmarks until crest slots are open since she haz a new family and another one coming when her Red Talvars cooperate* :3