Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Adding Product Search extension to Storefront Header - This is how you swap out the WooTheme's default Product Search for Storefront for WooTheme's Product Search Extension. Drop the PHP into your child theme's functions.php. Drop the CSS into your child theme's style.css - enjoy
/* Remove Storefront Product Search in Header*/
add_action( 'init', 'jk_remove_storefront_header_search' );
function jk_remove_storefront_header_search() {
remove_action( 'storefront_header', 'storefront_product_search', 40 );
/* Add Product Search extension to replace default search product*/
if ( ! function_exists( 'storefront_all_search' ) ) {
function storefront_all_search() {
if ( function_exists( 'woocommerce_product_search' ) ) {
echo woocommerce_product_search();
} else {
} }
add_action('storefront_header', 'storefront_all_search', 40);
.product-search input.product-search-field[type="text"] {
float: right !important;
width: 22% !important;
.product-search.floating .product-search-results {
position: absolute;
z-index: 10;
background: #fff;
border: 1px solid #ccc;
margin: -1px 0 0;
float: right !important;
top: 70px !important;
right: 0 !important;
.product-search.floating .product-search-results:empty {
border: none;
float: right !important;
Copy link

mclanecreative commented Jun 15, 2016

The main thing on my wishlist about this particular extension is that it include toggles for including blog posts and special post types in responses... especially if the user can weight them.

Copy link

mclanecreative commented Dec 22, 2016

Thanks @BurlesonBrad

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment