WordPress.org

Ready to get started?Download WordPress

Forums

Twenty Twelve
Is there a way to get rid of the menu? (13 posts)

  1. phillipc421
    Member
    Posted 1 year ago #

    Hey there,

    I'd like to get rid of the menu and use the theme as a one-page site. Is there way to do this?

    Thanks,
    Phillip

  2. paulwpxp
    Font hero
    Posted 1 year ago #

    Use this bit of CSS in TwentyTwelve child theme's style sheet.

    .nav-menu {display:none;}
    .main-navigation {border-bottom:1px solid #ededed;}

    It will only hide ( display:none; ) the appearance of menu from front but still keep the associative text for accessibility and if you decide later to have a menu back then you can just delete these 2 lines.

    In addition to that, to also not having any menu item in the source code, just make 1 menu item with an empty link or a link pointing to your homepage.

  3. phillipc421
    Member
    Posted 1 year ago #

    That worked! Thank you very much!

  4. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Per your other thread, make sure you are not making changes to theme files directly - use a child theme or custom CSS.

  5. phillipc421
    Member
    Posted 1 year ago #

    I've been making the edits in the custom CSS option in the WP dashboard. That worked to hide the menu, but the menu button appears on mobile devices, just with no option once clicked. Is there a way to hide that as well?

  6. paulwpxp
    Font hero
    Posted 1 year ago #

    So you have Jetpack installed ?

    IF it's a yes, THEN I can't help any further, because Jetpack has its own way of doing stuff, you should go ask directly to the Jetpack support team.

    or you might try deactivated some modules that you think it might cause this.

  7. phillipc421
    Member
    Posted 1 year ago #

    I have jetpack installed, but the mobile theme is disabled. I thought maybe the menu item appearing when the browser is re-sized to smaller sizes was a result of the theme being responsive

  8. paulwpxp
    Font hero
    Posted 1 year ago #

    Try this instead of the above

    .nav-menu, .menu-toggle {display:none;}
    .main-navigation {border-bottom:1px solid #ededed;}
  9. phillipc421
    Member
    Posted 1 year ago #

    Hey that worked! Thanks again! If you wouldn't mind, could you tell me how that was different and why it worked? I'm just trying to learn more.

  10. paulwpxp
    Font hero
    Posted 1 year ago #

    Actually, it's nothing much. It's just the .menu-toggle which is (default in TwentyTwelve) as display:none in screen wider than 600px and display:inline-block in anything smaller.

    The first time, it works but only on screen wider than 600px and I forgot the responsive-ness of the theme until you pointed it out, so all we have to do is just display:none the .menu-toggle too.

    And to save the space in CSS you can put together the elements (selectors) that share the same properties by using comma, that's all.

    Note: to be able to understand it clearly, you have to take a look at the html structure of this part too, it's in header.php.

  11. rajeevthomas
    Member
    Posted 1 year ago #

    @ paulwpxp - thank you very much for your help with 'MENU' button. You are the only one I could find so far who could explain it well and helped us to remove it...thank you from a newbie!.

  12. lasnark
    Member
    Posted 1 year ago #

    I was able to remove the top nav using the instructions above, but I still have a line above my custom header image. Do you know how I would go about removing that?

    http://www.lasnark.com

    Thanks!

  13. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    @lasnark - you should be using a Child Theme for any modifications to twentytwelve. Also, please start your own thread -

    http://wordpress.org/support/theme/twentytwelve

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic