[Plugin: WooCommerce Predictive Search] Woo Search in the header?

Hi ifrog,

The Pro version of the plugin has a function for placing Predictive Search anywhere in your theme, including the header. The lite version does not support this. See the Pro Version advanced features here.

I want to do this as well. I have inserted the code into the search.php file for my site

Im fairly new to this so need it explaining simply if possible, how to I get the search bar in the top header of the page (as on the demo at: https://www.kriesi.at/themedemo/?theme=abundance)
to use the predictive search bar I have gotten (that can be seen here: https://www.ads-software.com/extend/plugins/woocommerce-predictive-search/screenshots/)

I have pasted the PHP code into the search.php file and deleted what was there before but the only problem is it spams the whole top of the search bar instead of sitting at the site as I would like. Can any one advice me a better way to do this or to resize the box somehow?

Thanks in advance.

Hi Steve, I want to do this as well. I purchased the pro version, pasted the function code into my header.php and get the predictive search bar, but can’t control it with the parameters supplied – I get errors.

Code
<?php if(function_exists('woo_predictive_search_widget')) woo_predictive_search_widget($character_max(20)); ?>

Error
Fatal error: Function name must be a string in /path/path/path/themes/mystile/header.php on line 57

Can you help?

Hello pixelsoup,

this code you used is wrong

<?php if(function_exists('woo_predictive_search_widget')) woo_predictive_search_widget($character_max(20)); ?>

You have tried to add a max characters function to the default master code.

By that I mean you enter this code

<?php if(function_exists('woo_predictive_search_widget')) woo_predictive_search_widget(); ?>

Which shows the default settings

If you want to over ride the defaults then you should write the function like this

<?php if(function_exists('woo_predictive_search_widget')) woo_predictive_search_widget(6, 0, 0, 0, 0, 0, 20, 'width:200px', true); ?>

But you have got me thinking that would could make this much easier if we enabled it on the admin panel of the Pro version plugin where you just enter the values for the functions and update then just copy and paste the master function into your header.php

That would look something like this

Generate Search Function script:
Enter values for (leave empty for not activated)
Product name [ ]
Product SKU [ ]
Product category [ ]
Product tag [ ]
Post [ ]
Page [ ]
Description Characters [ ]
Padding top [ ]px
Padding bottom [ ]px
Padding left [ ]px
Padding right [ ]px
Global search [true]
Width [ ]px empty to 100%
Custom style [ ] put other custom style for this search box on themes that do not follow the WordPress or WooCommerce codex when it comes to position elements in the header – like the Abundance Theme and Mayashop Theme.

With this in place you will be able to just enter the values – Update then copy and paste the master function into your header.php

<?php if(function_exists(‘woo_predictive_search_widget’)) woo_predictive_search_widget(); ?>

Anytime you want to change it you just make the changes on the Predictive Search admin tab on the WooCommerce shop and update. Won’t have to touch the php file.

This upgrade should be out later today. Thanks

I received help from a friend. Paste code below in header.asp where you want the search box to show. Edit the values to manipulate search results. For example change $character_max = 50; to $character_max = 20; if you want a shorter description per result.

<?php
		$product_name_items = 10;
		$product_sku_items = 0;
		$product_category_items = 10;
		$product_tag_items = 0;
		$post_items = 0;
		$page_items = 10;
		$character_max = 50;
		$style = "padding: 10px 0 10px 0; width: 200px; float: right;";
		$global_search = "true";
	 ?>
        <?php if(function_exists('woo_predictive_search_widget')) woo_predictive_search_widget($product_name_items, $product_sku_items, $product_category_items, $product_tag_items, $post_items, $page_items, $character_max, $style, $global_search);
	?>

Hi pixelsoup,

gee wiz this is annoying – i did post to you how to fix that earlier today – but its gone. Hmm

Hi ifrog, you can add a new widget area to anywhere in your website using this plugin: “Custom Widget Area”

Just add the plugin & this code to call up your new widget area in your header.php (for example). Then look at your widgets in your wordpress dashboard and a new area will have been added for you to drop widgets into.

<?php if (!function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Header Widget Area’)) :

endif; ?>

sorry my connection lagged and I posted my previous comment 3 times

sorry my connection lagged and I posted my previous comment 3 times

Hi Steve,
Thanks for getting back to me. Much appreciated (sorry – a bit of a time delay on my side). I realised hours after I posted my question you released an update that made my query (problem) disappear. Your post is a great resource for the plug-in. Awesome.

I utilized all your suggestions. The search does not ever return results. It jus says keep typing. Then when you hit enter it takes you to an empty page, with no results.

What am I doing wrong here?

I’m a little confused and kinda bummed.

Thanks.