Okay
  Public Ticket #184790
responsive secondary menu
Closed

Comments

  • Kevin started the conversation

    On this site, the "secondary" menu in the top bar remains visible as discrete text items when in mobile/responsive view, but the main menu collapses. Its confusing because you don't really see the main menu. Is there some way to eliminate the secondary menu in the narrow responsive view or also have it collapse? See attached. For most of the sites we build, the top/secondary menu is not as important as the main menu, but it doesn't behave that way....

  •  8,839
    Tahir replied

    Hey Kevin!

    You can remove the secondary nav in ipad and mobile view using below custom css:

    @media only screen 
    and (min-width : 1px) and (max-width : 1000px) {
        #header-secondary-outer ul.sf-menu {
            display:none;
        }
    }
    

    If you want to remove the whole secondary menu including social icons use this:

    @media only screen 
    and (min-width : 1px) and (max-width : 1000px) {
        #header-secondary-outer {
            display:none;
        }
        }
    

    For mobile only:

    @media only screen and (max-width: 470px) {
    
    {
        #header-secondary-outer {
            display:none;
        }
     }
    

    Cheers


    ThemeNectar Support Team 

  • Kevin replied

    thanks! Any idea if there is a way to make the secondary nav collapse into a similar "menu" as the main nav?

  •  8,839
    Tahir replied

    Hey Kevin!

    Its a good idea and have added it to the wishlist but unfortunately this would require some custom development. If you really need this modification done you could head on over to microlancer which is a service from Envato that offers paid WordPress customizations. I'm sure a developer on there would be able to wrap this up for you :)

    Thanks


    ThemeNectar Support Team 

  • Kevin replied

    Thanks - we will figure it out ourselves. just thought I would ask! Much appreciated.

  • Tobias replied

    Hi

    I had to create a new custom.css file and add to header to get that code to work as it didnt in custom css within WP Salient options? Many custom css codes dont take effect from there.

    Any idea how I can guarantee custom code so I dont have to worry about it being overwritten on an upgrade?

    Thanks

  •  8,839
    Tahir replied

    Hey Tobias!

    We have had no reports of custom css functionality not working . Maybe the css you added was not having an effect due to the lower specificity of the css selectors. Simply said it did not take priority over the theme styles. 

    Thanks


    ThemeNectar Support Team