Using a logo in the header (wordpress)

1 replies
QUestion for the code gurus here...

i'm using the abcok theme for a couple of my sites and would like to use a logo instead of the blog name in the header...

now, according to the theme author, in order to use a logo, he states:
this theme doesn't have option for header. If you want to add a logo, you can edit the file header.php under the folder wp-content\themes\abcOK, add your code in the div with id="branding".
here is my current code for the branding part in the syles.css file
Code:
#banner {
    width: 100%;
    background-color: rgb(27,104,158);
    height:340px;
    margin:0;
    padding: 0;
    position: relative;
and here is the div section in the header.php file:

Code:
<div id="banner">
            <div id="surheader">    
                <?php if ($options['twitter']) : ?>
                    <img style="vertical-align:-3px;" alt="RSS" src="<?php bloginfo('template_directory'); ?>/images/twitter.gif" height="16" width="16" /> <a href="http://twitter.com/<?php echo $options['twitter']?>" target="_blank"><?php _e('Twitter','abcOK'); ?></a> &nbsp;&nbsp;
                <?php endif; ?>
                <img style="vertical-align:-3px;" alt="RSS" src="<?php bloginfo('template_directory'); ?>/images/feed-icon-16x16.gif" height="16" width="16" /> <a href="<?php echo ap_rssLink(); ?>"><?php _e('Entries RSS','abcOK'); ?></a> | <a href="<?php bloginfo('comments_rss2_url'); ?>"><?php _e('Comments RSS','abcOK'); ?></a>
            </div>    
            <div id="branding">
                <div id="blog-title"><span><a href="<?php bloginfo( 'url' ) ?>/" title="<?php bloginfo( 'name' ) ?>" rel="home"><?php bloginfo( 'name' ) ?></a></span></div>
                <div id="blog-description"><?php bloginfo( 'description' ) ?></div>                        
            </div><!-- #branding -->
        </div>
can anyone help?
#header #logo #wordpress
  • Profile picture of the author ntemple
    Try something like:

    PHP Code:
                <div id="branding">
    <a href="/"><img src="http://example.com/yourlogo.jpg"></a>
                    <div id="blog-title"><span><a href="<?php bloginfo'url' ?>/" title="<?php bloginfo'name' ?>" rel="home"><?php bloginfo'name' ?></a></span></div>
                    <div id="blog-description"><?php bloginfo'description' ?></div>                        
                </div>
    It's going to be hard to give exact instructions without actually doing the edit and see what happens, because the exact placement and css (if any) depends on many factors, including logo size, css, and html.

    But that should be enough to get you playing.

    Replace example.com with the link to your logo, and if you can, add the dimensions (height and width).
    {{ DiscussionBoard.errors[3195711].message }}

Trending Topics