Docs

[duncanartwork]

Hi,
I’m developing a website for a client, and was wondering if it is possible to get the search icon normally found in the navbar menu to be in the top bar? I’ve tried looking through several posts and trying the solutions that worked for others, but they haven’t worked for me yet.

I am using the Renew stack.

Thank you!

[duncanartwork]

This reply has been marked as private.

[Nabeel A]

Hi there,

Thanks for writing in! This can be done with custom coding. First add this code in Appearance > Customize > Header > MISCELLANEOUS > Topbar Content

<a href="#" class="x-btn-navbar-search"><span><i class="x-icon-search" data-x-icon="" aria-hidden="true"></i><span class="x-hidden-desktop"> Search</span></span></a>

And then in your child theme’s functions.php file add the following code:

// Navbar Search Navigation Item
// =============================================================================

if ( ! function_exists( 'x_navbar_search_navigation_item' ) ) :
  function x_navbar_search_navigation_item( $items, $args ) {

    if ( x_get_option( 'x_header_search_enable', '' ) == '1' ) {
      if ( $args->menu == 'topbar-menu' ) {
        $items .= '<li class="menu-item x-menu-item x-menu-item-search">'
                  . '<a href="#" class="x-btn-navbar-search">'
                    . '<span><i class="x-icon x-icon-search"></i><span class="x-hidden-desktop"> ' . __( 'Search', '__x__' ) . '</span></span>'
                  . '</a>'
                . '</li>';
      }
    }

    return $items;

  }
  add_filter( 'wp_nav_menu_items', 'x_navbar_search_navigation_item', 9999, 2 );
endif;

Let us know how this goes!

[Author]

Posts