Custom, Embeddable Site Search with Swiftype

By  on  

As hard as we try to make our website navigation and content structure as logical as possible, a large percentage of users would prefer a simple search box to find what they need.  That being the case, we need to ensure that site search is as accurate and smart as possible.  Oftentimes developers will try to roll their own site search (yuck), use an open source utility (usually yuck), or reach to Google Site Search, which will soon be unavailable.  Search is hard but that's where a service like Swiftype can come to the rescue.  Swiftype is a site search and third party content search service that allows you to provide incredible search capabilities to your users in very little time.

Quick Hits

  • Free to sign up!
  • Create your own site search and web crawler for any URL for improved search
  • Full analytics to monitor what users are searching for
  • Conversion tracking to get insight on what is and isn't working in your marketing and page structure
  • Result customization allows you to promote certain pages over others in search results
  • Provides a WordPress plugin for easy integration
  • Direct Swiftype to recrawl your site at any time
  • Enterprise search service allows you to index third party services (Dropbox, GitHub, Box, etc.) so you can search multiple services in one place

Site Search Setup

After you've signed up for a free trial account at Swiftype, the first step is creating a search property.  Simply provide a URL to the website and a name and Swiftype will immediately start indexing the site contents.

You can preview search results at any time with Search Preview feature.  I executed dozens of searches I thought would be popular and was really happy with search result order.  There were a few searches, however, where I would prefer one result was a bit higher than another, and that's where I found the Result Rankings feature very helpful!

Modifying Result Rankings

Swiftype does an excellent job of indexing content and providing the most relevant results but there may be cases where you'd like to manually modifying the order of search results based on keyword.  For example, one of my site's most popular posts is about upgrading Node.js but I'd much, much prefer my post on Using NVM to Manage Node.js Versions showed up first, since the first post provides legacy information.  Google Webmaster Tools doesn't allow me to modify result order so I'm somewhat helpless in correcting the issue on Google, but Swiftype allows me to correct the issue for my own site search:

All I need to do is drag and drop the result times and Swiftype remembers the preferred result order.  You can provide any warnings or notices on the legacy page but there's nothing like the user never seeing that page because the preferred search result is first!

Customize Keyword Weights

Since you probably know your content structure better than Swiftype does, Swiftype offers you the ability to experiment with custom weighting of keywords in different sections of the content, including headings, body content, images, etc:

Once you've played with the weighting of different aspects of site content, you can preview search results based on those weights.  If you find better weighting -- awesome!  If not it means Swiftype's done an excellent job with their default weighting system.

Analytics and Conversion Tracking

Analytics and conversion tracking are a huge part of marketing and sales analysis.  Google Analytics can provide you with that information but the variable they don't account for is the ability to custom weight search results as well as the ability to modify search ranking;  Swiftype lets you control more of search so that user searches can turn into conversions!

All you have to do is add the conversion tracking code provided by Swiftype and you instantly have conversion tracking!

Enterprise Search

While exploring Swiftype's capabilities, I found Enterprise Search and was blown away.  Web development has gotten so big that we've broken off into a number of specialties like ops, front end, back end, and so on.  At the same time we've started using more specialized web services.  There are team tools like HipChat, Slack, and a variety of other tools for text and video communication.  We have file storage and hosting services like Google Drive, Dropbox, Box, and Microsoft's OneDrive.  We have so many focused services now, however, that we run info a frequent problem:  where the hell do we find anything?

Which service did I upload those files to?  What site or git repository had the code and documentation for the API I need to use?  Choice is good but it also complicates our ability to find what we need.   Swiftype's enterprise search service allows you to search between multiple external services so you can find what you need faster.

Adding Sources

After you've signed up for a free trial account, the next step will be adding "sources" (services to index for search) via Swiftype's elegant interface.  Swiftype offers a bunch of sources for services I use frequently, including GitHub, Dropbox, etc.:

Click on each service to authorize Swiftype (via traditional OAuth which we're all used to).  Swiftype indexes each service to make search for its contents quick and easy!

Adding a Web Crawler

While Swiftype features a number of popular services, if you have any website you'd like to add to your search result pool, you can easily do so using Swiftype's Web Crawler Source feature.  You may want to add your websites, your intranet, a documentation site, or any site for that matter.  Simply provide Swiftype the URL to crawl and Swiftype will immediately start indexing the website.  I added my website:

Web Crawler sources, much like Swiftype's preconfigured sources, are synced periodically to ensure the latest content is available for search:

No information other than the base URL is required so adding any website you wish to be indexed is simple and convenient.  You don't even need to be the website owner -- you can choose which content providers you believe are trustworthy for yourself, your teammates, and your organization.

Verdict

Both of Swiftype's awesome offerings, Site Search and Enterprise Search, are really impressive.  The amount of control you can take over your own site's search is amazing; no mystery box of logic or frustration over search result order -- you can customize all of that, making the search experience much more effective than Google.  I enjoyed using Enterprise Search as well.  I was instantly able to search a host of GitHub source, my blog, and Dropbox code samples at the same time; no more wondering which service was hosting the information I wanted.

Instead of rolling your own search or using a lacking free alternative, give Swiftype a shot.  I've found WordPress' search underwhelming so I look forward to using Swiftype in my upcoming redesign.  Users demand to get to the information they need faster -- Swiftype gets them there!

Recent Features

  • By
    Serving Fonts from CDN

    For maximum performance, we all know we must put our assets on CDN (another domain).  Along with those assets are custom web fonts.  Unfortunately custom web fonts via CDN (or any cross-domain font request) don't work in Firefox or Internet Explorer (correctly so, by spec) though...

  • By
    Facebook Open Graph META Tags

    It's no secret that Facebook has become a major traffic driver for all types of websites.  Nowadays even large corporations steer consumers toward their Facebook pages instead of the corporate websites directly.  And of course there are Facebook "Like" and "Recommend" widgets on every website.  One...

Incredible Demos

  • By
    jQuery Wookmark

    The first thing that hits you when you visit Pinterest is "Whoa, the columns are the same width and the photos are cut to fit just the way they should."  Basic web users probably think nothing of it but as a developer, I can appreciate the...

  • By
    Fancy Navigation with MooTools JavaScript

    Navigation menus are traditionally boring, right? Most of the time the navigation menu consists of some imagery with a corresponding mouseover image. Where's the originality? I've created a fancy navigation menu that highlights navigation items and creates a chain effect. The XHTML Just some simple...

Discussion

  1. 300$ a month for the basic plan!?

    Thanks, but I’d rather roll my own search.

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!