Add Expandable Submenu Items to Main Menu in the Tablet Version of the Website

  • In the tablet version, I want the submenu parts of the main menu items to show up on hover. How do I go about it?

    Currently all the submenu items show up in the tablet version. This gives the main menu a very busy, cluttered look.

    Many forums suggest using the following code:

    ‘.nav-menu li > a:after {
    color: #444;
    content: ‘ ?’;
    }

    .nav-menu li > a:only-child:after {
    content: ”;
    }’

    But this doesn’t seem to work. Where do I include this code? Or any other alternative code.

Viewing 3 replies - 1 through 3 (of 3 total)

  • Tablets are touch screens and do not use “hover”, they would have to open on click (assuming your top-level is not an actual page).

    That code above is just to show an arrow indicating there are child items.

    Do you have a link to your site?

    Thread Starter ravsingh

    (@ravsingh)

    Hi Janet,

    Thanks. Here it is.

    exp.medicaltourismco.com

    It is just that the menu looks very busy in the tablet view.

    If not hover, then perhaps we could have an expandable menu.

    You can try WP Responsive Menu Plugin. I think this will look and function much better than what you have and you don’t have to modify your code.

    https://www.ads-software.com/plugins/wp-responsive-menu/

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Add Expandable Submenu Items to Main Menu in the Tablet Version of the Website’ is closed to new replies.