View topic - >>Editable Code for Nav buttons, Header, Border colors

This code is free. You ARE allowed to use this code as is or edit it to suit your needs. BUT, it is for personal use only. You may not distribute this code as your own for any Ernya currencies OR for free.

This is not a complete code! It will not give you a custom profile! It doesn't even have code in it to change your background! This code does ONLY two things... 1) It gives you control over the colors that change throughout the day to coordinate with the Sylfee/Clouds header and 2) It allows you to change the color of your navigation bar.

The code affects only the greens on this preview (click to view larger)...

This code works well with mostly default profiles (like if you put in a background image but left most of the rest untouched).

How to use this code:
Copy all the code into a word document and use the Find and Replace All function to put in your own colors. This code will not work unless you put in your color codes! There are 4 colors included here. You can choose 4 shades of the same color or completely different colors, more or less depending on your color scheme.

Use this table to help you choose your colors...
#COLOR1......... Links and text in the Headers, Links in the footer, the color of the Inbox button when you have a new PM
#COLOR2......... The color of your Navigation Buttons when you hover over them
#COLOR3......... The main color of the Header and the Footer and the Wrap border
#COLOR4......... The color of your Navigation Buttons

What this code won't do:
Change the color of the text on the navigation buttons
Change the color of the Currency Counters or of the balloon they're displayed in
Allow you to make white the color of the navigation buttons (#COLOR4)

Code:
  • Show Spoiler

  • /*Headers*/
    h1 {display:none;}
    #helper-wrap {background: transparent;}
    #board{margin-top:40px;
    background-color:#COLOR3;
    background-image: url(http://i53.tinypic.com/2wf4vme.png);
    background-position: center bottom !important;
    background-repeat: no-repeat;
    height:145px; width:960px;}
    #board li {color:#COLOR1;}
    #board a{color:#COLOR1 !important;}
    h2{display:none;}
    .currency{margin-top:20px;}
    .currency.eleven, .currency.twelve, .currency.thirteen, currency.fourteen, .currency.fifteen, .currency.sixteen, .currency.seventeen, .currency.eighteen, .currency.nineteen, .currency.twenty {margin-top:20px;}
    #bc{margin-top:100px}

    /*Navigation Bar*/
    #nav{padding-top:6px; border:none; background:transparent; height:20px;}

    #home #nav .home{margin-left:8px; width:105px;}

    #home #nav .home a {background:#COLOR4 url(http://i53.tinypic.com/egcy95.jpg); background-position:center center; background-repeat:no-repeat;}
    #home #nav .home a:hover {background:#COLOR2 url(http://i53.tinypic.com/egcy95.jpg); background-position:center center; background-repeat:no-repeat;}
    #home #nav .home.event a {background:#COLOR1 url(http://i53.tinypic.com/egcy95.jpg) !important; background-position:center center !important; background-repeat:no-repeat;}

    #nav .games {width:110px;}

    #nav .games a {background:#COLOR4 url(http://i54.tinypic.com/3128bp0.png); background-position:center center; background-repeat:no-repeat;}
    #nav .games a:hover {background:#COLOR2 url(http://i54.tinypic.com/3128bp0.png); background-position:center center; background-repeat:no-repeat;}

    #nav .trade{width:110px;}

    #nav .trade a {background:#COLOR4 url(http://i52.tinypic.com/6h5no4.png); background-position:center center; background-repeat:no-repeat;}
    #nav .trade a:hover {background:#COLOR2 url(http://i52.tinypic.com/6h5no4.png); background-position:center center; background-repeat:no-repeat;}
    #nav .trade.event a {background:#COLOR1 url(http://i52.tinypic.com/6h5no4.png) !important; background-position:center center !important; background-repeat:no-repeat;}

    #nav .forum{width:110px;}

    #nav .forum a {background:#COLOR4 url(http://i56.tinypic.com/34yphcx.png); background-position:center center; background-repeat:no-repeat;}
    #nav .forum a:hover {background:#COLOR2 url(http://i56.tinypic.com/34yphcx.png); background-position:center center; background-repeat:no-repeat;}
    #nav .donate{width:100px;}

    #nav .donate{width:115px;}

    #nav .donate a {background:#COLOR4 url(http://i51.tinypic.com/290wnpf.png); background-position:center center; background-repeat:no-repeat;}
    #nav .donate a:hover {background:#COLOR2 url(http://i51.tinypic.com/290wnpf.png); background-position:center center; background-repeat:no-repeat;}

    #nav .shops{width:110px;}

    #nav .shops a {background:#COLOR4 url(http://i52.tinypic.com/n6zy1f.png); background-position:center center;
    background-repeat:no-repeat;}
    #nav .shops a:hover {background:#COLOR2 url(http://i52.tinypic.com/n6zy1f.png); background-position:center center; background-repeat:no-repeat;}

    #nav .inv {width:140px;}

    #nav .inv a {background:#COLOR4 url(http://i55.tinypic.com/1q5mxi.png); background-position:center center;
    background-repeat:no-repeat;}
    #nav .inv a:hover {background:#COLOR2 url(http://i55.tinypic.com/1q5mxi.png); background-position:center center; background-repeat:no-repeat;}

    #nav .inbox{width:115px;}

    #nav .inbox a {background:#COLOR4 url(http://i54.tinypic.com/2q32mgw.png); background-position:center center; background-repeat:no-repeat;}
    #nav .inbox a:hover {background:#COLOR2 url(http://i54.tinypic.com/2q32mgw.png); background-position:center center; background-repeat:no-repeat;}
    #nav .inbox.event a {background:#COLOR1 url(http://i54.tinypic.com/2q32mgw.png) !important; background-position:center center !important; background-repeat:no-repeat;}

    /*Wrap Borders*/
    #wrp{border:#COLOR3 10px solid !important;}

    /*Footers*/
    li#btm{background-color:#COLOR3;}
    #doc #ft .footer-controller, #doc #ft .footer-bottom-corners {background:transparent; margin-top:-10px;}
    #ft{background-image:none; background-color:#COLOR3;}
    #ft{color:#COLOR3;}
    #ft a{color:#COLOR1;}
    .facebook{display:none !important;}
    .deviantart{display:none !important;}
    #doc #ft .footer-links-wrap {background-color:#COLOR3;}
    #doc #ft .footer-links-wrap {background-color:#FF0066;}
    #doc #ft .footer-controller a, #doc #ft .footer-links{text-shadow:none;}
    #doc #ft .hide-footer a, #doc #ft .show-footer a{background:transparent;}

Post by Verse » Fri May 20, 2011 11:27 pm


Last edited by Verse on Thu Jul 14, 2011 3:26 pm; edited 14 times in total
Editable #2

The rules for this one are different. You may use this code without having to attribute it. This is because there's nothing here that I made myself (like the graphics in Editable #1 above). This is just the basic code and it would be the same for everyone whether they read it here or wrote it themselves.

This code removes all the default background stuff, preparing your profile for your own background image and color. Board = navigation buttons, Av = visitor's avatar, Ft= footer, h1 = Ernya logo and link, h2 = "News" image, h3 = section headers, wrp = main borders and box, helper-wrap = Sylfee/clouds image, reward = marble.

This one you can just copy and paste into your Customize CSS box.

Code:#board {display: none;}
#av {display: none;}
#ft {display: none;}
h1, h2, h3 {display: none;}
#wrp {background: transparent; border: none;}
#helper-wrap {background: none;}
#reward{display:none;}
Post by Verse » Fri May 20, 2011 11:27 pm


Last edited by Verse on Mon May 30, 2011 5:00 am; edited 3 times in total
Reserved (Just in case)
Post by Verse » Fri May 20, 2011 11:28 pm
Reserved (Just in case)
Post by Verse » Fri May 20, 2011 11:29 pm
Open!
Post by Verse » Fri May 20, 2011 11:30 pm
Oh my goodness. Thanks so much, Verse. I'd been wondering about this. I thought about redoing my profile at some point since the current one was pretty much a test. I kind of wanted to experiment with keeping the navbar, so this is great.
Post by Culnamo » Sat May 21, 2011 1:35 am
Does this work for the Stickers bar as well?
Post by Maniac » Sat May 21, 2011 1:51 am
Maniac wrote:Does this work for the Stickers bar as well?
No. You can find the selectors (what each part of the sticker box is called in CSS code) here: http://www.ernya.com/post7285006.html#7285006.
Post by Verse » Sat May 21, 2011 1:59 am
Awesome, thanks so much, Verse. :)
Post by Maniac » Sat May 21, 2011 2:00 am





Yay for free nav bar edits 8D!
< u <





Post by Alexia » Sat May 21, 2011 3:33 am

Thanks so much fr the code =D It's realy helpful <3
Post by BeautifuL DisasteR » Sat May 21, 2011 9:26 am

Your first taste of something is with your eye.

So, next time you drink tea, you should pour it into your eye ;)

I've added this as a link to my guide in the body section. :)
Post by Sam » Sat May 21, 2011 2:49 pm
Wow this is really amazing, Verse. I'll certainly have to play with it soon. ^_^
Post by My Chemical Romance » Sun May 22, 2011 3:34 am

Busy=on phone/at college

Call me Rage


Click for quest


Ohh, thanks ^^
I'm going to go experiment now 8D
Post by Calcifer » Sun May 22, 2011 6:24 am

Current Quests: 12k, Air Gear x1, Greek Temple x2, & current wishlist

Got my V-Day set thanks to the lovely Epo! c: -- :D

< - click.
Funds: 10.5k
[updated every 100g]
This is neat. <3
Post by Scarling » Sun May 22, 2011 6:24 pm

http://scarlingx.tumblr.com/
Please visit my tumblr!

Buying Unleashed for 250g each

65 Posts • Page 1 of 5

 
Users browsing this topic: and 1 guests