WordPress.org

Support

Header title

Viewing 15 replies - 1 through 15 (of 20 total)
  • Moderator t-p

    @t-p

    Thanks. But the link for the tutorial in that thread is not active.

    Moderator t-p

    @t-p

    start by creating a child theme of Twenty Eleven – do not edit the default theme directly.
    http://codex.wordpress.org/Child_Themes

    then edit header.php in the child theme;

    add your logo image code before:

    <hgroup>

    for example:
    <img class="header-logo" src="{absolute link to your image}" alt="" />
    if your image is saved as logo.png in the /images folder of the child theme, this could look like:
    <img class="header-logo" src="<?php echo get_stylesheet_directory_uri(); ?>/images/logo.png" alt="" />

    in style.css of the child theme, add:

    #branding .header-logo { width:auto; max-width: 100%; }
    #branding hgroup { display: none; }

    will need fine tuning of the formatting.
    please post a link if you need support with that.

    Alchymyth, I followed your code in the child theme in other thread:

    <hgroup>
    <img id=”site-logo-image” src=”http://www.soupup.us/wp-content/uploads/2012/12/SoUp4.jpg” alt=”” />

    And it doesn’t work for me.

    Your above code if different than your other suggestion and I can’t/don’t understand the above suggestion (don’t know where to access /images folder of the child theme). Please advise, thanks.

    don’t know where to access /images folder of the child theme

    then use the upload image url:

    <img class="header-logo" src="http://www.soupup.us/wp-content/uploads/2012/12/SoUp4.jpg" alt="" />

    general, to upload the image file into WordPress, you will need to use FTP or the file management system of your hoster; first, you also will need to create the /images folder in your child theme.

    First, I used this above code:

    <img class=”header-logo” src=”http://www.soupup.us/wp-content/uploads/2012/12/SoUp4.jpg” alt=”” />

    Still not working.

    Secondly, if I had an absolute link to the logo, “http://www.soupup.us/wp-content/uploads/2012/12/SoUp4.jpg”, like you suggested in the above code, why do I have to create /images folder in the theme child, which has nothing to do with the link suggested? Confused!

    Thanks

    And I did upload SoUp4.jpg in /wp-content/uploads/2012/12 folder.

    if I had an absolute link to the logo, “http://www.soupup.us/wp-content/uploads/2012/12/SoUp4.jpg”, like you suggested in the above code, why do I have to create /images folder in the theme child

    just alternatives – the one has nothing to do eith the other.

    some people rather upload any theme related images to the theme’s image folder; other people are fine using the absolute links to the images in the media ulpoads folder.

    the result is the same.

    Can you clarify which one is accurate:

    <hgroup>
    <img id=”site-logo-image” src=”http://www.soupup.us/wp-content/uploads/2012/12/SoUp4.jpg” alt=”” />

    or

    <hgroup>
    <img class=”header-logo” src=”http://www.soupup.us/wp-content/uploads/2012/12/SoUp4.jpg” alt=”” />

    first of all, remove all other invalid code from style.css of your child theme, after this line first:

    @import url("../twentyeleven/style.css");

    then save a copy of header.php from the parent theme as header.php into the child theme; edit this to add the code.

    both of your posted code alternatives should work;
    you will just need to add the corresponding css class to style.css of your child theme;

    for the first code alternative, use:
    #branding #site-logo-image { width: 300px; max-width: 100%; height: auto; }

    for the second alternative, use:
    #branding .header-logo { width: 300px; max-width: 100%; height: auto; }

    review:
    http://codex.wordpress.org/Child_Themes

    Where do I add one of these corresponding css class? at the end of header.php in the child theme?

    #branding #site-logo-image { width: 300px; max-width: 100%; height: auto; }
    or
    #branding .header-logo { width: 300px; max-width: 100%; height: auto; }

    I used the wrong words – should read:

    you will just need to add the corresponding styles for the css classes to style.css of your child theme

    yes, these styles need to be added to style.css in the child theme, anywhere after this line:
    @import url("../twentyeleven/style.css");

    Done everything you suggested and still not working. This is what I’ve done:

    #branding .header-logo { width: 300px; max-width: 100%; height: auto; }
    <hgroup>
    <img class=”header-logo” src=”http://www.soupup.us/wp-content/uploads/2012/12/SoUp4.jpg” alt=”” />
    <h2 id=”site-description”><?php bloginfo( ‘description’ ); ?></h2>
    </hgroup>

    when I added this code: #branding hgroup { display: none; }
    The title disappears but still no logo and the header image (I use slide show instead) moves up to the top page. AHHHHH!

    This is what I’ve done:

    where have you added that?

    Done everything you suggested and still not working.

    – do you have a copy of header.php in the child theme’s folder?

    – have you edited that header.php and added the image code before or after the line with <hgroup>?

    – have you added the style to style.css in the child theme, below this line:
    @import url("../twentyeleven/style.css");

    (btw: I see that you changed that line – change it back to what is was; it needs to point to the parent theme’s folder and style.css;

    how many style.css do you have in the ‘twentyeleven-child’ theme folder?)

Viewing 15 replies - 1 through 15 (of 20 total)
  • The topic ‘Header title’ is closed to new replies.
Skip to toolbar