[Resolved] Top Menu with Search Bar

Home Forums Support [Resolved] Top Menu with Search Bar

Home Forums Support Top Menu with Search Bar

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #229415
    Jose Miguel

    Hi Tom.

    I was talking with you about the menu that I created.

    I already purchased and configured the “Secondary Nav” add-on πŸ™‚

    1

    But, I would like to see it of this way

    2

    Can you help me? Thanks πŸ™‚

    #229416
    Tom
    Lead Developer
    Lead Developer

    Hi Jose,

    Thanks for your purchase!

    Give this a shot:

    add_action( 'generate_inside_secondary_navigation','generate_search_secondary_navigation' );
    function generate_search_secondary_navigation()
    {
        ?>
        <span class="secondary-nav-search">
            <?php get_search_form(); ?>
        </span>
        <?php
    }

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

    .secondary-nav-search {
        float: right;
    }
    
    .secondary-nav-search input.search-submit {
        display: none;
    }
    
    .secondary-nav-search input.search-field {
        padding: 7px 15px 8px;
    }

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

    Hope this helps πŸ™‚

    #229419
    Jose Miguel

    It works perfect tom, thanks you very much πŸ™‚

    I just have two questions.

    How Can I do to move the secondary menu above of the primary menu? and Can I change the default color of the secondary menu text with any CSS?

    Is it possible?

    #229429
    Tom
    Lead Developer
    Lead Developer

    By default, it will always display below the primary menu, as by nature it’s the secondary menu.

    It’s possible to move them, but I’ll need to know which position you have them in (Below Header, Above Header etc..).

    The colors can be changed using the Colors add-on. If you can’t get that, you’ll need to use CSS.

    For the CSS, you can use this: https://gist.github.com/generatepress/793804f553c25c70823c

    However, you’ll need to change .main-navigation to .secondary-navigation throughout the code.

    Hope this helps πŸ™‚

    #229543
    Jose Miguel

    Thank you tom!

    All the code works perfectly but when I use it, the title of the main menu on mobile disappears.

    I mean, the mobile menu is working but I do not see the word “Menu” where the visitors must to do click to open it.

    Do you think that the CSS of the secondary nav that I am using is creating conflict with the colors of the primary menu?

    #229581
    Tom
    Lead Developer
    Lead Developer

    Ah yea, there’s a class in there that looks like this:

    .menu-toggle

    It should be:

    .secondary-navigation .menu-toggle

    Hope this helps πŸ™‚

    #229589
    Jose Miguel

    Completely!

    Great support, thank you so much my friend πŸ™‚

    #229590
    Tom
    Lead Developer
    Lead Developer

    You’re welcome πŸ™‚

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