Adding Search with the Hosted Search Experience

Updated

You'll use the Hosted Search Experience as a hosted page and add a link to it from your site. By the end, you'll have a live search interface without custom development.

SearchStax Site Search Hosted Search Experience showing Smart Answers as seen on a laptop screen.

Prerequisites

Before you start, you'll need:

  • A SearchStax Site Search account
  • A Search App with data already ingested
  • The fields you want to display already indexed (via connector, crawler, or API).
  • Ability to add a link or navigation item on your site

About the Hosted Search Experience

The Hosted Search Experience is a prebuilt search interface hosted by SearchStax. You open it as a hosted page and share its URL. It uses your App's index and settings.

  • Best for: Quick launches, MVPs, proof-of-concept demos, or non-technical teams.
  • Limitations: Limited customization compared to UI Kits. Most changes are via configuration and CSS on a self-hosted copy if you choose to copy the page's source.

Tip: You can view the hosted page and copy its HTML/CSS/JS to self-host for a quick start.

Tip: If you use Drupal, you can still use the Hosted Search Experience. See Import Hosted Search Experience into Drupal for more information.

Open and Share Your Hosted Search URL

  1. In the Dashboard, open your Search App.
  2. Go to Configurations > Search UI > Hosted Search App.
    SearchStax Site Search Hosted Search Experience interface with template URL field.
  3. Click View to open the hosted page.
  4. Copy the URL and share it with stakeholders or link to it from your site.

Note: Changes to your Site Search settings are reflected immediately in the Hosted Search Experience.

If results don't appear, verify that your Search App has indexed content and that you're using the correct Hosted Search URL for the intended App and environment.

Link to Hosted Search from Your Site

  1. Add a link or button in your site's navigation or header that points to the Hosted Search URL.
  2. Optionally, open the link in a new tab or route it to a dedicated search page in your site structure.

Tip: If you later need a fully on-site experience, copy the Hosted Search page's HTML/CSS/JS and self-host it. Use a UI Kit if you need deeper customization.

Choose a Version

The hosted page includes a small version notice at the top showing the exact version. You can remove it in your own copy.

You can choose how updates to the Hosted Search Experience are applied:

  • Automatic updates: Leave the code unchanged to keep the major alias in your script and link URLs (v3 or v4).
  • Pin to a specific release: Change script and link URLs to a full semantic version, for example /studio/-js/v4.1.5, to lock behavior and reduce upgrade risk.

What's Next

Your basic search UI is now live. Next, review the pre-launch checklist to make sure your configuration, indexing, and analytics tracking are ready for production.

Articles in this section