Support » Theme: Twenty Twelve » Newbie layout question

  • Hi all – this may have been addressed elsewhere but I’m not sure how to look for it, term-wise. I am working on this web site

    http://www.isabelbyron.com

    and could use some help. On the main page, and on every page at the bottom there is a light gray double line. It is similar to the horizontal lines above and below the menu options “About, Consulting, etc…” My goal is to get rid of those two lines. Would appreciate any assistance with this.

    Thanks so much,

    Ryder

Viewing 15 replies - 1 through 15 (of 18 total)
  • You must create a child theme
    http://codex.wordpress.org/Child_Themes

    Or just download one from here
    http://quirm.net/themes/twenty-twelve-child

    After you have a child theme setup and activated properly, add this line in style.css of your child theme.

    .site-content article {border-bottom-color:transparent;}

    and also this below will get rid of shadow around the site logo

    #masthead img.header-image {border-radius:0;box-shadow:none;}

    Thank you for the fast reply. I made a folder in wp-content/themes and added the child theme. I inserted both the .site-content line and the #masthead line you recommended in this section of the style.css file:

    */

    .site-content article {border-bottom-color:transparent;}

    #masthead img.header-image {border-radius:0;box-shadow:none;}

    /*

    So far so good? But when I activate the child them,e all of the layout preferences are gone, and there are only hyperlinks where each of the menu items stood before.

    I also read in the codex.com guide about the @import method, and gave that a go, to no avail.

    I appreciate your help.

    R

    It’s easier to just look at the real working example.

    So please dl the child theme from second link above and take a look at the style.css and compare to yours, see if there is something you have missed.

    If done right, those 2 lines of css (or whatever else you might have later on) will be down below the @import line.

    It’s important that @import line must be there because child theme needs to import the whole parent’s css and then override (overwrite) only the part that need changed.

    Also, when editing code, you must use plain text editor, like notepad or notepad2 or notepadd++.

    Okay, I’m following your advice and I’ve downloaded the child theme. I have been using Textedit on a Mac.

    Altered the style.css to say:

    License URI: http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
    */

    @import url(“http://isabelbyron.com/wp-content/themes/twentytwelve/style.css”);

    .site-content article {border-bottom-color:transparent;}
    #masthead img.header-image {border-radius:0;box-shadow:none;}

    /* Copyright 2012 Mel P.

    Still encountering the same result… thinking it might have to do with the @import url, but as is obvious I am very new at this.

    Thanks again.

    That’s because you deleted the license comment but forget to take out one of the opening or closing css comment indicator, namely /* and */

    CSS comment
    http://reference.sitepoint.com/css/comments

    You have to make sure that the comment section is enclosed with /* AND */ , when one is missing, the css code will be misinterpreted as comments.

    From the look of what you posted above, I believe that if you just delete the last line OR put in the closing */ will fix the issue.

    EDIT: I just noticed the @import line, you can just use this (as in the example).

    @import url(../twentytwelve/style.css);

    First of all, you are awesome to help with this.

    Secondly, I am hoping you don’t mind looking at the entire css file, and telling me where to insert the code. I only copy and pasted a portion of the previous file to show how I had it formatted, but that is only confusing things – I’m still not confident about where this code should live. Here is the file without my having added the code:

    /*
    Theme Name:Twenty Twelve Child
    Version: 1.0
    Theme URI: http://quirm.net/themes
    Description: A basic starter child theme for Twenty Twelve
    Author: Mel Pedley
    Author URI: http://blackwidows.co.uk
    Template: twentytwelve
    License: GNU General Public License v2
    License URI: http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
    */

    /* Copyright 2012 Mel P. (email : esmi@quirm.net)

    This program is free software; you can redistribute it and/or modify
    it under the terms of the GNU General Public License version 2,
    as published by the Free Software Foundation.

    You may NOT assume that you can use any other version of the GPL.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program; if not, write to the Free Software
    Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301
    USA

    The license for this software can also likely be found here:
    http://www.gnu.org/licenses/gpl-2.0.html
    */

    /* Import layout */
    @import url(../twentytwelve/style.css);

    those 2 lines of css (or whatever else you might have later on) will be down below the @import line.

    That’s all.

    With the file above as is, just add css down below the @import line.

    Make sure the child theme is activated.

    Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    you are awesome to help with this.

    Totally agree!

    Hi Andrew, you and many others has been more awesome, we all like to contribute in some ways that we can.

    I am sorry to say I’m still not getting it!

    Okay, child theme, activated. Here is the new file:

    /*
    Theme Name:Twenty Twelve Child
    Version: 1.0
    Theme URI: http://quirm.net/themes
    Description: A basic starter child theme for Twenty Twelve
    Author: Mel Pedley
    Author URI: http://blackwidows.co.uk
    Template: twentytwelve
    License: GNU General Public License v2
    License URI: http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
    */

    /* Copyright 2012 Mel P. (email : esmi@quirm.net)

    This program is free software; you can redistribute it and/or modify
    it under the terms of the GNU General Public License version 2,
    as published by the Free Software Foundation.

    You may NOT assume that you can use any other version of the GPL.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program; if not, write to the Free Software
    Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301
    USA

    The license for this software can also likely be found here:
    http://www.gnu.org/licenses/gpl-2.0.html
    */

    /* Import layout */
    @import url(../twentytwelve/style.css);

    .site-content article {border-bottom-color:transparent;}

    #masthead img.header-image {border-radius:0;box-shadow:none;}

    Very thankful for the help.

    @leftlegforemost

    Please go to Appearance > header and background to reconfigure the settings.

    EDIT: please make sure you got child theme activated.

    When I activate the child theme, even after reconfiguring header and background, the formatting problems are still there. Because it’s hard to explain I will leave it implemented so you can see:

    http://www.isabelbyron.com

    Thanks.

    That’s because you changed the link in @import line.

    Just use as is.

    @import url(../twentytwelve/style.css);

    Actually, you already got it right in your code above.

    I’m afraid I don’t follow. I have written the @import line in the following ways with the same result:

    @import url(../twentytwelve/style.css);

    and

    @import url(http://isabelbyron.com/wp-content/themes/twentytwelve/style.css);

    Yes, but that’s not exactly the one you just used recently, that’s why it didn’t pull the parent’s style.

    Now, the child theme is properly setup.

    Next, you must go and put in site name and description, leaving both empty will result in bad SEO and site accessibility. Put in site name and desc, then go to Appearance > Header and choose not to display the text, the theme will properly hide the text for you.

Viewing 15 replies - 1 through 15 (of 18 total)
  • The topic ‘Newbie layout question’ is closed to new replies.