WordPress.org

Ready to get started?Download WordPress

Forums

Adding Header Image (8 posts)

  1. ehong33234
    Member
    Posted 3 years ago #

    Is there a way to add a header image to the top of the blog theme? If so, how?

    Thx

  2. rbright77
    Member
    Posted 3 years ago #

    It depends what theme you are using, if using the default theme the header.php file contains the code which pulls up the kubrik image and you can change this code to add your own image.

  3. ehong33234
    Member
    Posted 3 years ago #

    Thanks for your answer. I'm sorry I wasn't more clear. I am using the TITAN theme which doesn't have a banner image right now as default.

  4. Drew Strojny
    Member
    Posted 3 years ago #

    Hi there,

    We offer a built in custom logo / header image option in the PRO version of Titan. More details here about the differences between the PRO and free version are here:

    http://thethemefoundry.com/titan/

  5. cdobbins
    Member
    Posted 3 years ago #

    I am trying to add an image to my header. I"m using the "blocked" theme. How do I do this?

    Thanks!

  6. stitch23red
    Member
    Posted 3 years ago #

    You are in luck, I just added a header logo to the Titan theme within the editor in the WordPress admin area.

    If you go to the admin area and under the Appearance section in the left column and then select Editor.

    Now from the Templates section in the right hand column select header.php.
    Find the section of code that reads like the following:

    <div class="wrapper">
    			<?php if (is_home()) echo( '<h1 id="title">'); else echo( '<div id="title">');?><a href="<?php bloginfo( 'url'); ?>"><?php bloginfo( 'name'); ?></a><?php if (is_home()) echo( '</h1>'); else echo( '</div>'); ?>

    For the next part you will have had to have uploaded your logo image somewhere onto the internet and have the URL to the image.

    Change the above code to look like the following (Note change the settings to match your own website and logo URL's):

    <div class="wrapper">
    <div class="logo">
    <a href="<?php bloginfo('url');?>"><img src="http://your-url.com/yourLogo.jpg" alt="Your blog name" /></a></div>
    			<?php /* if (is_home()) echo( '<h1 id="title">'); else echo( '<div id="title">');?><a href="<?php bloginfo( 'url'); ?>"><?php bloginfo( 'name'); ?></a><?php if (is_home()) echo( '</h1>'); else echo( '</div>'); */?>

    Notice the /* and */ tags in the second ?php statement! THESE ARE IMPORTANT.

    Update your page settings and then from the right hand templates column select style.css.

    Find the piece of code that looks like this:

    .alignleft { float: left; }
    .alignright { float: right; }

    All you need to do now is simply add the following line underneath it:
    .logo { float: left; }

    The completed section of the css should now look like this:

    /* Import Stylesheets
    -----------------------------------------------------------*/
    @import url("stylesheets/master.css");
    
    /* Required WordPress Classes, don't remove these.
    -----------------------------------------------------------*/
    .aligncenter {
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    }
    .alignleft { float: left; }
    .alignright { float: right; }
    .logo { float:left; }
    
    /* Make all custom CSS changes in a child theme. Any custom
    changes you make here will not be overidden when you upgrade the theme.
    -----------------------------------------------------------*/

    I hope this helped! Please check out my blog at http://daily-grind.net.

  7. tiagofj
    Member
    Posted 3 years ago #

    I was trying to do almost the same, also with the Titan theme.
    But I wanted to replace the whole bar with the title and description by a banner image.
    Any way of doing this?

  8. nvernier
    Member
    Posted 3 years ago #

    I am using the Black-LetterHead 1.5 theme and I would like to add a picture to my header as well.
    I located the header.php file and looked at it, but could not figure out where to insert the image.
    Can anyone help?

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags