How to show menu items permanently on mobile?

  • kenielts · Member ·

    Hi again,

    I’ve tried to custom the mobile menu and have come with a quite pleasurable display. There are just a few things remaining I would like to ask you for help.

    Firstly, How can I show the menu items permanently? What I mean is I don’t need to touch/tap on the menu for the menu items to appear.

    And secondly, when tapping on the menu, logo, or links I see a pale blue color appear and disappear quickly (not the hover or copy effect). How can I turn it off?

    Thanks,
    Ken

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

  • binarymoon · Theme Author ·

    To force the menu to always display, and hide the menu toggle button you can use:

    .menu-primary .menu ul {
    display: block !important;
}

.menu-toggle {
    display: none !important;
}

    However, on mobile they cover the date so you might want to align them to the right, or hide the date?

    Hide date:

    .masthead .postmetadata {
    display: none;
}

    Align right:

    .menu-primary .menu ul {
    text-align:right
}

    The blue box that flashes when you tap things – is a thing that happens on mobile. I had to Google how to do this since I’ve never changed it before. The following seems to work:

    header.masthead {
    -webkit-tap-highlight-color: transparent;
}

    Cheers – Ben

  • kenielts · Member ·

    Those codes helped me think of many ways to modify the menu’s behaviors.

    Thanks

  • kenielts · Member ·

    Unfortunately, the code below doesn’t have an effect on the color. I pasted it to my CSS, but it turned red, which might mean it wasn’t suitable for the theme. 

    header.masthead {
    -webkit-tap-highlight-color: transparent;
}

    There might be a trick for that, but if it cannot be removed, I feel perfectly fine.

    Thanks for spending time on the issue.

  • binarymoon · Theme Author ·

    Oh – the problem is that WordPress.com limits the css you can add to the customizer. This is to prevent people from doing anything insecure (essentially to stop hacking). They have to manually add support for every CSS property so less common/ new ones don’t get added. It looks like this is one of those – so I think it’s going to have to stay.

    Ben

  • kenielts · Member ·

    Got it. Thank you.

  • The topic ‘How to show menu items permanently on mobile?’ is closed to new replies.