Need help? Check out our Support site, then


WordPress.com Forums » Support

Depo Masthead header customization and replacement

  1. thriftcircus
    Member

    I'm trying to replace the header in the Depo Masthead template. Using
    the measurements from this:

    http://en.forums.wordpress.com/topic/appearance?replies=4

    I made a graphic that is 980px by 220px and followed the rest of the instructions. When I preview the page the header graphic is cut and about 120px tall. I've tried reducing the margins to 0 of the H1 container and tried adding a height of 220px. neither is working. Is what I'm trying to do possible with this template? Any ideas? I could scrap the graphics and do a new one but what size won't crop?

    Here is a screen grab of the preview page:
    http://farm3.static.flickr.com/2539/3975175929_77b4897f2a_o.png

    here is the original graphic:
    http://farm3.static.flickr.com/2441/3975175997_c5c54a34db_o.jpg

    thanks for any help you may be able to offer.

    The blog I need help with is thriftcircus.wordpress.com.

  2. thriftcircus
    Member

    BTW here is a link to my blog:

    http://www.thriftcircus.wordpress.com

  3. thriftcircus
    Member

    Well looks like I figure it out on my own. I pasted :

    h1 {
    color: transparent;
    }

    #container h1 {
    background: transparent url(http://thriftcircus.wordpress.com/files/2009/10/tcheadersm.jpg) no-repeat scroll center
    }

    into the CSS and replaced the original css all at once. I didn't realize the "add too CSS" was always using the original CSS. I'm an idiot.

  4. 5thjoy
    Member

    i'm thinking of doing the same thing one I have a logo. yours looks great! did you have to purchase the css upgrade to do this?

    http://www.5thjoy.com

  5. thriftcircus
    Member

    thanks, I 'm glad you like the design. The CSS upgrade is the only way to do this if you are hosting on wordpress.com. let me know if you need any help and I'll tell you what I know. Good luck.

  6. enotria
    Member

    Still crops to 120px on my blog. I don't get it..help, anyone?

    http://www.torinoexpress.wordpress.com

    e.

  7. enotria
    Member

    Also, I'm really interested in modifing colors in headers and links etc, like you did, Thritcircus. I'm not really into CSS, but I have a relatively good intuition for these thing..

    Can anyone spare the time to help me out?

    e.

  8. enotria
    Member

    And also, the blog title remains in all other pages than the actual blog. Think I've tried everything.. Drives me crazy.

  9. thriftcircus
    Member

    try this:

    (h1.name a,h1.name a:link,h1.name a:visited {
    color:#fff;
    }

    #container h1 {
    width:980px;
    height:220px;
    text-align:center;
    font-size:4em;
    line-height:1em;
    background:transparent url('http://thriftcircus.files.wordpress.com/2009/10/tcheader.jpg') no-repeat scroll center;
    margin:0 auto;
    }

    #container h1 a,#container h1 a:link,#container h1 a:visited {
    color:transparent;
    }

    #container h1 a:hover,#container h1 a:active {
    color:transparent;
    }

    h1 {
    color:transparent;
    }
    )

  10. thriftcircus
    Member

    I would copy and paste the original CSS to a text doc and work on it from there. Make all the changes there and replace the CSS in wordpress. H1 headers should all transparent.

  11. khf1
    Member

    I am looking to use an image in the header of my blog, similar to Thriftcircus. I will use this header on every page. Is there a way to have the image link to the homepage? Or, is the only way to achieve this is to have the invisible "transparent" header text link and hope people roll over this area?

  12. panaghiotisadam
    Member

    @khf1: Please paste the URL of your blog when asking questions here, or link your username to your blog. We can't help without that.

  13. khf1
    Member

    My blog is http://haring.com/, but I have not inserted an image header at this point. I am just wondering if it is even possible, based on seeing the image header on http://www.thriftcircus.wordpress.com.

    Thank you!

  14. panaghiotisadam
    Member

    Sorry, this forum is for wp.com blogs only; http://haring.com/ isn’t a wp.com blog.

  15. khf1
    Member

    Oh I'm sorry, wrong link! http://keithharingfoundationarchives.wordpress.com/
    It is the Depo Masthead theme.

    Thanks!

  16. thesacredpath
    Member

    DePo Masthead does not have a custom header option. It would require CSS editing experience and the paid CSS upgrade.

  17. khf1
    Member

    Thanks for your response!

    I do know CSS and have paid for the upgrade, I just am not certain how to make an inserted header image, like on http://www.thriftcircus.wordpress.com, link to the home page from all of the interior pages. I know the transparent title still links, so if you roll over certain areas of the header where the text still exists, you can link. However, is there a way to get the entire header image to hyperlink?

    Thank you!

  18. edenchanges
    Member

    Any idea how to force a line break in the header page listings. No matter what I do it cuts a heading in half - this is my business blog so it's important it looks right!

    Any help would be most appreciated - http://www.edenchanges.com is the site and [email redacted] will get me!

    Thanks in advance!

    Regards

    Stephen

  19. thesacredpath
    Member

    The navigation breaks where it breaks. You might try reordering the tags as explained in this support document, but the thing is, some of the choice where the tabs break are up to the browser. IE typically breaks at a different place from FF or Safari, or Opera, and I've seen instances where FF on a Mac and FF on a PC break things differently.

  20. thesacredpath
    Member

    Oops, forgot the link: http://en.support.wordpress.com/pages/page-attributes/ .

  21. devblog
    Member

    I do know CSS and have paid for the upgrade, I just am not certain how to make an inserted header image, like on thriftcircus.wordpress.com...

    Then you don't know CSS.

  22. devblog
    Member

    never mind, you already added a custom img header.

  23. kahley
    Member

    I also need to have my masthead link to the homepage.

    I'm at chocolateblood.com (chocolateblood.wordpress.com) and I have the CSS edit upgrade.

    I'm using the gridfocus theme, and I have pasted a #masthead into the css from a different theme, but I gotta get it to link home. Here's the code I'm using:

    #masthead {
    position:relative;
    top:0;
    background:url('http://chocolateblood.wordpress.com/files/2009/12/masthead3.jpg');
    width:970px;
    height:456px;
    margin:0;
    padding:7px 0;
    }

    if anyone can shed some light on if this is possible, I'd be very thankful ;)

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags