Title: logo
Last modified: August 21, 2016

---

# logo

 *  Resolved [arieli](https://wordpress.org/support/users/arieli/)
 * (@arieli)
 * [12 years, 2 months ago](https://wordpress.org/support/topic/logo-50/)
 * can i add a logo on the top left corner ?

Viewing 7 replies - 1 through 7 (of 7 total)

 *  [Luke Stacey](https://wordpress.org/support/users/daftduke/)
 * (@daftduke)
 * [12 years, 2 months ago](https://wordpress.org/support/topic/logo-50/#post-4957021)
 * Yes you can:
 * Like this – [Screen shot link.](http://postimg.org/image/qx2df9wdn/)
 * Put this code into your child theme header.php so you won’t lose all the changes
   made when the theme updates.
 * Child themes are the safest way to go when doing all kinds of modifications.
 *     ```
       <div id="header-image">
           <a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
              <img src="<?php echo get_template_directory_uri(); ?>/images/logo.png" alt="Logo"/>
           </a>
       </div>
       ```
   
 * You will have to upload your logo via ftp, not through the media library.
 * First create a folder called ‘images’ in
 * > wp-content/themes/ward/
 * and then upload your logo into that directory. Make sure it is called ‘logo.png’.
 * You might need to adjust with CSS to get it exactly as you want.
 * I hope that helps!
 *  Thread Starter [arieli](https://wordpress.org/support/users/arieli/)
 * (@arieli)
 * [12 years, 1 month ago](https://wordpress.org/support/topic/logo-50/#post-4957105)
 * Thank you!
 *  [briz_dad](https://wordpress.org/support/users/briz_dad/)
 * (@briz_dad)
 * [12 years, 1 month ago](https://wordpress.org/support/topic/logo-50/#post-4957255)
 * Hello daftduke,
 * I attempted to do the same thing – and I used your code above. However, I broke
   the site.
 * How do I effectively call in this element from the child theme?
 * Sincerely,
    Greg
 * PS. I attempted to drop your code above between the following two snippets:
 *     ```
       <div class="container">
       				<div class="navbar-header">
       ```
   
 * So I had:
 *     ```
       <div class="container">
                                <div id="header-image">
           <a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
              <img src="<?php echo get_template_directory_uri(); ?>/images/logo.png" alt="Logo"/>
           </a>
       </div>
       				<div class="navbar-header">
       ```
   
 *  [Luke Stacey](https://wordpress.org/support/users/daftduke/)
 * (@daftduke)
 * [12 years, 1 month ago](https://wordpress.org/support/topic/logo-50/#post-4957259)
 * Hi Greg,
 * It’s great to hear you are using a child theme!
 * To include this code you need to make a copy of your ‘header.php’ file and place
   it in your child theme directory.
 * Look for this line of code (line 38ish):
 *     ```
       <a id="site-title" class="navbar-brand" href="<?php echo esc_url( home_url() ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?> <small><?php bloginfo( 'description' ); ?></small></a>
       ```
   
 * If you want to keep the Site Title place the code below (i.e. around line 39).
 * If you don’t want to keep the Site Title you can remove the above code and just
   replace it.
 *     ```
       <div class="header-image">
           <a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
              <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/logo.png" alt="Logo"/>
           </a>
       </div>
       ```
   
 * [(Screenshot of new code)](http://tinypic.com/r/25pk7kx/8)
 * The img tag contains slightly different code from the previous post to take into
   account that you are using a child theme.
 * get_template_directory_uri – – > get_stylesheet_directory_uri
 * And you’ll still need to place your logo.png file in your
 * > wp-content/themes/ward-child/images
 * or whatever name you gave your child theme folder.
 * I hope that works for you! Let us know how it goes 🙂
 *  – Luke
 *  [briz_dad](https://wordpress.org/support/users/briz_dad/)
 * (@briz_dad)
 * [12 years, 1 month ago](https://wordpress.org/support/topic/logo-50/#post-4957262)
 * Hello Luke,
 * Perfect – works like a charm. (And I found out that just placing the header.php
   file into the Child-Theme directory works.)
 * [blackstardevelopment.org/wp-site/](http://blackstardevelopment.org/wp-site/)
 * I have two other questions – and they’re different topics – so this item can 
   close out.
 * Thanks again!
    Greg
 *  [joelsmithlowe](https://wordpress.org/support/users/joelsmithlowe/)
 * (@joelsmithlowe)
 * [12 years, 1 month ago](https://wordpress.org/support/topic/logo-50/#post-4957281)
 * daftduke you are awesome for those snippets of code !
 * I have a question though if you feel like answering, I was wondering how would
   you be able to centre the logo.png abit more or give more space between the image
   and the top Navigation bar.
 *     ```
       <div id="page">
   
       		<header class="<?php echo $bavotasan_theme_options['nav_palette']; ?> navbar navbar-fixed-top" role="navigation">
       			<div class="container">
       				<div class="navbar-header">
       					<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
       			          <span class="icon-bar"></span>
       			          <span class="icon-bar"></span>
       			          <span class="icon-bar"></span>
       			        </button>
       			        <div class="header-image">
           <a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
              <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/logo.png" alt="Logo"/>
           </a>
       </div>
   
       				</div>
       				<h3 class="screen-reader-text"><?php _e( 'Main menu', 'ward' ); ?></h3>
       				<a class="screen-reader-text" href="#primary" title="<?php esc_attr_e( 'Skip to content', 'ward' ); ?>"><?php _e( 'Skip to content', 'ward' ); ?></a>
       				<?php wp_nav_menu( array( 'theme_location' => 'primary', 'container' => 'nav', 'container_class' => 'navbar-collapse collapse', 'menu_class' => 'nav navbar-nav', 'fallback_cb' => 'bavotasan_default_menu' ) ); ?>
       			</div>
       		</header>
       ```
   
 *  [Luke Stacey](https://wordpress.org/support/users/daftduke/)
 * (@daftduke)
 * [12 years, 1 month ago](https://wordpress.org/support/topic/logo-50/#post-4957282)
 * Hi there,
 * If I’m understanding correctly you could adjust this with CSS. Something like:
 *     ```
       .header-image {
         margin: 20px 0 0 20px;
       }
       ```
   
 * Placed inside your child theme style.css
 * If you post a link to your site I could be more exact for you.
 * I hope that helps 🙂
 *  – Luke

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘logo’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/ward/1.0.7/screenshot.png)
 * Ward
 * [Support Threads](https://wordpress.org/support/theme/ward/)
 * [Active Topics](https://wordpress.org/support/theme/ward/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/ward/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/ward/reviews/)

## Tags

 * [logo](https://wordpress.org/support/topic-tag/logo/)

 * 7 replies
 * 4 participants
 * Last reply from: [Luke Stacey](https://wordpress.org/support/users/daftduke/)
 * Last activity: [12 years, 1 month ago](https://wordpress.org/support/topic/logo-50/#post-4957282)
 * Status: resolved