Header search button on a Shopify site (foxmart.co.uk) is not working despite clearing cache and no recent code changes.
Proposed fix 1: Add a JavaScript snippet before the closing tag in theme.liquid (Online Store > Themes > Edit code). The user placed a script there, but it did not resolve the issue; the exact script content is not shown.
Proposed fix 2: In header.liquid (Sections), locate the header element by the referenced class from the screenshot, change the search trigger from a div to a button, and add CSS at the end of timber.scss.css: .search-bar__input + .input-group-btn { border: none !important; } This aims to ensure the search button is clickable and styled correctly.
Technical notes: theme.liquid is the main layout file where global scripts can be added; header.liquid controls the header markup; CSS affects button styling and layout.
Status: Unresolved. The script-based approach did not work; the markup and CSS changes are suggested next. Screenshots are provided to illustrate code locations and the attempted script placement. Key questions (e.g., missing JS handler or incorrect markup) remain open.
I am trying to fix the search button on the header of my website : https://www.foxmart.co.uk/
I tried clearing cache and updates nothing worked, and I didn’t change any codes as well. Don’t know why the search is not working. Can someone help? Thanks.
Hi @swsajid ,
You can try to solve the issue by adding this script before tag in your Online Store > Themes > Edit code > theme.liquid file
For make search button working follow below steps:
find by that class in header.liquid file and then change div with button and make code like this.
and also add css at bottom of timber.scss.css file
.search-bar__input + .input-group-btn {
border: none !important;
}
Hope my solution work well for your site,
Best Regards !
