Support » Themes and Templates » changing header text to a logo

Viewing 6 replies - 1 through 6 (of 6 total)
  • Which theme are you using? I don’t believe that my code below will work on all themes, but I’ll give you what’s working for me.

    If you’ve made the header text part of your logo and wish to exclude it, then you should do this:

    If your theme has an “images” folder, you’ll want to make your header image, name it (header.jpg, for example), and upload it to the “images” folder. If your theme does not have an “images” folder, then go ahead and make one, then put your header/logo image in there.

    In your header.php page, look for the <body> tag. In most themes that I have used, the place for the header image is just below this tag.

    The code for your header text may look similar – but not exactly – to this:

    <div id="rap">
    <div id="header">
    <div id="title"><a href="<?php bloginfo('url'); ?>/"><?php bloginfo('name'); ?></a></div>
    <div id="description"><?php bloginfo('description'); ?></div>

    The div id “title” is the header text, the blog title, and the div id “description” is the tagline. If you have these things in your logo and want to delete them both and insert your logo/header image, change your code to this:

    <div id="rap">
    <div id="header"><img src="images/header.jpg" width="enter number of pixels" height="enter number of pixels" border="0" alt="name of your website"></div>

    If you wish to make the header image clickable, so that people can click on it and go back to your main page, making the code look like this usually works for me, but I understand that this doesn’t work for all themes:

    <div id="rap">
    <div id="header"><a href=""><img src="" width="850" height="200" border="0" alt=""></a></div>

    Hope that works out.

    Also? Definitely use the search feature at the top of the support page, this question has been asked and answered quite a lot. 🙂

    The theme is called blue horizon. It is supposed to have a photo logo but it never showed up on my blog, just text. My blog is at Thanks. Dawn

    Is this the Blue Horizon theme you are referring to? (If so, then I’m guessing that you are comfortable with editing the files/CSS – as the colour schemes are different!)

    OK, there’s a couple of things I noticed by looking at the CSS of your blog:

    * The theme should have an “/images/” folder which would contain the following images: header.gif; icon.gif; icon2.gif;

    * I notice that you have your own header.gif – but it needs to be in the “/images/” folder!

    Now for the header text… what do you want to do with it? Change it or remove (hide) it completely?

    If you want to change the text, then you can do that in the WP-Admin backend: “Options >> General >> Weblog Title”.

    If you want to remove (well, hide) the header text, then you’ll have to manually edit the “header.php” file in your “blue horizon” theme:

    * Open “header.php” in a text editor (like notepad).
    * Look for the section that says:

    <div id="masthead">
    <h1 id="header"><a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>
    <h2 id="tagline"><?php bloginfo('description'); ?></h2>

    Now replace it with the following:

    <div id="masthead"><!--
    <h1 id="header"><a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>
    <h2 id="tagline"><?php bloginfo('description'); ?></h2>

    What I have done is wrap HTML comments around the blog’s title and tagline in the header section. I could have removed it completely, but you may want to use it again in future!

    I hope that works out for you.

    – Lee

    Hi Dawn,

    I notice that you made the changes and it’s worked out for you.

    – Lee

    I am familiar with HTML, but not much more 🙂

    What is the code for the default theme? (I want my logo and some words)

    Is it as simple as:

    <div id=”rap”> (what is rap?)
    <div id=”header”><img src=”images/header.jpg” width=”enter number of pixels” height=”enter number of pixels” border=”0″ alt=”name of your website”></div>

    Where do I add the text?
    And do I use normal HTML when formatting my text? Also, concerning where I want the text/logo, is that align=xxx ?


    <div id="rap"> (what is rap?)= is WRAP

    The text must go inside the div called "header"

    For text aligment use:

    text-align: left;
    text-align: right;
    text-align: center;
    text-align: justify;

    Cheerz man!,

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘changing header text to a logo’ is closed to new replies.