Site Search & Open Search

There used to be this thing called OpenSearch that would provide some level of UX in browsers for searching individual sites. You had to bring-your-own search functionality, this was just getting users to it. I say “used to be” a thing because it seems like it’s been neutered out of being useful anymore.

The way it worked was to link up an XML file:

  title="My Website Search">Code language: HTML, XML (xml)

Here’s the XML file I put on a million years ago:

<OpenSearchDescription xmlns="">
  <LongName>CSS-Tricks Search</LongName>
  <Description>Search through articles posted on CSS-Tricks</Description>
  <Developer>Chris Coyier</Developer>
  <Tags>css html jquery javascript web design</Tags>
  <Attribution>Search data from CSS-Tricks</Attribution>
  <Query role="example" searchTerms="Flexbox"/>
  <Image height="16" width="16" type="image/"></Image>
  <Image height="64" width="64" type="image/png"></Image>
  <Url type="text/html" template="{searchTerms}"/>
</OpenSearchDescription>Code language: HTML, XML (xml)

The main thing was that second to last line with the{searchTerms} part of it. It would pluck up the search terms and get them to this URL format.

Here’s the kicker: I don’t really remember how browsers used to let you know if a website had one of these in place or how it felt to use it. I feel like it would let you know somehow, but can’t remember how. I think it was somewhat hidden, yet discoverable. For example, you’d type SPACE then keywords, and it would detect that you’re probably trying to search that site and use the OpenSearch integration to get you there.

You can feel the ghost of that with Chrome’s custom search engines. (It was intentially neutered). They aren’t detected, you have to manually add them:

If I put that in place manually, then type “” in the search bar, SPACE, then some keywords, the UI changes to offer using that custom search engine:

Firefox won’t let you add a custom search engine. They have Search Extensions, but you can’t add one that is just OpenSearch based anymore.

I don’t remember if Safari ever supported it really, but I can’t seem to make it work at all anymore. There is a setting for Enable Quick Website Search, which I have on, and is in there, but if I type that in the URL bar and hit tab, it just tabs away, and if I hit space after, it just performs a normal search to a search engine. The (?) help button on that page brings up an error page so I’m gonna say that’s just broken.

Feel free to prove I’m wrong, but OpenSearch seems dead.

But in Chrome-land (and thus Arc too), adding custom search engines can be pretty useful still. You just don’t need any fancy files or anything to do it, you just do it for yourself.

Jim did up a post on this: Site Search in Arc Browser — For Your Own Site

The beauty of that is that you don’t even need your own custom search setup on your site, you can still use Google (or whatever) and scope the search results to that site. But do it with a really fast shortcut. The trick there is to leverage the fact that you can do + the search terms to scope the search results, so here’s a quicky for MDN:

MDN has their own decent site search too you might wanna use, but the Google results are good too, so whatever which way.

Now I hit mdn + TAB, and it activates that special search re-direct. It’s pretty cool looking in Arc:


I work on CodePen! I'd highly suggest you have a PRO account on CodePen, as it buys you private Pens, media uploads, realtime collaboration, and more.

Get CodePen Pro

3 responses to “Site Search & Open Search”

  1. Russell Heimlich says:

    This is how I remember open search working on Firefox

  2. Nicolas says:

    On Firefox:

    When you have the toolbar set up with separate address and search bars (which used to be the default since the first version), a small bright badge appears in the search bar for any website that presents an OpenSearch. Clicking it enables you to add this website as search option. If you don’t have the separate search bar, no badge is shown, but you can still click on the address bar and choose to add the website at the bottom.

    Also on Firefox:

    Right-clicking on any search field on any website shows the option “Add a keyword for this search”. You can then choose a keyword and use it as a shortcut to search directly the website from your address bar (like the “mdn” example above, but without pressing Tab, just “mdn what i’m looking for” + Enter).

  3. John Rouillard says:

    Hi Chris:

    Opensearch seems to work for me in Firefox. For example, if I go to, I see a little
    white ‘+ in a green circle overlaid on the magnifying glass icon in my search input field.

    When I click the magnifying glass/plus, I see an option to add the search engine “CSS-Tricks Search”.
    I click on the icon to add the search engine.

    If I put “passkeys” in the search box and choose my new “CSS-Tricks Search” icon, it takes me to:

    just as you described. Note you have to have a search input box. I did it long enough ago in the UI that
    I don’t remember if I had to enable that specifically.

    This is described at:

Leave a Reply

Your email address will not be published. Required fields are marked *

Back to Top ⬆️