GRATIS includes a zero-dependency live search that queries the WordPress REST API.
Add Search to Any Page
Insert an HTML block and add:
<div class="gratis-search-wrap">
<input type="search" class="gratis-search-input"
placeholder="Search posts, pages, products..."
autocomplete="off">
</div>
How It Works
- Debounces input by 200ms to avoid excessive API calls
- Queries
/wp-json/wp/v2/searchwith the search term - Shows results in a dropdown with type badges (post, page, product)
- Keyboard navigation: Arrow keys to navigate, Enter to open, Escape to close
Customizing the Search
The search uses CSS custom properties from theme.json. Override in your child theme or Global Styles.