Brightspot
The following steps will guide you through replacing your Brightspot site's native search with Glean's modal search interface.
Access Site Settings
Navigate to Admin > Sites & Settings in your Brightspot dashboard and select the site(s) where you want to implement Glean search.
Navigate to Front-end Settings
In the Edit Site view: 1. Select the Front-end tab 2. Expand the Advanced section
Add Custom Head Elements Container
- Click Add Custom Head Elements 2. Set Internal Name to
Glean
Configure Web SDK Script
Under Elements, add a Script Element with the following configuration:
Field | Value | Required |
---|---|---|
Internal Name | Glean Web SDK | ✅ |
Type | Link | ✅ |
Script URL | https://app.glean.com/embedded-search-latest.min.js | ✅ |
Defer | true | ✅ |
Add Integration Script
Add another Script Element with these settings:
Field | Value | Required |
---|---|---|
Internal Name | Glean Search Replace | ✅ |
Type | Inline | ✅ |
Body | See script below | ✅ |
addEventListener('DOMContentLoaded', () => {
// If you've customized the page header, you'll need to adjust these selectors.
GleanWebSDK.attach(document.querySelector('.Page-header-search-open'));
GleanWebSDK.attach(document.querySelector('.Page-header-search-input'));
})
Save Changes
Click Save to apply your configuration changes.
If you have customized your page header, you may need to modify the CSS selectors in the integration script to match your specific implementation.