How do I remove mysterious Menu button above top navigation bar?

  • Unknown's avatar
    chiakilargent · Member ·

    A button saying ‘Menu’ have suddenly appeared above my top navigation bar and I would like to remove it but I don’t know how.

    Nothing happens if you click on the button. I have pages on my blog but not menus. I haven’t changed my template, layout or anything else for a long time so I haven’t done anything that could have made the button appear.

    How do I remove the mysterious Menu button?

    My blog is http://chiakicreates.com/

    Very grateful for any help as the button is really annoying me.

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    rachelmcr · Member ·

    Hi there,

    That menu button is showing up for a couple related reasons:

    First, there were some changes to the Yoko theme you’re using to make sure the menu works properly on mobile devices. That changed some of theme’s default CSS code.

    Second, your site’s custom CSS seems to be a full copy of an older version of the theme’s CSS. That becomes a problem when the theme’s default CSS is changed or fixed, because the changes may not appear correctly on your blog.

    I’d recommend that you remove the full copy of the Yoko theme CSS from your CSS editor. (To get to the CSS editor, go to your My Blogs page and click the Customize link under the blog’s title. In the Customizer, open the CSS section to find the CSS editor there.) Then, add back just the custom CSS rules that you want to have applied to your site, to overwrite those specific CSS rules from the theme’s default CSS with your custom rules.

    Please let me know if you have any questions about that. :)

  • Unknown's avatar
    chiakilargent · Member ·

    Hi,

    Thank you so much for your help! :)

    That’s what I was afraid the problem was. What you’re suggesting I do is of course what I should have done from the beginning. Silly of me really. I’m not a CSS expert so I just tweaked it until my blog looked the way I wanted it to. I can’t even remember all the things I changed, let alone what their rules are! It would take me an awful long time to figure that out so I’m not sure what to do now.

    This might be a long shot but do you or anyone else know what the rule for the menu button is called in the Yoko Theme CSS?

  • Unknown's avatar
    rachelmcr · Member ·

    Hi there,

    There are quite a few rules that apply to the menu button, but it may help to know that the menu button uses the menu-toggle CSS class. For example, this CSS hides that menu button:

    #branding #mainnav .menu-toggle {
        display: none;
}

    And this CSS will make the menu button appear on mobile devices (to help mobile users use the menu):

    @media screen and (max-width: 1024px) {
#branding #mainnav .menu-toggle {
        display: block;
}
}

    I hope that helps! If you’d like more help with your custom CSS, you might want to check out our Custom CSS support page or post in the CSS Customization forum:

    https://en.forums.wordpress.com/forum/css-customization

    The expert staff and volunteers in that forum can share other tips for working with your theme’s CSS. :)

  • Unknown's avatar
    chiakilargent · Member ·

    Hi,

    The pesky menu button is now hidden. :) Thank you so much for your help! I really appreciate it.

  • Unknown's avatar
    rachelmcr · Member ·

    You’re welcome! I’m so glad you got that CSS working the way you wanted it. :)

  • The topic ‘How do I remove mysterious Menu button above top navigation bar?’ is closed to new replies.