Search Bar | Yext Hitchhikers Platform
The SearchBar component is the main entry point for search querying. It provides the input box where the user types their query.
Default Styling
Here is the default styling for a search bar:
Configuration
"componentSettings": {
"SearchBar": {
"placeholderText": "Search", // The placeholder text in the answers search bar
"allowEmptySearch": true, // Allows users to submit an empty search in the searchbar
"loadingIndicator": { // Optional, options for loading indicator on seachbar
"display": false, // Optional, whether to include a loading indicator on seachbar
"iconUrl": "", // Optional, use custom icon url instead of the default loading indicator animation
"submitIcon": "iconName", // Optional, used to specify a different built-in icon for the submit button. Defaults to Animated Magnifying glass when CSS is included.
},
"voiceSearch": {
"enabled": false, // Whether or not voice search is enabled
"customMicIconUrl": "", // Path to override the voice start icon
"customListeningIconUrl": "" // Path to override the voice stop icon
}
}
<% elem.innerText %>