[Resolved] [Feature request] Custom header element mobile menu breakpoint

Home Forums Support [Feature request] Custom header element mobile menu breakpoint

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1459192
    George

    Since on a header element we sometimes tend to change navigation logos and color to fit with the design, wouldn’t it be great for an option to existing to change the navigation mobile menu breakpoint conditionally?

    Anyway, is there an easy way to modify the navigation mobile menu breakpoint for category archives? I am using a narrower version of the logo and would like to reduce the breakpoint number.

    #1459197
    Leo
    Staff
    Customer Support
    #1459209
    George

    It’s a thing of beauty, Leo, thanks so much!

    Here is the code:

    add_filter( 'generate_mobile_menu_media_query', function() {
    	if ( is_category() ) {
    		return '(max-width: 860px)';
    	} else {
    		return '(max-width: 1000px)';
    	}
    		
    } );

    Seems like the filter takes over from any existing mobile breakpoint settings from the Customizer so it needed an else statement.

    #1459334
    Leo
    Staff
    Customer Support

    You could try this without the else statement:

    add_filter( 'generate_mobile_menu_media_query', function( $width ) {
        if ( is_category() ) {
            $width = '(max-width: 860px)';
        }
        return $width;
    } );
    #1459637
    George

    That’s very cool, Leo. Would I need to adjust the not mobile media query as well as mentioned in the article? How would I do that? My current code is:

    add_filter( 'generate_mobile_menu_media_query', function( $width ) {
    	$slug = basename(get_permalink());
        if ( is_category() || $slug == "news" ) {
            $width = '(max-width: 860px)';
        }
        return $width;
    } );
    #1460083
    Leo
    Staff
    Customer Support

    Should be very similar like this:

    add_filter( 'generate_not_mobile_menu_media_query', function( $width ) {
        if ( is_category() ) {
            $width = '(min-width: 861px)';
        }
        return $width;
    } );
    #1460186
    George

    Perfect, thanks Leo!

    #1460232
    Leo
    Staff
    Customer Support
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.