Need help? Check out our Support site, then


Image header as link

  1. Hi,

    I am new to CSS and cannot figure out how to make my header a link back to the home page. I have tried several different ways, but nothing has worked. This is my current code:

    #logo {
    background:url('http://nyudri.files.wordpress.com/2012/02/dri_id_final_horizontal_web5.png') no-repeat scroll 0 0 transparent;
    height:198px;
    width:940px;
    }
    
    .site-title {
    display:none;
    text-transform:none;
    }

    I'd really appreciate any suggestions. Thanks!

    The blog I need help with is nyudri.org.

  2. How to do this depends on your theme. Looks like you're working on http://nyudri.org/ and currently using the Bueno theme there.

  3. Yes, sorry I forgot to include that. I am using the Bueno theme.

  4. First, go to Appearance → Header first and set the "Display Text" option to Yes.

    Next, add this CSS:

    .site-title a:link, .site-title a:visited {
      display: block;
      position: absolute;
      width: 940px;
      height: 198px;
      text-indent: -9999px;
      top: 75px;
    }

    Note that you may need to adjust the top value, I guessed it.

  5. Ok, I did that. Should I change anything to add the web address?

  6. Did you add the CSS example to your Appearance → Custom Design → CSS page? I can't see it saved there.

  7. You should be able to see it now.

  8. I see now. You have some additional CSS later in your custom CSS that is overriding the code you just added. Try the following.

    Remove this:

    .site-title {
      display:none;
      text-transform:none;
    }

    And in the other code block you just added, change the "top" value from 75px to 30px.

  9. You're a genius! I've been trying to fix this for two days and you did it in two steps. Thank you!

  10. Yay! I'm happy I could help.

Topic Closed

This topic has been closed to new replies.

About this Topic