[Resolved] Add Third Navigation Menu GPP-1.8

Home Forums Support [Resolved] Add Third Navigation Menu GPP-1.8

Home Forums Support Add Third Navigation Menu GPP-1.8

  • This topic has 15 replies, 4 voices, and was last updated 3 months ago by Ying.
Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • #872487
    Karzan

    Hi,
    I have created a new menu under the name of”Third menu”
    I want to add this menu as a Third menu, below the Main navigation Menu(below Header) ,
    Could you help us to make a Hook or adding a code for Code Snippets
    to do this?

    I want it to be like this look at the picture below:

    https://drive.google.com/open?id=1SSy79_k8TGEKzPQMdHoN0XjccjLSWkIJ

    Really I Bought GP Premium and WP Show posts Pro because of their support and flexibility of the theme and your nice products.

    I will give + and 5 star in the WordPress review GPP theme and WP ShowPP as well.

    Thanks for your help.!

    I’m using GP Premium 1.8

    GeneratePress 2.2.2
    #873043
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    We’ll need to do this in parts.

    1. Create a new Hook Element: https://docs.generatepress.com/article/hooks-element-overview/
    2. Set your hook to after_header
    3. Check the Execute PHP checkbox
    4. Add this as your content:

    <div class="third-navigation">
        <?php wp_nav_menu( array( 'theme_location' => 'YOUR_MENU_NAME' ) ); ?>
    </div>

    Once you do that, we’ll need to style it with CSS. If it’s possible to add the above and let me know, I can help with the CSS.

    Thanks!

    #873314
    Karzan

    Hi Tom,
    First of all Thanks for creating such a nice theme(Generatepress Premium) and clean products,
    and thanks for your friends in the support team, great support.

    About the php code it works like this:
    https://drive.google.com/open?id=16Wm0GKeFJT0b8J71V4ve7weivXleidbm

    ,as you see it brings all other pages from other menus like (main menu and secondary menu)
    As you know it should brings only the third menu pages, if I’m not wrong!
    So I need your help with php fetch menu and the CSS code, please.

    Thanks a Million Tom Usborne!

    #873635
    Tom
    Lead Developer
    Lead Developer

    Did you create your third menu in “Appearance > Menus” and set it to your newly created theme location?

    If you haven’t created a theme location, you can do so like this:

    add_action( 'init', function() {
        register_nav_menu( 'third-menu', __( 'Third Menu' ) );
    } );

    Then your hook code would look like this:

    <div class="third-navigation">
        <?php wp_nav_menu( array( 'theme_location' => 'third-menu' ) ); ?>
    </div>

    Just be sure to add your newly created menu to that “Third Menu” location.

    Thank you! Glad you’re enjoying the theme πŸ™‚

    #873715
    Karzan

    Hi Tom,
    It works, Great! thanks a lot…

    Just information for other newly GPP customers, I have added the third Navigation Menu without using child theme,
    just using GP hook, and code snippets plugin.
    Please see,
    https://drive.google.com/open?id=1C543LTEHPHDGc4btsnEMSGBCInSHMa9z

    Sorry I was missed to create a theme location, which there was created the issue,

    So let’s do add custom CSS code, Tom please,

    Really I feel happy while I’m using GP Premium theme, :).

    Great Great support.!

    Best Regards,
    Karzan

    #873894
    Tom
    Lead Developer
    Lead Developer

    Awesome! We’re getting close πŸ™‚

    Now let’s add this:

    .third-navigation ul {
        list-style-type: none;
        margin: 0;
    }
    
    .third-navigation ul {
        display: flex;
        justify-content: center;
    }
    
    .third-navigation .menu > li:nth-child(2) {
        margin-right: 200px;
    }
    
    .third-navigation a {
        padding: 0 20px;
        line-height: 40px;
        color: #a51c30;
    }

    Better?

    #875899
    Karzan

    Hi Tom,

    Thank you so much, it works great as I expected πŸ™‚
    Please see as I promise you deserve 5 star for theme and support :
    https://wordpress.org/support/users/karzan2017/reviews/

    And sorry for I was late in answering,
    I need your help please with custom CSS code, related with (menu)s

    1- I don’t know how to balance padding of(main menu pages) to be all of them have the same margin and padding.
    Please see the differences:
    https://drive.google.com/open?id=1kn95UU8wlvRO6aC8dD-NtPizrjil6VsV
    Is there any way to be give each pages on main menu its own width & height(250×50)equally regarding word numbers.
    https://drive.google.com/open?id=1bY0jwITlqvhmsNWY-cpF2juEmuZaBgtF

    2- I want to fix top bar(Secondary Navigation) with sticky main menu, visible with scroll?

    Note: Target website with my website added please.

    I appreciate your help Tom, you have super support.
    I have a plan to give WP Show Posts + and another 5 star, πŸ™‚

    Best Regards,
    Karzan

    #876025
    Tom
    Lead Developer
    Lead Developer

    Thank you! πŸ™‚

    1. How can I replicate that second screenshot? All of the items should have the same padding. The second one does have margin forcing the third item to appear on the other side of the logo: http://prntscr.com/nfj2t7

    That margin can be adjusted to move it left or right.

    2. This might be difficult, but let’s try this:

    .secondary-navigation {
        position: sticky;
        top: 0;
    }
    
    #sticky-navigation {
        top: 40px !important; /* height of the secondary nav */
    }

    Let me know πŸ™‚

    #877148
    Karzan

    Hi Tom,
    I hope you are doing well,

    1- I got it.
    2-It works as always great!fixed top nav, Thank you so much for your help.

    Best Regards.
    Karzan

    #877500
    Tom
    Lead Developer
    Lead Developer

    Awesome, glad I could help πŸ™‚

    #1616867
    Jennifer

    Hi Tom,

    I added this custom menu to my website as well. Can you help me with the custom coding on drop down menus. I have all the coding listed here. Any help would be appreciated, thank you.

    —————————————-
    Added custom code to functions.php
    —————————————-

    /*from WPBeginner add custom menus https://www.wpbeginner.com/wp-themes/how-to-add-custom-navigation-menus-in-wordpress-3-0-themes/*/
    function wpb_custom_new_menu() {
      register_nav_menus(
        array(
          'billing-menu' => __( 'Billing Menu' ),
          'legalsec-menu' => __( 'Legal Sec Menu' )
        )
      );
    }
    add_action( 'init', 'wpb_custom_new_menu' );
    

    —————————————–
    Added this code as a hook element
    —————————————–

    <style>.third-navigation ul {
        list-style-type: none;
        margin: 0;
    }
    
    .third-navigation ul {
        display: flex;
        justify-content: center;
    }
    
    .third-navigation .menu > li:nth-child(2) {
        margin-right: 200px;
    }
    
    .third-navigation a {
        padding: 0 20px;
        line-height: 40px;
        color: #a51c30;
    }</style>
    <div class="third-navigation">
        <?php wp_nav_menu( array( 'theme_location' => 'billing-menu' ) ); ?>
    </div>
    

    —————————–
    Here is what it looks like. Can you help me create dropdown menus?
    —————————–
    https://crm.uslawpros.com/wp-content/uploads/2021/01/GPnewmenu1.png
    https://crm.uslawpros.com/wp-content/uploads/2021/01/GPnewmenu2.png

    Thank you

    Jennifer
    Living His Word Ministries, Inc.
    www.livinghisword.org

    #1617652
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    You’ll need to implement some custom CSS based on your menu item set up.

    For example:
    https://www.w3schools.com/howto/howto_css_dropdown.asp
    https://css-tricks.com/solved-with-css-dropdown-menus/

    If you get stuck along the way, feel free to open a new topic and we’ll see if we can point you in the right direction.

    Thanks!

    #1688495
    Chloe

    Hi there

    I have implemented this on my site also. It is great. I use elements to show menus on specific pages which is great. The only issue is that they all go strange on mobile. I am not sure how to rectify this. Might you be able to help?

    Many thanks

    Clojo

    #1688547
    Ying
    Staff
    Customer Support

    Hi Chloe,

    Could you open a new topic for your question?
    And use the private info field link us to your site.

    Thanks!

    #1688626
    Chloe
Viewing 15 posts - 1 through 15 (of 16 total)
  • You must be logged in to reply to this topic.