1. Home
  2. Knowledge Base
  3. Ascend Theme
  4. Ascend PHP Functions
  5. Ascend – Add Search to Secondary Menu

If using a child theme, you can add a search bar to your secondary menu by adding this function to your functions.php file.

add_filter('wp_nav_menu_items', 'custom_add_search_icon_to_second_menu_ascend', 10, 2);
function custom_add_search_icon_to_second_menu_ascend($items, $args) {
 
	if( !($args->theme_location == 'secondary_navigation') )
		return $items;
	
	ob_start();
	?> 
	<li class="menu-search-icon-kt">
		<a class="kt-menu-search-btn kt-pop-modal" data-mfp-src="#kt-extras-second-modal-search" href="<?php echo home_url().'/?s='; ?>">
			<span class="kt-extras-label"><i class="kt-icon-search"></i></span>
		</a>
	</li>
	<?php  $output  = ob_get_contents();
	ob_end_clean();

	return $items . $output;
}
add_action('wp_footer', 'custom_add_search_form_popup_to_footer_ascend', 5);
function custom_add_search_form_popup_to_footer_ascend() { ?>
    		<div class="mag-pop-modal mfp-hide mfp-with-anim kt-search-modal" id="kt-extras-second-modal-search" tabindex="-1" role="dialog" aria-hidden="true">
	            <div class="pop-modal-content">
	                <div class="pop-modal-body">
                        <?php
							get_product_search_form(); ?>
	                </div>
	            </div>
	        </div>
	   	<?php 
}

If you wish to instead use a WooCommerce search, change the

get_search_form();

to

get_product_search_form();

To learn more about and download a free child theme, visit this child theme tutorial.

Was this article helpful?