[Support request] Possible to condense both menus into one on mobile?

Home Forums Support [Support request] Possible to condense both menus into one on mobile?

Home Forums Support Possible to condense both menus into one on mobile?

  • This topic has 5 replies, 2 voices, and was last updated 5 years ago by Tom.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #221230
    wekhter

    I’m testing out GeneratePress for a site and I have a few questions:

    1) When there are two menus in the layout, in the mobile view there are two expandable “Menu” items. Is it possible to combine both menus into a single expandable mobile menu?

    As an example, here is the demo for the theme Canvas: https://demo.woothemes.com/canvas/

    In mobile view, both menus are part of a single navigation dropdown and each menu has a title to distinguish it (Primary Menu and Top Menu)

    2) When Masonry is enabled on blogs, is it possible to still keep pagination (instead of the Load More thing when you scroll down)?

    3) On the Blog Content setting, choosing Full Content vs Excerpt doesn’t really make a difference, except the excerpt option causes all shortcodes within a post to not work (in other words, it shows the whole post either way). What’s going on there? And is there a way to just NOT show any content at all? For certain custom post types all I need is the title/thumbnail.

    4) I like the option to conditionally not show certain page elements. Is there a way to do it for whole post types? There is a secondary menu I only want to show on custom post types, but not blog posts.

    #221243
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    1. There’s a couple of options here.

    a) Use the slideout menu for mobile – this allows you to create a separate menu for the slideout menu, so you can combine all of your items into the one menu.

    Then you can hide the secondary navigation completely on mobile:

    @media (max-width: 768px) {
        .secondary-navigation {
            display: none;
        }
    }

    b) Use the mobile header option, there’s a filter available that allows you to create a new theme location for the mobile header, so it would have the same effect as the above. Let me know if you need the code for that.

    2. Do-able, with some code.

    First, the CSS:

    .masonry-enabled .masonry-container .paging-navigation {
        display: none;
    }
    
    .masonry-enabled .masonry-load-more {
        display: none;
    }
    
    .masonry-enabled .paging-navigation {
        display: block;
        margin-right: 20px; /* if right sidebar, and 20px separating space */
        /* margin-left: 20px; if left sidebar, and 20px separating space */
    }

    Adding CSS: https://generatepress.com/knowledgebase/adding-css/

    Then, the PHP:

    add_action('generate_after_main_content','generate_blog_normal_pagination', 15);
    function generate_blog_normal_pagination()
    {
    	if ( ! function_exists( 'generate_blog_get_masonry' ) )
    		return;
    	
    	if ( generate_blog_get_masonry() == 'false' )
    		return;
    
    	generate_content_nav( 'nav-below' );
    }

    Adding PHP: https://generatepress.com/knowledgebase/adding-php-functions/

    3. That sounds very strange. Do you have the excerpt length set to anything?

    4. You could do this using CSS. WordPress adds classes to the element based on what you’re viewing. So you could hide the secondary navigation:

    .secondary-navigation {
        display: none;
    }

    Then display it on your post type. Let’s say your post type is named “topics”:

    .single-topics .secondary-navigation {
        display: block;
    }

    Hope this helps 🙂

    #221316
    wekhter

    Thanks for the seriously quick response!

    1) Ok, I’m experimenting with that now.

    2) ditto

    3) When I try the excerpt option I’ve tried many different numbers. Whether it’s 200, 50 or 1 the entire post shows up. This is with a custom post type, are there some compatibility issues with that?

    4) I know I can do this via CSS, I’m looking for a programmatic way to do it, like:

    if ( is_singular( 'product', 'animation' ) || is_post_type_archive( 'animation' ) ) {
    // show the secondary nav
    }
    else {
    // don't show it
    }
    #221349
    Tom
    Lead Developer
    Lead Developer

    3. There shouldn’t be, can you try #1 on this page?: https://generatepress.com/knowledgebase/debugging/

    4. You could hook and unhook it using add_action and remove_action. Which position is your secondary navigation in (above header, below header etc..)?

    #222501
    wekhter

    Accidentally refreshed the page and lost my message–boo!

    4) My secondary nav is positioned below the header

    #222530
    Tom
    Lead Developer
    Lead Developer

    Something like this might work:

    add_action( 'wp','generate_show_hide_secondary_nav' );
    function generate_show_hide_secondary_nav()
    {
        if ( is_singular( 'product', 'animation' ) || is_post_type_archive( 'animation' ) ) {
            // show the secondary nav
            add_action( 'generate_after_header', 'generate_add_secondary_navigation_after_header', 7 );
        } else {
            // don't show it
            remove_action( 'generate_after_header', 'generate_add_secondary_navigation_after_header', 7 );
        }
    }
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.