Shop Mobile More Submit  Join Login


Site Align:
Left - #site { margin-left: auto; margin-right: auto; width: 765px; }

Center - #site { margin-right: auto; margin-left: auto; width: 765px; }

Right - #site { margin-center left: auto; margin-left: auto; width: 765px; }

Background Body & Content:
body { background: #000 url( image url goes here ) fixed right bottom repeat; color: #fff; }

#content { background: #000 url( image url goes here ) fixed right bottom repeat;

Section Background:
Note:You can use this if you want all sections of the layout to like alike or you can do each separately ( This is easier! )
With color: #profile, #details, #wishlist, #about, #friends, #journal, #multimedia, #comments, #signature { background: #fff; }
With image: #profile, #details, #wishlist, #about, #friends, #journal, #multimedia, #comments, #signature { background: #000 url( image url goes here ) fixed right bottom repeat;  }
No background: #profile, #details, #wishlist, #about, #friends, #journal, #multimedia, #comments, #signature { background: none; }

Cursor Changer:
Note:You can also use other cursors like...help, pointer,ect.
body
{
cursor: cursor name;
}

Border:
Note:Some other borders are...solid, double, dash, outset, inset. An px size can go to almost any size.
.section { border: 2px dotted #000; }

Section Postioning:
Note:Only postions that can be used are absolute and relative (Use absolute!). Where it say left you can also put in right, and you can put any number in front of px.
#section name { position: relative; left: 0px; top: 550px; width: 230px; }

Make Your Sections Scrollers:
Note:You can put any number in front of height and width.
#section name {overflow:scroll;overflow-x:hidden;overflow-y:auto; height:200px;width:400px;font-size:9pt;color:#fff;}

Caption Changer:
#comments { background: #fff; }
.caption { background: #000 url( image url goes here );
border: 2px solid #000; color: #000; }
.caption:before { content: url( image url goes here );
background: url() top right no-repeat;
}
.caption:after { content: url( image url goes here );
background: url( image url goes here ) bottom right no-repeat; }
.caption .message { background: url( image url goes here ) top left no-repeat; }

.caption2 { background: #000 url( image url goes here );
border: 2px solid #fff; color: #fff; }
.caption2:before { content: url( image url goes here );
background: url( image url goes here ) top right no-repeat; }
.caption2:after { content: url( image url goes here );
background: url( image url goes here ) bottom right no-repeat; }
.caption2 .message { background: url( image url goes here ) top right no-repeat; }

Profile Bar:
Note:Best images to use are small .gif file images but if you want to use a bigger image for something just change the width and height px size.
#bar {background: transparent; position: absolute;}

#bar #addButton {background: transparent url( image url goes here ) no-repeat; text-indent: -4000px; position: absolute; top: -10px; left: 70px; width:15px; height:10px;}
#bar #addButton a {background: transparent url( image url goes here ) -22px -90px no-repeat;width:15px; height:10px; border: 0px;}

#bar #tradeButton {background: transparent url( image url goes here ) no-repeat; text-indent: -4000px; position: absolute; top: -10px; left: 100px; width:15px; height:10px;}
#bar #tradeButton a {background: transparent url( image url goes here ) -22px -90px no-repeat; width:15px; height:10px; border: 0px;}


#bar #msgButton {background: transparent url( image url goes here ) no-repeat; text-indent: -4000px; position: absolute; top: -10px; left: 130px; width:15px; height:10px;}
#bar #msgButton a {background: transparent url( image url goes here ) -22px -90px no-repeat; width:15px; height:10px; border: 0px;}

#bar #ignoreButton {background: transparent url( image url goes here ) no-repeat; text-indent: -4000px; position: absolute; top: -10px; left: 40px; width:15px; height:10px;}
#bar #ignoreButton a {background: transparent url( image url goes here ) -22px -90px no-repeat;width:15px; height:10px; border: 0px;}

#bar #onlineButton {background: transparent url( image url goes here ) no-repeat; text-indent: -4000px; position: absolute; top: -10px; left: 40px; width:15px; height:10px;}
#bar #onlineButton a {background: transparent url( image url goes here ) -22px -90px no-repeat;width:15px; height:10px; border: 0px;}

#bar #offlineButton {background: transparent url( image url goes here ) no-repeat; text-indent: -4000px; position: absolute; top: -10px; left: 40px; width:15px; height:10px;}
#bar #offlineButton a {background: transparent url( image url goes here ) -22px -90px no-repeat;width:15px; height:10px; border: 0px;}

Text:
Note:You can use any text font name.
body
{
font-family: Font name;
color : #000;
text-align:left;
}

Don't Display:
Note:This lets you take ANYTHING that you don't want to be shown on your profile. Also you can put any number of sections in the list.
#section name,  {display:none}
This is for people who want to make there own gaiaonline profile layout.
There are some basic codes here, but there are others that are not.
But here is another place on gaia that gives you ALL basic codes you need:
[link]

You can take these codes an add them on.
Hope you use them!
Also sorry if I put this under the wrong category I didn't know what to put it under
An ONLY FOR GAIAONLINE!
Add a Comment:
 
:iconaquathros:
Aquathros Featured By Owner Nov 18, 2013
Thank you so much for this.  I'm updating my profile and this really helps!
Reply
:iconxduckli:
xDuckli Featured By Owner Aug 4, 2013  Student Digital Artist
Do you know how to make pictures half transparent? o A o"
Reply
:iconblueroseleaf:
BlueRoseLeaf Featured By Owner Nov 22, 2012
THANK YOU~!
Reply
:iconblossombrigade:
BlossomBrigade Featured By Owner Jul 4, 2012
cant i just tell you what i want and you do it for me? ;) lol
Reply
:iconsqueekyfangirl:
SqueekyFanGirl Featured By Owner Jan 19, 2012
Im a lil confused
the centered code
didnt work on my profile
and no I didnt copy ad paste
the "center" - #site lol

im using the custom profile
on gaia and i wanna make
it centered... well duh lool

my username is S a l v a i i Heita
on Gaia :) If you wanna message
me there????

Plz and thank you :)
Reply
:icontheemopanda14:
TheEmoPanda14 Featured By Owner Dec 23, 2011
How do you make the text glow ;O ?
Reply
:iconpngbbyg13:
PNGBbyG13 Featured By Owner Dec 18, 2011  Hobbyist Writer
I wanna know how to add a deviant to Gaia.. it said i need the URL for it, and i did that and it said that, it was blank so idk, i also wanna add the deviant to my gaia profile as well
Reply
:iconsamurainoryuu:
Samurainoryuu Featured By Owner Dec 2, 2011  Student General Artist
I'm so confused. x.x; I've tried using the codes that I keep finding and it isn't working right.
Reply
:iconstalkerturtlesexist:
StalkerTurtlesExist Featured By Owner Sep 27, 2011
In my opinion you should have probably separated your notes/helpful comments from the actual code. It would have been easier. ^^ Just a suggestion :3
Reply
:iconhirukayuki01:
hirukayuki01 Featured By Owner Sep 22, 2011
i;m confused:(
Reply
:iconfrihalahoo:
frihalahoo Featured By Owner Sep 1, 2011  Student Artist
where can i change my cursor?
Reply
:iconsereniama:
Sereniama Featured By Owner Jul 23, 2011  Hobbyist Writer
Dude I love you.
Reply
:iconjordiesmordy:
JordieSmordy Featured By Owner Jun 4, 2011
thank you!!
Reply
:iconshikaluver93:
shikaluver93 Featured By Owner Jan 30, 2011  Hobbyist General Artist
Awesome! I needed one of these. Thanks a heap. and the link is also a great help.
:highfive:
Reply
:icondigitaldemons:
DigitalDemons Featured By Owner Jul 16, 2010
anyone have any examples on how theirs turned out?
Reply
:iconsasukexxsakura:
sasukeXXsakura Featured By Owner Apr 8, 2010
i cant seem to change my status bar even with the codes help? D:
Reply
:iconsootzy:
sootzy Featured By Owner Feb 8, 2010  Student General Artist
This code centers my text boxes but leaves the image on the wrong side of the page. How to fix?
Reply
:iconnaganegi-no-takai:
Naganegi-no-Takai Featured By Owner Jan 24, 2010
Thank you sooo much. >< I needed this.
Reply
:iconbitofruit:
BitOFruit Featured By Owner Aug 19, 2009  Student Filmographer
thanks you helped me :D
Reply
:iconma-junior:
Ma-Junior Featured By Owner Feb 28, 2009   General Artist
Head spinning, getting dizzy. *Falles over clutching head while eyes spin* This is the type of thing I've been looking for but man am I confused. Is this classic, or a current thing?
Reply
:iconkio-mayoko:
Kio-Mayoko Featured By Owner Nov 1, 2009  Hobbyist General Artist
This is for classic
Reply
:icono-inconsequential-x:
o-inconsequential-x Featured By Owner Aug 12, 2011  Professional Photographer
That would explain why it's not working for me and making me sad face.
Reply
:iconbleed-justtoknow:
Bleed-JustToKnow Featured By Owner Dec 7, 2008
Yeah, where do you enter these codes? :O
Reply
:iconklzi:
Klzi Featured By Owner Jul 15, 2008   Writer
Relative IS BETTER than absolute, because it works in ALL WEB BROWSERS.
You put all the codes in your theme section.
Reply
:iconsakurabanaharuno:
SakuraBanaHaruno Featured By Owner Jul 11, 2008
where do u put the center text code?
Reply
:icontotoyamado:
totoyamado Featured By Owner May 26, 2008
wha?
Reply
:iconcutepokemontrianer:
CutePokemonTrianer Featured By Owner May 26, 2008   Traditional Artist
Whats wrong?
Reply
:icontotoyamado:
totoyamado Featured By Owner Jun 14, 2008
twooooo, mannnny, worrrrrrrrrrds, and by the way, you know you spelled trainer wrong riiiiiiiiiiiight?
Reply
:iconcutepokemontrianer:
CutePokemonTrianer Featured By Owner Jun 15, 2008   Traditional Artist
Yeah it's confusing and yeah I figured that out about a month after I joined :blush:
Reply
Add a Comment:
 
×



Details

Submitted on
March 15, 2008
File Size
5.4 KB
Link
Thumb

Stats

Views
53,010 (6 today)
Favourites
153 (who?)
Comments
29
×