How to put logo on top of header image twentyeleven

  • roy27

    (@roy27)


    12 years, 2 months ago

    Hi,
    I’m using the Twentyeleven theme as a basis for a website.
    And I want to put a .png logo on top of the header image (not above, but realy on top, like the searchbox on the right, overlay) and aligned to the left.
    So I don’t have to put the logo manualy to all the header images.

    How do I do that?

    Thanks in advance!
    Roy

Viewing 4 replies - 1 through 4 (of 4 total)
  • Michael

    (@alchymyth)

    12 years, 2 months ago

    please start with creating a child theme to work with: http://codex.wordpress.org/Child_Themes

    then add the image (with its own css class) into the #branding div; and use css positioning http://www.w3schools.com/css/css_positioning.asp

    please post a link to your site with the child theme and the image code in place for more suggestions;

    or try to work with a tool such as Firefox’ add-on Firebug to assist with evaluating the css structure.
    http://getfirebug.com/

    Thread Starter roy27

    (@roy27)

    12 years, 2 months ago

    It worked! 😀

    Thanks!

    lakecrew

    (@lakecrew)

    12 years, 2 months ago

    roy27 – Would you mind posting the css that you added to styles.css and whatever code you added to header.php? I am trying to do the same thing and haven’t been able to get it to work.

    Thanks!

    Thread Starter roy27

    (@roy27)

    12 years, 2 months ago

    header.php: (I left some code that is allready there, so you know where to put it)

    <header id="branding" role="banner">
<p class="headlogo"><img src="<?php bloginfo('template_directory'); ?>/images/logo.png" /></p>

    CSS:

    p.headlogo
{
position:absolute;
top:-8px;
left:30px;
}

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘How to put logo on top of header image twentyeleven’ is closed to new replies.