Mwa
(?)Community Member
Offline
- Posted: Sat, 12 Nov 2005 19:08:48 +0000
Mastering Your Profile
It's come. You can now edit the CSS in your profile, to make it look like anything you want. (Within limits.)
Because of this, I had a lot of fun customising mine, and thought I'd bless the fun on others.
Now, I realise that there are a few other topics on CSS in EF allready.
However, they all seem to be codebanks.
Not tutorials.
So here's mine.
How To!
Note! Get the right equipment
Whilst it's all fun messing around with the tiny text box in the profile admin and having to save each time you experement, it's really crap. wink
So, you'll need some equipment that will allow you to do it easily, fast and see what the results are instantly.
You will need:
The first is a web browser, the rest are extentions for FireFox.
ColorZilla is an eyedropper tool that allows you to select any colour on a page and copy it to the clipboard. It also has a built in colour cooser.
EditCSS allows you to edit the CSS on the page and see what the results are instantly. If you mess up, you can just refresh, and everything will be back how it was.
IE View simply allows you to view the page in Internet Explorer at a touch of a button. A tad pointless, but good for seeing how things look in IE. (I think this may be a Windows only extention. sweatdrop )
MeasureIt is a tape measure for your browser, and allows you to measure gaps and stuff for positioning.
Web Developer is a toolbar with a ton of useful functions, not least of which is one that shows all the IDs and classes of the different parts of the page, so you don't need to touch the sourcecode.
Once you've downloaded FireFox and installed all the extentions (Sadly I won't be going through how to do this, it is quite simple! wink ), you need to log into Gaia and view your profile.
Press ctrl-8 to pull up the CSS editor.
Scroll down to the bottom (Yes, Gaia uses TONS of CSS. wink ), and begin adding your CSS.
Your changes will apear on the page instantly.
To access the IDs and Class names, click 'Information' and then 'Display Id and Class details'.
I will leave learning CSS to you, as there are many fine repositorys of it elsewhere.
I'll leave you with a reminder that you will have to copy the CSS you add from the editCSS window and put it in your profile for it to work for anyone else. wink
I may edit this later.
Love
~Mwa heart
