Integrate Woocommerce Product Search in header

Home Page 8DegreeThemes Forum Premium Themes WP Store Pro Integrate Woocommerce Product Search in header

  • Author
    Posts
  • #17852
    PurchasedWP Store Pro(306days Remaining)
    majeresmom
    Participant

    Hello,

    Would you be able to provide the code to swap out the default search in the header menu with the woocommerce product search extension? I am currently using WP Store Pro with a child theme to handle customizations.

    Thanks

  • #17855

    8Degree Themes
    Keymaster

    Hi There,

    You can check this post, it is similar query follow the same:
    https://8degreethemes.com/support/topic/problem-with-the-wp-store-search-engine/

    Thanks!

  • #17869
    PurchasedWP Store Pro(306days Remaining)
    majeresmom
    Participant

    1. The code in that link is different than the code I’m working with. That line doesn’t exist.
    2. What I’m trying to do is replace default search code with API code from the Woocommerce Product Search Extension. I’m not sure what part of the API I should be utilizing and where it goes in the code below.

    I think it’s this:

    <?php
      if ( function_exists( 'woocommerce_product_search' ) ) {
        echo woocommerce_product_search( array( 'limit' => 20 ) );
      }
    ?>

    Link to API:
    https://docs.woocommerce.com/document/woocommerce-product-search/api/

    Current code for search in my theme:

    <?php
    /**
      *
     * @package wp_store_pro
     */
    $search = get_theme_mod('wp_store_pro_header_setting_search_placeholder',__('Search...','wp-store-pro'));
    ?>
    <form method="get" class="searchform" action="<?php echo esc_url(home_url(/) ); ?>" role="search">
    	<input type="text" name="s" value="<?php echo esc_attr( get_search_query() ); ?>" class="search-field" placeholder="<?php echo esc_attr($search); ?>" />
    	<div class="search-in-select">
    		<select name="post_type" class="select-search-type">			
    			<option value="product">Product</option>			
    		</select>
    	</div>
    	<button type="submit"><span class="magnifier"></span></button>
    </form>
  • #17876

    8Degree Themes
    Keymaster

    Hi There,

    This will search only products as of now, if you even want to remove that product dropdown, let me know otherwise you do not need to add any api to make the search act like product search.

    If you could link site url it would be easy to understand things.
    Let me know if it is not like how you want it to be.

    Thanks!

  • #17887
    PurchasedWP Store Pro(306days Remaining)
    majeresmom
    Participant

    I’m sorry, I must not be explaining myself correctly. I currently have a product only search using the default search that came with the theme.

    What I want is to specifically integrate the woocommerce product search extension and make it the default product search instead. This is a plugin installed on my site, it does not ship with standard woocommerce. I want this because it has additional features the current search does not. That is the only reason I want it – because it has additional features that are useful to me.

    I need your assistance placing the extension API code in the theme. In my previous post, I provided the code I’m using that shows where I’m using default search. You’ll see I have it set to only display products. What I need is to please switch that to where it queries via the woocommerce product search plugin that is installed on my site. My previous post has a link to the plugin API.

    I hope this helps.

  • #17889

    8Degree Themes
    Keymaster

    Hi There,

    Try merging those codes, so the default search can use your plugin functionality if it exists like this:

    Replace the current code in search file:

    <?php
    /**
    *
    * @package wp_store_pro
    */
    $search = get_theme_mod('wp_store_pro_header_setting_search_placeholder',__('Search...','wp-store-pro'));
    ?>
    <form method="get" class="searchform" action="<?php echo esc_url(home_url(/) ); ?>" role="search">
    	<input type="text" name="s" value="<?php echo esc_attr( get_search_query() ); ?>" class="search-field" placeholder="<?php echo esc_attr($search); ?>" />
    	<div class="search-in-select">
    		<select name="post_type" class="select-search-type">			
    			<option value="product">Product</option>			
    		</select>
    	</div>
    	<button type="submit"><span class="magnifier"></span></button>
    </form>

    to

    this:

    <?php
    /**
    *
    * @package wp_store_pro
    */
    
    if ( function_exists( 'woocommerce_product_search' ) ) {
    	echo woocommerce_product_search( array( 'limit' => 20 ) );
    }
    else{
    	$search = get_theme_mod('wp_store_pro_header_setting_search_placeholder',__('Search...','wp-store-pro'));
    	?>
    	<form method="get" class="searchform" action="<?php echo esc_url(home_url(/) ); ?>" role="search">
    		<input type="text" name="s" value="<?php echo esc_attr( get_search_query() ); ?>" class="search-field" placeholder="<?php echo esc_attr($search); ?>" />
    		<div class="search-in-select">
    			<select name="post_type" class="select-search-type">			
    				<option value="product">Product</option>			
    			</select>
    		</div>
    		<button type="submit"><span class="magnifier"></span></button>
    	</form>
    	<?php
    }
    ?>

You must be logged in to reply to this topic.

Our New Release - Eight Degree Pro

Eight Degree Pro is a flexible WordPress theme with modern and mobile friendly design. This multipurpose WP template is suitable for building any kind of websites from blogs and portfolios to businesses. It comes with 3 predesigned demos with one click demo import features. Simply import the demo data and start customizing.

We've Launch offer 40% discount to our exclusive clients like you! Use coupon code customer during checkout. Get the theme only for $33 now (only for few days!)

Click on the below image for more detail.

Eight Degree Pro  WordPress Corporate Business Premium Theme

Please post your questions in the respective forum above.

All questions related to our Pro theme will be answered in less than 24 hours. All questions related to our Free theme will be answered in less than 48 hours.
Our Facebook page is the best place to get updated with themes, documentation, question/answers. Please like us here: