How to Make Search Your Site’s Greatest Asset

Expert tips and tricks on the features any search should be equipped with for a great user experience.

What makes a site truly brilliant? Impressive content? Sophisticated design? User-friendly interface? An effective support system for users, old and new alike? All this and more, my friend. No matter what you choose to build your site around, it can’t exist without a great search solution that helps guide every visitor to what they’re looking for – quickly, efficiently, and with as little effort on the site owner’s part as possible.

In this article, we’ll go through the crème de la crème of the coolest features you can implement on your search with the help of Site Search 360, an easy-to-install and easier-to-maintain app fit for any site builder. Whether you have a HubSpot blog, a knowledge base maintained via Zendesk, a Shopify store, or all three at once, as long as your site’s content is searchable, this app is just what the doctor ordered!

Top 5 search features for your site

Search Result Categorization

It’s highly likely that your site has tons of content that your users might be asked to search through. Depending on the number of pages you have accumulated over the years, that could require herculean patience. So, the first thing needed for your new search are separate tabs to neatly organize all the types of content you offer.

Say you sell a million types of products. You wouldn’t want your users to scroll through all product categories mixed together as they search for their dream pair of shoes. Non-commercial sites can use this nifty technique, too – for instance, to put articles, YouTube videos, and blog posts in their own dedicated tabs. Or, as we call them in the search biz, Result Groups.

Categorization via Result Groups is by no means limited to good old content types. Your search results might constitute pages from more than just a singular site – you could, for instance, have several interconnected domains for your primary content, FAQ knowledge base, news, etc. All of them have unique subsets of pages that you’d need your users to be able to search through, and as long as all these sites are included in your Data Sources, you can not only enable extensive cross-domain search, but also separate pages from these sites into dedicated groups for easier navigation.

And the best part? You can even manually order these tabs to guide your site visitors to the categories you deem most important.

So, how do you set this up? Easy – just enter the URL patterns of the page subsets you’d like to include in the same tab (or XPaths to specific elements found across all of these pages), give your brand-new Result Group a name, and you’re done:

setting up result group for facetted search

Repeat until all categories are in place.

And here’s what your Result Groups can look like once implemented:

result groups in live search

Pro tip: If you ever feel like adding multiple search boxes to your site, you can limit each of them to specific Result Groups. You’ll then have, say, only products in the search results for the commercial part of the site, FAQ entries on the “About Us” page, etc. Configuration options are close to infinite!

Filters and Ranking

Your search is now organized into tabs. But that’s not the only thing you can do to make navigating your site’s content a piece of cake.

Filters are a must-have when you want your users to be able to narrow down their search to instantly find exactly what they had in mind. Say someone’s looking for articles written by a specific author within a specific date range. With just a few clicks, you can create filters for both of these criteria (or anything in the world really – from prices to locations and beyond).

These bad boys are configured differently for projects whose search results were generated either with a sitemap or through website crawling (low-touch integrations where the only thing we need to index your content is your site domain) and for those where a product feed was involved, turning each product into its own search result (best integrated over our API or through our extensions for various e-commerce platforms such as Shopify, Shopware, Adobe Commerce, and so on).

For crawler-based integrations, filters are configured with Data Points, tidbits of information found across numerous pages that the crawler is pointed to via XPaths, URL patterns, linked and meta data, or even regular expressions. Data Points can be added to search result descriptions (across all pages as well as in specific Result Groups), used to automatically boost certain pages in your search results’ hierarchy, and, of course, they can direct the crawler to your future filter values. All of this can be configured right when a Data Point is created with a simple tick in the box of your choice.

Here are the settings you can tinker with for each of your filters:

crawler-based filters

And here’s your data point used simultaneously in the description of the product and as a filter:

crawler-based filter example

For e-com, things get even more exciting. Instead of Data Points, we extract and then use Product Facts, aka the various product characteristics (like color, material, vendor, etc.) available in your feed. The process is fully automated – no need to experiment with XPaths and regexes. It also comes with some ecom-exclusive perks such as HEX-coded circles next to “Color” filter values.

An e-com filter configuration could look like this:

color filter with swatches

Another pro tip for you: e-com and regular filters alike (as well as their values) can be reordered, and there’s even an option to exclude specific values from any filter. But the coolest part is that you get to choose how many pages should bear the values of a specific filter before that filter is triggered to pop up in the search. There really isn’t much of a point in showing the filter if it can only be applied to a singular page, now is there?

In action, these filters are impressive to say the least.

ecommerce filters example

Filters are tightly connected to Ranking Strategies.

Crawler-based integrations come with the option to sort results in ascending or descending order by any numeric Data Point such as “Price”. Sorting Options are configured in a very straightforward manner:

price filter and sorting config

And here’s what your search can look like with the same “Product Price” Data Point used as a basis for the Sorting Order, filter, and part of the search snippet.

