Black Friday Sale! Get up to $40 off GP Premium!Learn more

[Resolved] navigation below 768px

Home Forums Support navigation below 768px

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #491947
    dasigna

    hi there,
    daring to post a question that might be answered before… (but couldnt find such)
    i know theres a solution for triggering the mobile nav at some higher value than 768px, but is there any solution to keep the standard navigation below that???

    having the (rare) situation with a navigation inheriting only three short items and would like to keep them shown down to approx. 680px and mobile nav chiming in at 659. basically at least the standard nav should still show up at 768 for table portrait, but currently at this point the hamburger is chiming in already.

    any way to achieve this?

    thanks in advance.

    #492332
    Leo
    Staff
    Customer Support

    Hi there,

    Unfortunately that’s not currently possible but it is a planned feature.

    Would completely disable mobile navigation so that the three items will always show work for you?

    #492369
    dasigna

    thanks leo, but pity.

    completely disable mobile navigation might work in this case, at least its worth giving it a try – if that means the sticky navigation would stay…

    whats the best way doing so? (ah – mobile header already is disabled btw.) css, php? couldnt get rid of it till now…

    #492383
    Leo
    Staff
    Customer Support
    #492404
    dasigna

    hmmmm…

    tried this

    add_action( 'wp_enqueue_scripts', 'generate_dequeue_mobile', 100 );
    function generate_dequeue_mobile() {
       wp_dequeue_style( 'generate-mobile-style' );
    }

    and worked in principle, mobile menu is gone – but the toggle in sticky still showed up… had to ‘kill’ it via css.
    any other way to get rid of it?

    #492680
    Tom
    Lead Developer
    Lead Developer

    I wonder if something as simple as this would work:

    @media (max-width: 768px) {
        .main-navigation .menu-toggle {
            display: none;
        }
    
        .main-navigation ul {
            display: flex;
        }
    }
    #492855
    dasigna

    hi tom,

    the first part already was (is) my solution and works well. have to have a look again if the second part is needed too…

    only wondered why the toggle still shows up besides the nav items although not needed, and thought there might have been smth wrong with the code.

    thanks again.

    #493057
    Tom
    Lead Developer
    Lead Developer

    Would have to see your site to know why the menu toggle is still showing up.

    It should be as easy as hiding it:

    .main-navigation .menu-toggle {
        display: none;
    }
    #495455
    dasigna

    hi tom,

    sorry for coming back late…
    everythings alright! already solved with the exact same css you provided – so no worry.

    second part of my reply was seemingly a little misleading, so sorry for that. at first i wondered why the toggle still appeared (only) in sticky (!) and at first feared something might be wrong with the code…
    but obviously not and the little css is needed anyway – right?

    so – sorry for the little confusion 🙂

    #495804
    Tom
    Lead Developer
    Lead Developer

    That’s right 🙂

    No problem at all! Glad it’s all working now!

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.