Support » Theme: Twenty Twelve » [Theme: Twenty Twelve] Is there a way to get rid of the menu?

  • 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?


Viewing 12 replies - 1 through 12 (of 12 total)
  • 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.

    That worked! Thank you very much!

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

    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?

    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.

    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

    Try this instead of the above

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

    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.

    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.

    @ 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!.

    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?


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

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘[Theme: Twenty Twelve] Is there a way to get rid of the menu?’ is closed to new replies.