Log in

No account? Create an account

Previous Entry | Next Entry

Header Image/Font Style + Colour

  • Nov. 23rd, 2006 at 5:58 PM
Hi! I've read through the other posts here but am still feeling confused due to not knowing a thing, really, about coding and stuff.

I'm using the "Food Sweets" theme under Expressive, can someone please tell me how to:

1) Add a header image?
2) Change the font style/colour?
3) Making the header and sub header centred on the layout?


( 9 comments — Leave a comment )
Nov. 24th, 2006 05:07 pm (UTC)
These are all CSS changes, not code changes; Go to Customize Options, Custom CSS:
#header {
    background-image: url(image path);
#header-text {
2) is a little more complicated. How many places do you want to change the font or color? Just in entries? Entry headers? Page headers? Sidebars?
Nov. 24th, 2006 05:13 pm (UTC)

And I want to change the font/colour on the header/sub header and journal entry.
Nov. 24th, 2006 06:51 pm (UTC)
This post actually addresses a bunch of the same questions, you may want to check it out.
#header-name a,
    color: #fff;(or whatever)
to change the colors on the journal title and subtitle. Change .asset-body {} font or color properties to change formatting in entries alone.
Nov. 24th, 2006 07:23 pm (UTC)
Thanks, again! That other post is helpful.

Is there a way of moving the header image down so I can still see the Header/Subheader text clearly?
Nov. 24th, 2006 09:09 pm (UTC)
OK, this is what I came up with. I just copied all your CSS to make it easier. Any time you start messing around with moving header stuff around, it gets ugly. There's probably a more elegant way to do this, but this worked for me. You may want to tweak some height numbers here or there.
#header {
    background-image: url(http://img.photobucket.com/albums/v64/MademoiselleBelle/sophieheader.png);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-color: #FFFFFF;
    padding-bottom: 0px;
    height: 360px;
#header-inner { height: 130px; }

#header-text {

#header-name a { color: #4B0082; }
#header-description { color: #FF69B4; }

#header .nav a { color: #000000; }
#header .nav a:visited { color: #DC143C; }

body {
    font: normal 10px Verdana, sans-serif;
Note that I took the liberty of changing the header background color to white so you wouldn't see the pink, and took out the ()s in the body tag. The font property won't work with them in there.
Nov. 24th, 2006 09:16 pm (UTC)
*grins* Thanks, that's great! One day when I have more time I'll start learning all this stuff for myself.
Nov. 16th, 2007 04:37 pm (UTC)
this post was very helpful to me and everything worked like a charm except one this - the navigation links won't centre!

i am working on the layout for canadian_shack, which is expressive seasonal, and i have a paid account. here is my code:

#header-inner {
background-image: url(http://img.photobucket.com/albums/v12/orlisbunny/ob5/canadian-shack-banner-3.jpg);
height: 380px;
#header-content-inner {
margin: 300px 15px 80px 60px;
#header-text {
#header-name a { color: #3216A7; }
#header-description { color: #3216A7; }

#header .nav a { color: #3216A7; }
#header .nav a:visited { color: #3216A7; }

any suggestions would be greatly appreciated, especially if there is a way i can code the header and nav links text to be white with a black outline.
Nov. 16th, 2007 05:22 pm (UTC)
Center vertically or horizontally? If vertically, change the 300px margin; change the 60px otherwise.
Nov. 16th, 2007 06:08 pm (UTC)
horizontally ... so i can't just tell it to align center like the header text? i'll play around with it.

thank you so much.
( 9 comments — Leave a comment )

Latest Month

March 2016

S2 Help Communities


Powered by LiveJournal.com
Designed by chasethestars