WordPress.org

Ready to get started?Download WordPress

Forums

Problem with Header Logo in BlogoLife WPlook (15 posts)

  1. marks262
    Member
    Posted 2 years ago #

    I have added some HTML for image logo in the General Settings, Header Description. However this appears half way across the page above the top menu bar.

    How can I change it to appear to the left?

  2. ChristiNi
    Member
    Posted 2 years ago #

    Hi marks262,

    Could you give us a link to your site so we can see what you're seeing and what you want to change?

    Thanks!

  3. marks262
    Member
    Posted 2 years ago #

    The link is http://www.tadleyrunners.co.uk/
    The logo at the top I want aligned to the left just above where it shows home page in menu bar. I have tried various images sizes and use the left align tag for the image html.

  4. ChristiNi
    Member
    Posted 2 years ago #

    Hi marks262,

    First and foremost, make sure you are using a Child Theme. Once you are using a Child Theme, copy the header.php file of the parent theme over into the Child Theme.

    Edit your header.php file as follows:

    If you just want to insert that image (without the image being a clickable link):

    Look for the following lines:

    <hgroup class="fleft">
    	<h1 id="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?> - <?php bloginfo('description'); ?>" rel="home"><?php bloginfo('name'); ?></a></h1>
    		<h2 id="site-description"><?php bloginfo('description'); ?></h2>
    </hgroup>

    Replace those lines with:

    <hgroup class="fleft">
    	<img src="http://tadleyrunners.co.uk/wp-content/uploads/2012/01/TopLogo.jpg">
    </hgroup>

    If you want to make the link clickable, instead replace with:

    <hgroup class="fleft">
    	<a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?> - <?php bloginfo('description'); ?>" rel="home"><img src="http://tadleyrunners.co.uk/wp-content/uploads/2012/01/TopLogo.jpg"></a>
    </hgroup>

    Lastly, for either way you choose, remove the background url from the branding element in your style sheet so that the background will blend in with your logo. Add this to your Child Theme's style sheet:

    #branding {
        background: none;
    }

    Hope this helps!

  5. marks262
    Member
    Posted 2 years ago #

    Thanks, I will change it to use a child theme and then make the suggested changes.

  6. marks262
    Member
    Posted 2 years ago #

    Thanks for that I have got that bit working now.

    How can I reduce the gap between the logo and the menu bar?

  7. ChristiNi
    Member
    Posted 2 years ago #

    Hello marks262,

    Looking at your site with the Firebug extension in Firefox, I noticed this code in your style sheet that should control the position of your navigation bar (menu bar):

    nav {
    display: block;
    font-size: 14px;
    margin: 10px -10px 0;
    padding: 0 30px;
    position: relative;
    }

    You can modify that margin as needed to decrease the gap between your logo and the navigation bar.

    Hope this helps!

  8. sam27
    Member
    Posted 2 years ago #

    I am having the same issue. As suggested i created a child theme by having a new folder by the name 'wp-content-child' and i have two files in this folder.
    1. header.php which i copied from the 'wp-content/themes/blogolife' folder and edited as mentioned out here.
    2. style.css file which i used similar to the one used by marks262 on his blog.

    Is there anything else i need to do to make sure the child theme get inherited.

    I am completely new to PHP and WP. Any help is greatly appreciated.

  9. sam27
    Member
    Posted 2 years ago #

    BTW i forgot to specify my domain in my previous post
    http://blog.educatemax.com

  10. sam27
    Member
    Posted 2 years ago #

    sorry i messed up the url it is blogs.educatemax.com

  11. ChristiNi
    Member
    Posted 2 years ago #

    Hello sam27,

    This really should be posted as a new question. Please note, when you are using a Child Theme, any files you wish to customize should be copied over into the new Child Theme folder and then edited there (not edited in the parent theme folder). You will also need to activate the Child Theme in order to see and utilize the changes to your Child Theme. I would also recommend using a clear folder name for your Child Theme (wp-content-child might be confuses with the wp-content folder it resides in).

    Hope this helps!

  12. hanshjc
    Member
    Posted 1 year ago #

    Dear All,

    I'm at a Loss, after successfully making the modification I needed.

    Blogolife Theme (Nov.2012 version):
    Homepage Logo positioning works Fine: http://www.lifebalance.pt
    Click on a link from the Menu bar. Result > Logo in the Header is missing

    Could somebody advise me how-to-resolve the case of the Missing Header Logo in sub-pages ?

    Any support you may give is verrrrry much appreciated :-)

  13. Andrew
    Forum Moderator
    Posted 1 year ago #

    For support with your own issues, you should create your own thread.

  14. ChristiNi
    Member
    Posted 1 year ago #

    Hi hanshjc,

    I'm going to break the rules a little here and help you out. Looks like you may have hard coded the link to the image into the header file. If you did, instead of using:

    wp-content/uploads/2012/12/design_LifeBalanceR222.jpg

    try using the full url or this instead:

    <?php echo home_url(); ?>/wp-content/uploads/2012/12/design_LifeBalanceR222.jpg

    Hope this helps. If not, or if you have further questions, please post a new question in the forum.

    Christi N.

  15. hanshjc
    Member
    Posted 1 year ago #

    Christi > thanks your your great help, I used the full url, and it works beautifully now ! Thanks so much.

    Andrew hello, I will create a new thread in the future, have learnt this from you now. (I was under the assumption to bundle similar questions together, I'll make sure not doing so any more.)

    Wish you both a wonderful day !

Topic Closed

This topic has been closed to new replies.

About this Topic