Including text in header image

  • Author
    Posts
  • #109703

    Hi – I have been using the Profile theme for some time now, at http://www.nataliehanson.com and I still really like it! Thanks for your efforts to address the various questions / bugs that have come up with new releases.

    I would like to use my own font for the Site Identity text that appears on the top center of my home page. I was hoping to embed the text in the header image, but in order for that to work, I would need to leave the Site Identity fields blank.

    Is it possible to (1) complete Site Identity fields but surpress them in the header, while keeping the header the same size, or (2) leave Site Identity fields blank – not ideal – and keep the header from resizing so that the text in the header image shows above my menu?

    Or maybe there is a third option I haven’t thought of? I paid to customize the CSS and I am comfortable with some light editing of that, if that is what is required. Thanks!

    The blog I need help with is nataliehanson.com.

    #109792

    Also, I tried putting the title text in using a transparent GIF as a Logo, but when I use this code:

    #custom-header img {
    width: 100%;
    }

    as suggested in another post in the forum, it makes the logo / text close to the right size, but it distorts my header image. Is there a way to resize the logo independent of the header? If so, that might work …

    #109793

    Also, I tried putting the title text in using a transparent GIF as a Logo, but when I use this code:

    #custom-header img {
    width: 100%;
    }

    as suggested in another post in the forum, it makes the logo / text close to the right size, but it distorts my header image. Is there a way to resize the logo independent of the header? If so, that might work …

    #109826

    rezzap
    Staff

    Hi Natalie,

    You’re site is looking like you’ve been able to get these all sorted, so I’m not sure what information is still required here.

    In terms of adding the site title/tagline but not having it display, this can be done with CSS. You would add the following to hide both the site title and site description:

    #header .site-title,
    #header .site-description {
        display: none;
    }

    You will run into the issue you mention of having the header image resize and the text probably not sitting where you want it to sit though so adding these as an image/logo instead is probably best.

    From what I can see you got it to work fine with a 75% width. Are you still having troubles with this or has that sorted it okay for you? Let me know if there’s still some issues here and we can look into this further.

    Thanks!

    Rebecca

    #109835

    Hi Rebecca – thanks for the follow up. After a brief wrestling match, I did get this mostly sorted. I would like to be able to upload the image with text overlay instead, though, so I can control font color based on the background image. I appreciate the instructions on how to do so! Natalie

    #109837

    Hi Rebecca – thanks for the follow up. After a brief wrestling match with WP, I did get this mostly sorted. :) I would like to be able to upload the image with text overlay instead, though, so I can control font color based on the background image. I appreciate the instructions on how to do so! Natalie

    #109840

    rezzap
    Staff

    Hi Natalie,

    The image resize would be hard to control if you added your text directly in the header image, but you can give it a try by using the CSS to hide the site title instead of having the logo uploaded.

    Sorry for the delay over the weekend with this, hopefully you get what you’re after soon. :)

    Thanks!

    Rebecca

    #109995

    Ok thanks. Once I get some of my other pressing issues addressed, I may try to create a banner image with the font and upload it, but what I have is functional for now. Thanks again.

    #110004

    rezzap
    Staff

    Sounds good! :)

    Cheers,

    Rebecca

The topic ‘Including text in header image’ is closed to new replies.