price filter and sorting option

You can also prioritize different subsets of pages in the search result hierarchy with boosting rules – in bulk, pointing the crawler to the most important pages by putting more value in their URL patterns, or by specific page element. Pages with query matches in their titles can be consequently ranked higher than those which only have said query matches in other extracted content and vice versa.

E-com integrations get more variety with strategies based on Product Facts attributes, a singular one or several all at once, to automatically put products with specific characteristics at the top of your search results. Let’s say you wanted to bring your users’ attention to products of a specific brand already available for purchase and popular among your customers. In that case, you could base your Ranking Strategy on three factors: “Brand” (for example, “ASOS”), “Availability” (“In stock”) and “Most Sold Items” (“More is better”). You could also prioritize them differently so that “Brand” is the most important characteristic, with “Availability” second, and “Most Sold Items” following suit.

Here’s an example of a Ranking Strategy with multiple attributes:

ranking strategy config

Narrowing down the search and automatically ordering your search results to point your users to the coolest content you offer right away? Sign me up!

Custom results and result sets

This is it, folks. The thing you never knew you needed but always did.

Boosting whole subsets of pages is cool, but what if you need more granular control over your result sets? That’s where Result Mappings come into play.

There are two primary ways in which mappings are used – to create custom result sets and to redirect queries to specific URLs.

This is quite simple too: you enter your query of choice (e.g., a popular search term), our system returns every page that matches said query, and you can reorder these search results as you see fit. You can even blend in other queries among this set so if the mapping is applied for, say, “jeans” , it can also include pages that’d normally be displayed for “pants”, but whenever your users search for “pants”, they’d see default search results. You can also automatically apply filters (with specific values, should you so choose) and ranking strategies to your mapping.

Here’s a possible configuration for a custom result set:

customized result mappings config example

Redirecting queries to your URL of choice is even easier – you just need to type in the address of the page which will pop up automatically once a query is entered into the search box, and you’re done:

redirect to url mapping setup

Both these types of mappings can be applied to queries indefinitely or within a specific timeframe. Added some exciting content to your website and want your users to see it before the older stuff? Just place those results at the top of the page and have the search return to its default state when your new content no longer needs promotion. Simple, but super effective.

And the best part? Your mappings aren’t limited to pages you have indexed from your site. Your custom result set can include entirely new pages – you’ll just need to enter the desired URL, set up the title, description, and thumbnail of your result, and there it’ll be, totally indistinguishable from other search results as if it were in your Index all along:

custom result config
custom result in live search

Your mapping can also be complemented by a custom banner placed above other results – a fancy way of promoting whatever content is most worthy of your users’ attention. This is where things get a little code-heavy. Banners are configured with HTML templates, so be ready to put your developer hat on – it’s totally worth the effort:

custom banner example

Mappings aren’t the only way of customizing which results are shown for any given query. There’re also Dictionary Entries, which allow you to make certain queries synonymous to others.

Intricate control over any page displayed for any query? Don’t mind if we do.

Search design customization

So, you’re done experimenting with your new search features, and the time has come for you to decide how they should look on your site.

Every design-related feature we offer is nested in our “Search Designer” tool, with three distinct blocks for our default design options (fully configurable by clicking a few buttons – no coding necessary), “Additional CSS” (meant for more intricate design customization), and “Templating” (an impressive HTML and Mustache-based tool that allows you to apply your site’s existing search design configuration to your Site Search 360 search results for a seamless integration with any website theme).

Default design options are the way to go if you don’t feel like getting into coding:

design configured with default site search 360 settings

These options are also categorized according to the functionality they offer:

  • “Main search settings”, aka search box styling configuration (its color and loading animation), search bar/search result placement (selector-based), and layout (in a pop-up on the page where the search was initiated on top of the search or fullscreen in a new tab), as well as settings -> layout (embedded, in a pop-up window on top of your site page or in a fullscreen overlay)
  • “Suggestions” are tailored to give you full control over the presentation of your search suggestions – from basic functionally settings, like how many symbols should be entered into the search box for your suggestions to pop up, to fully customizable suggestions formats: user search history and quick links for when your search box is empty
Empty state suggestion
  • …alongside autocomplete queries (preconfigured or pulled from your analytics as most typed in by your user base) as well as best matching results from every Result Group for when a few symbols have already been typed in
Autocomplete suggestions
  • “Search result behavior” is for, to no one’s surprise, results (their number per page, optionable redirection to a new tab when they’re clicked on), Result Groups (whether they’re shown or hidden in bulk and by specific groups), Filters (shown or hidden, where they’re placed on the search results page, whether the number of filters values available for matching search results is displayed) and Highlighting (whether matched content is put in bold and if so, in which color)
  • “Search result layout” is used to configure what (if anything) is displayed in the result thumbnails when a page is associated with several images or no specific image at all, how search results are presented on desktop and mobile (how they’re ordered as well as whether each result should have a URL, image, and description included in the result card) and whether there should be a CTA button (“Add to Cart” or quite literally anything your heart desires)
  • “Advanced settings” gives you the opportunity to add custom CSS to your search’s design as well as your result/suggestion templates, and this is where things get really exciting

