Ocean Mist – change header

  • Author
    Posts
  • #143625

    bluehighways
    Member

    Hi,
    I’ve been trying to customize the black header in Ocean Mist on my blog http://thinktankitaly.wordpress.com/. Must say that I’m hopeless tampering with CSS … ;-)

    Two questions:

    1) can I remove the black header at all

    and

    2) if 1) is not possible, can I change the text colour to the same colour of the black background so it’s not visible?

    Many thanks,
    Luca

    #143876

    If you have css editing experience and you have purchased the css customization upgrade these things are possible. In order to receive help you will have to patiently wait for one of css experts to log into the forum and help you with the specifics.

    #143877

    bluehighways
    Member

    Thanks for your reply. I did purchase the css custom upgrade and I’m in no particular hurry to fix this. So, I’ll be waiting for the next 3-4 days, hoping to get good news.

    I don’t have CSS editing experience though, and I really hope the tips will be really friendly…

    L

    #143878

    Well the css upgrade is not recommended for those who do not have css editing experience. There is no staff support for learning css and they will not repair what you muck up. Those who do have experience are professionals who occasionally donate some time to lend a hand.

    #143932

    bluehighways
    Member

    Understand. I have fiddled for a while (I do have HTML skills…) and have been able to restore things when I did not like the outcome.

    Just need a tiny hint on how to rework the header section…

    L

    #143960

    raincoaster
    Member

    I’m afraid you’ll have to wait till one of our rare CSS gurus happens along. It is a good-looking blog, I must say, and the header looks nice to me although I’d try to edit that tagline so that it fit on one line.

    #144247

    bluehighways
    Member

    hi there, CSS wizards. Any wisdom from you about the issue above?

    many thanks,
    Luca

    #144248

    devblog
    Member

    bluehighways,

    Try adding this to your CSS:

    #header h1, #header .description {display: none;}

    HTH

    #144252

    bluehighways
    Member

    Thanks devblog, that suppressed the text from the header. Any ways to take the black area off the layout at all?

    Best,
    Luca

    #144253

    sillybooks
    Member

    Log into your account and go to Presentation/Custom Image Header and look about there. Options to change text and backgrounds are all available.

    #144254

    raincoaster
    Member

    Not if you’re using custom CSS; as I understand it, the custom CSS overrides any changes you may make using the regular header uploader, that’s why this has to be written right into the coding for that.

    #144255

    judyb12
    Member

    @bluehighways:
    i found the bit of CSS that refers to the element you want to get rid of:

    #header {
    background:transparent url(images/bg_header.gif) no-repeat scroll center top;
    display:block;
    float:left;
    min-height:355px;
    padding:0pt;
    position:relative;
    width:750px;
    }

    and the header image you want to keep:

    #mainpic {
    background:transparent url(http://thinktankitaly.files.wordpress.com/2007/09/header_white1.png) no-repeat scroll 0%;
    border-bottom:3px solid #67939B;
    border-top:3px solid #67939B;
    bottom:0pt;
    display:block;
    float:left;
    height:229px;
    margin:0pt 7px;
    position:absolute;
    width:736px;
    }

    i’m not good enough with CSS to figure out how to get rid of the dark grey bar without getting rid of the whole header, but you might want to try playing with the different attributes listed. At the very least, you can replace the dark grey bar with another image:

    #header {
    background:transparent url(YOUR_DIFFERENT_IMAGE_HERE) no-repeat scroll center top;
    }

    #144261

    bluehighways
    Member

    Thanks a lot judyb12. I managed to get rid of the text, but the dark grey bar is still there…

    #144262

    naitkat
    Member

    quick and dirty solution:

    change

    #header {min-height: 355px;}

    to

    #header {min-height: 235px;}

    The thin gray line on top you can see now is the top border of the #mainpic, I presumed you wanted to keep it.

    #144263

    bluehighways
    Member

    Thanks Naitkat, that’s exactly what I wanted!

    All the best,
    Luca

    #144264

    judyb12
    Member

    Yea! I’m so glad someone found something that worked for you :-D

    #144265

    timethief
    Member

    YAY! devblog, judy and naitkat

The topic ‘Ocean Mist – change header’ is closed to new replies.