WordPress.org

Support

Support » Themes and Templates » [Resolved] 2012 Theme: how do I remove the header shadow?

[Resolved] 2012 Theme: how do I remove the header shadow?

  • Using 2012 on self-host and I’d like a nice clean white header. Have uploaded a borderless, transparent header image but the theme seems to have added a grey border/faint drop shadow around it. How do I remove this?

    Thanks for any idiot-proof step-by-steps you can give, chaps!
    Simon

Viewing 12 replies - 1 through 12 (of 12 total)
  • WPyogi

    @wpyogi

    Forum Moderator

    Do you have a Child Theme or custom CSS (via jetpack plugin for example) set up? That’s the first step so that your changes are not erased when WP is updated.

    HI there, thanks for replying (and so quickly!) No, I’ve literally just installed the site at my hosting company and uploaded the header image. I’d heard I should do a child theme if I’m tweaking it, but have no idea how to do that. Have just done a Plugin search and there’s one called Childthemify to create an instant child–should I use that?

    WPyogi

    @wpyogi

    Forum Moderator

    Personally, I would read the linked page and follow those directions for a child theme. But if you only want to make CSS changes (which is what the border removal involves), just install the jetpack plugin – it has custom CSS along with a bunch of other useful stuff.

    http://wordpress.org/extend/plugins/jetpack/

    OK, installed Jetpack–lots of interesting stuff there! But still none the wiser about how to use the CSS Stylesheet Editor that it brings up–don’t really want to learn to speak HTML fluently right now if I can avoid it! So is there a bit of code I just drop into the jetpack editor window?

    WPyogi

    @wpyogi

    Forum Moderator

    Yep, perfect, and try this:

    img.header-image {
        box-shadow: none;
    }

    Genius! That did it, thank you soooo much!

    I don’t suppose you know a bit of code to delete the two grey lines at the top of the page too? I may not do it but it would be nice to see what it looked like! Thanks again!
    Simon

    WPyogi

    @wpyogi

    Forum Moderator

    The best way to sleuth out these CSS issues is using a tool such as Firebug — as it will show you the CSS that is creating or affecting an element on your page — then you can copy that code to your custom CSS and make the changes there. So you might want to check it out! https://getfirebug.com/

    Can you post a link to the site so I can see which lines you are talking about?

    Sorry, yes the lines holding the top menu items:

    Couldn’t get the link thing to work here: it’s: http://www.nobodyscrolls.co.uk

    WPyogi

    @wpyogi

    Forum Moderator

    See if this does it:

    .main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul {
        border-bottom: 0;
        border-top: 0;
    }

    That’s it! Fabulous! Can’t thank you enough…like having my own live support person. I’ll check out Firebug, ’bout time I understood html properly. Cheers and goodnight from the UK!

    I just installed the 2012 theme. Is there any way to have share buttons across the top instead of on the side

    http://www.janetchanson.com

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    Sorry Janetchanson, you’ll have to create a thread to discuss that.

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘[Resolved] 2012 Theme: how do I remove the header shadow?’ is closed to new replies.