Okay
  Public Ticket #1643286
Mobile navigation : parent menu no link
Closed

Comments

  •  4
    MissZougou started the conversation

    Hello !

    My mega menu is using a parent item with no link (contains 3 sub items).
    On mobile device (with the hamburger menu), i must click on the arrow (span.coll_btn) to display the submenus. By clicking, on the parent item label, it does nothing because the href attribute is #.

    I would like that to display the submenus by clicking on the parent item label ?

    How can i achieve that ?

    Thanks in advance for your hep

  •  313
    OrionThemes replied

    Hi,

    This is a bit beyond theme support, as it is a custom functionality. 

    However it is simple and can be achieved with couple lines of CSS.
    Basically you need to find the id of your menu, then you can apply the styling for the coll_btn to cover the whole menu item.

    Something like this would do it:

    @media (max-width: 991px) {
        #menu-item-123 a .coll_btn {
            width: 100%;
        }
        #menu-item-123 a .coll_btn i {
            margin-right: 2px; 
            float: right;
        }
    }

    I hope this helps.

    Andrej

  •  4
    MissZougou replied

    Thanks a lot Andrej for your time !

    I have several parent nav with no link, so i modified your code to :

    @media (max-width: 991px) {
        .menu-item-has-children .coll_btn {
            width: 100% !important;
            cursor: pointer !important;
        }
        .menu-item-has-children .coll_btn i {
            margin-right: 2px !important;
            float: right !important;
        }
    }

    Notice that i removed the selector 'a' (it didn't work)

    Thanks again ^^

  •  313
    OrionThemes replied

    Aha, I see, the coll_btn is not inside the link, but only inside li... I am glad you managed to resolve it.

    Cheers,
    Andrej