Reset search

While maybe not a perfect solution, I believe this codepen has an example of how to potentially achieve this https://codepen.io/Algolia/pen/OXgZxv

This part most specifically:

document.querySelector(".searchbox [type='reset']").addEventListener("click", function() {
	document.querySelector(".aa-input").focus();
	this.classList.add("hide");
	myAutocomplete.autocomplete.setVal("");
});

There it deselects the field, modifies the class list, and clears out the value. The myAutocomplete variable is set on line 3 and that part should look familiar compared to the out of box templates.

Sorry about not being as clear as I should have been. You have access to all of the javascript that we use for both the Autocomplete and the InstantSearch integrations. You can see both template files at https://github.com/WebDevStudios/wp-search-with-algolia/tree/2.6.0/templates

I believe you’d want to be focused most specifically on this section here: https://github.com/WebDevStudios/wp-search-with-algolia/blob/2.6.0/templates/autocomplete.php#L172-L177

Information and links below for how to safely customize your template files while still being able to update the core plugin.

Template customizations in general

https://github.com/WebDevStudios/wp-search-with-algolia/wiki/Customize-Templates

Autocomplete customizations

https://github.com/WebDevStudios/wp-search-with-algolia/wiki/Customize-the-Autocomplete-dropdown

• This reply was modified 2 years, 9 months ago by Michael Beckwith.