Both “Additional CSS” and “Templating” are essentially pop-up windows on the right side of the screen where you can enter your custom CSS/HTML.

additional css

Keep in mind that Templating necessitates filling numerous properties (result title, its images, URL, description, and applicable Data Points) with syntax similar to the Mustache templating engine:

templating

You can also use Callbacks to personalize your templates even further:

templating callback

Just compare our default search design:

default search design

To the design templated on a user’s site:

search design with additional css and templating

Total creative freedom with just a tiny bit of coding.

Everything in between

Alright, you caught us. The list of awesome search features you could implement on your site actually goes way beyond our top 5 contenders! To finish off, a lightning round of other functionality settings that will grant you full control over the look and feel of your search.

So you get to analyze how successful the search is. Awesome! Now you just need to see which exact pages constitute your search results. First off, you’ll need to see which pages constitute your search results. Your Index Log (or Product List) is there to help you out with that! Not only will you have a list of pages our crawler has access to, each of them will also be equipped with a status indicating whether it has been added to your search results successfully:

index log

Your search also needs variety when it comes to the sources your results are pulled from. Depending on the integration, your primary indexing method could be either the list of pages available on your site or your product feed. Some site builders, like Duda, Lightspeed, or Shopify, allow us to access this content automatically – no action needs to be taken by the user. You can also use multiple indexing methods, peppering FAQ entries, pages from non-indexable domains, and even YouTube videos in your search. Keep in mind that your search results’ formats may go way past simple HTML pages – you also have the option to index PDF, Word, Excel, PowerPoint, and even Open Office documents, so the search can be as diverse as you wish (and with PDF Indexing specifically, you’re also in control of indexing strategies for your PDFs’ titles, content, and images).

Another nifty feature to experiment with? Search Fuzziness, aka how closely search results and search suggestions need to match the entered query – a range from “extremely strict” (the match needs to be perfect) to “get more results” (the most lenient of options requiring just a few symbols of the query to be found in the search result/search suggestion titles and content):

Fuzziness settings

You can also pick and choose the content to be included in the search. Our Content Extraction rules allow you to point our crawler to the exact element (or elements) where your search results’ titles and images are located. The same goes for the content of the page – you can force the crawler to automatically skip specific parts of your site’s pages when configuring your search results.

Search snippets are a bit different, though. By default, snippets are dynamic, their text changing depending on the part of the page’s content where a query match is found (and highlighted). But you can choose to configure static snippets based on your metadata or Open Graph tags if your page descriptions are carefully curated and kept up to date. In that case, the same few paragraphs would showing regardless of whether a match is there or not. We usually recommend to stick to dynamic snippets so that your users can instantly see why a certain result popped up in their search.

search snippet settings
dynamic search snippet

Next up – security settings which will allow you to block specific IPs from using the search (or that keep them from being logged in your analytics), thus protecting yourself from bot searches and ensuring that internal activity doesn’t pollute your search data.

Last but definitely not least, you’ll need a way to determine how successfully your search is performing. There are three types of data that might prove useful in this regard:

  • Dashboard Analytics present information about how your search is being used, aka how many searches have been performed in a specific timeframe, what are the most common queries, etc. Here you’ll also see queries that returned zero matches (for instance, due to misspellings or lack of relevant site content) and get the opportunity to instantly correct your search result sets by setting up new Result Mappings or Dictionary Entries.
dashboard analytics
  • Search Success Tracking is a score calculated based on the number of users who engage with the search; the frequency at which they click on the search results they’re presented with, abandon their search, and use filters; and the percentage of zero result searches:
search success tracking
  • Search Map shows where in the world your search is being used as well as which queries are most common in any given region:
search map

A lot, right? Well, there’s never be too much of a good thing.

Most likely, you’re already on the edge of your seat, desperate to try out all these features yourself. So what are you waiting for?

Start with a free Site Search 360 account today!

If your site’s on the smaller side when it comes to the number of pages to index and the frequency at which the search will be used, you can enjoy all these features (and more) for free. And if you exceed the Free plan limits, Site Search 360 offers a wide variety of custom plans that can accommodate your every need.

If any questions come up, head over to to our How-To docs for step-by-step instructions on setting up every search feature mentioned in this article, or reach out to 360’s support.

Happy searching!

Stay in the loop: Get your dose of frontend twice a week

Fresh news, inspo, code demos, and UI animations—zero fluff, all quality. Make your Mondays and Thursdays creative!