Read this blog on partial word search in Shopify for more information.
Searching for partial words is already supported if you use the asterisk character * e.g. cu* will find cup, cups etc.
If you want to make this the default behavior when searching for terms, you will need Javascript (as you noted) to append that asterisk to the search term from the input field.
Well quick & dirty would be to add it to the search form element directly on its onsubmit attribute as so
onsubmit="var s=$('input[type=search]');s.val(s.val()+'*')"
That should be on both search forms – the one in the sidebar and search page. Ideally, it would be much more neatly tucked away in the theme’s theme.js.liquid.
Another way to do Partial Word Search in Shopify is by using a search plugin that supports partial match out of the box. The advantage here is that along with partial word matching, you also get auto-complete and auto-suggestion features that will help refine the search further.
How to Create a Search Box in Shopify using an app
Shopify’s default search is okay at best. Shoppers using search are much more likely to buy, as they exhibit intent. A smart search app can quickly present relevant results and significantly boost conversion.
Using Expertrec’s Shopify Search Box App
- Install Expertrec’s Shopify search extension from here.
- Once you install the extension, you will be directed to your control panel where you will have to enable your search engine by toggling on the enabled search extension.
- Once the app is installed, you will be able to see the search bar changed with facets and filters on the search results pages. This will also add a search dropdown to your existing search box.
- This will by default support partial word matching and you don’t have to change anything in the theme’s code for it to work.