Search bar and nav menu on mobile blocking header

The header image is a background, so any content in the header will appear on top of it. There isn’t really a way to ‘correct’ this I’m afraid, but if you describe the issue a little further and provide a link I may be able to make some suggestions.

Hi James

Thanks for responding. I have tried the various methods I found online to remove the search bar but they didn’t work. I also tried the display: none and it removed it from the desktop version but not the mobile version.

Here is the site:

https://www.giantkillerlabs.com

Thanks

Hey,

If you just want to remove the search bar try adding the following to your child themes functions.php file:

add_action( 'init', 'jk_remove_storefront_search' );
function jk_remove_storefront_search() {
remove_action( 'storefront_header', 'storefront_product_search', 	40 );
}

If you don’t want to touch any code, take a look at our Storefront WooCommerce Customiser extension which will allow you to do this (and more) from the WordPress Customizer.

PS, I’d recommend using the logo functionality to add a logo, rather than the header image functionality.

Hi

I added the code, but the search bar is still showing.

https://www.giantkillerlabs.com

Also when I used the logo function it showed multiple logos across the top – like it was tiling it?

Thanks

Hey, are you sure you added the code to your child themes functions.php file? And activated the child theme?

The logo function only adds one image. Use the logo functionality in Jetpack or the Storefront Site Logo plugin: https://www.ads-software.com/plugins/storefront-site-logo/

Thanks James. I got it to work properly with the logo function. Maybe I hadn’t removed the image from the header and it was still showing as tiles.