WordPress.org

Support

Support » Themes and Templates » Twenty eleven theme move header up

Twenty eleven theme move header up

  • Hi, I am a psychologist, not a computer programer…. That said, I THINK I am using WordPress 3.2 but it may be more recent (how do I tell?). I have searched questions and responses on how to move the header (and text below) up to get rid of the white space on Theme 2011. I got rid of the search box already and now just want to bring the image up flesh with the top of the page. My site is drpilger.com. I have tried to understand explanations for this but am a bit lost. I know how to go into the code for header but then can’t understand what I am looking at in order to move anything or delete anything. AND – I am afraid of crashing the site! Any help would be most appreciated!!

Viewing 15 replies - 1 through 15 (of 19 total)
  • Create a Child Theme, before you make modifications to the theme’s files. Then any modifications you want to make can be made inside the Child Theme.

    Hi Andy,

    I have already made several modifications to my site, including installing plugins that have gave me a taller header image, and custom fonts and colors. I have deliberately chosen a menu that is beneath the image rather than over top (which limits me in choosing child templates to migrate to (or maybe I don’t understand what a “child” is).

    Isn’t there a way that I can look at the code inside the site (I know where to find the header.php) and move some code around? If I just had a clear idea of what to move I would do it…

    Also, I am trying to make my site wider (if you look at it it is quite narrow!)

    Thank you for your help!! I really enjoy the creative part of this but I would like to get it done at some point before I retire!

    http://vudu.me/child also explains the importance of a child theme

    In a nutshell, any modifications you make to the 2011 theme will, at some point, be lost.

    Using plugins is safe, and not the same thing

    But you cannot modify any of the code in 2011 safely. A child theme is essential. 2010, 2011, and soon 2012 are default themes that ship with WordPress, when WP upgrades those files are overwritten and any modifications are lost.

    OK. Thank you both. So, this is a two step process: I will figure out how to create a child theme. Then I will figure out how to modify the code. Can I return to this site and ask for help once I have the child theme installed? I think I will still have the issue of how to move the header up…

    Of course! The important thing here, was to catch you and get you moving down the right path! Once you have the child theme thing figured out, we can proceed with modifications

    If this topic floats away by the time you get your child theme together, feel free to start a new post, and specify that you have already created a child theme

    Don’t be afraid to hit up google as well, there are many tutorials about modifying 2011 out there! I even have many on voodoopress.com to do with widening the theme and adjusting the headers – all revolving around using child themes

    Thanks! 🙂

    I did it! 🙂 I created a child theme for drpilger.com. This allowed me to make my menu longer in Theme 2011 (rather than having a two line menu my menu extends across the whole page!)

    My question is in 2 parts: When I make new modifications to my child theme, do I have to save a new file each time (I previously saved style.css and uploaded this file to my cpanel.). I want to get rid of the white space at the top of my site, drpilger.com. I want it to be the same color as the pad around the edges (the peach color).

    Thank you!!!

    WPyogi

    @wpyogi

    Forum Moderator

    Good job on the child theme!

    Add this to the new stylesheet:

    #page {
        margin: 0 auto;
    }
    
    #site-generator {
        display: none;
    }

    WPyogi, Thank you! Will that get rid of the white space or change the color? I just realized that what I need is a COLOR change, but keeping the border… (please see my edited post). Claudette

    WPyogi

    @wpyogi

    Forum Moderator

    Oh sorry, try this:

    #page {
        margin: 0 auto;
        padding-top: 2em;
    }

    Beautiful! Thank you 🙂 Can I ask you one last question, WPYogi? I would like to also do the same thing at the bottom margin — right now there is white space down there, too. It would be great if I could have it be the same peach color, thus “framing” the whole page. And, if it is possible, while I am at it, can I get rid of the “powered by wordpress?”

    WPyogi

    @wpyogi

    Forum Moderator

    Try this:

    #site-generator {
        display: none;
    }
    
    #colophon {
        background-color: #FBF2E9;
        padding-bottom: 2em;
    }

    Great. Really. Though I struggled for hours watching you tube videos in order to figure out how to install the child theme, once it was done, the editing, with your help, was simple and effective. Thanks again!

    Claudette

    WPyogi

    @wpyogi

    Forum Moderator

    You’re welcome. It gets easier with practice :). And you persevered — and got it done — which is what counts. BTW, a good CSS reference site is here:

    http://www.w3schools.com/css/

    And another invaluable CSS tool is Firebug (add-on for Firefox) — it will help you immensely with CSS work.

    Hi WyPogi,

    I am not sure what happened… I made the last change you suggested, which got rid of the blog posts at the bottom of my site (drpilger.com). It gave me a nice frame around the site, all peach. Everything looked great! Then I am not sure what I did, but now the blog posts are back (I only want them on the Twitter/Blog page, where they are, just fine!). Also, somehow my bio page has a weird look — instead of white it is peach and there is weird white space beneath the header. I am going to put the code on my child page below, because there isn’t much, in hopes you can spot the problem! (If you have the time. I would really appreciate it!)

    /*
    Theme Name: Twentyeleven Child
    Description: Child theme for the twentyeleven theme
    Author: Your name here
    Template: twentyeleven
    */
    
    @import url("../twentyeleven/style.css");
    
    /* Menu Fix to Full Width*/
    
    body {
    padding: 0 0;}
    
    #page {
    max-width: none;}
    
    #branding, #main, #footerMenu ul, #access ul {
    width: 1000px;
    margin: 0 auto;
    }
    
    #page {
        margin: 0 auto;
        padding-top: 2em;
        }
    
    #site-generator {
        display: none;
    }
    
    #colophon {
        background-color: #FBF2E9;
        padding-bottom: 2em;
    }

    Thank you!

    Claudette

Viewing 15 replies - 1 through 15 (of 19 total)
  • The topic ‘Twenty eleven theme move header up’ is closed to new replies.