Content
You have a website.
Google makes a pretty good search engine.
Firefox 2 and Internet Explorer 7 both support OpenSearch as a way of customizing the browser’s search box.
And you can make all three work together in five minutes. No programming required.
Check this out:
Step 1: Save the template
Use the template below to create a file on your web server. I called mine “opensearchdescription.xml” and saved it on static.unto.net.
<?xml version="1.0" encoding="UTF-8"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/">
<ShortName>[Name of the site]</ShortName>
<Description>Use Google to search [Name of site]</Description>
<Tags>[Name of site]</Tags>
<Url type="text/html"
template="http://www.google.com/search?q=site:[Site host] {searchTerms}"/>
</OpenSearchDescription>
Download the template here, save it to your server, and move on to step 2.
Step 2: Edit the template
Replace [Name of site] and [Site host] in the template above with the appropriate values for your site. Remember that [Name of site] must be 16 or fewer characters of plain text.
For example:
<?xml version="1.0" encoding="UTF-8"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/">
<ShortName>Unto.net</ShortName>
<Description>Use Google to search Unto.net</Description>
<Tags>unto dewitt clinton</Tags>
<Url type="text/html"
template="http://www.google.com/search?q=site:unto.net {searchTerms}"/>
</OpenSearchDescription>
See the live Unto.net description file here.
Verify that you can load the edited template in your web browser, and move on to step 3.
Step 3: Add the autodiscovery link
Tell browers that visit your site about the new search engine using an autodiscovery link.
You’ll want to do this on every page on your site, so it is best to edit whatever template generates the header.
Edit the header of the pages on your website to include the following line between the <head></head> tags:
<link rel="search" href="[URL of the file you just created]"
type="application/opensearchdescription+xml"
title="[Site name]" />
For example, on blog.unto.net pages this line appears as:
<link rel="search" href="http://static.unto.net/opensearchdescription.xml" type="application/opensearchdescription+xml" title="Unto.net" />
(View source to see it live.)
Step 4: See it in action
Hit refresh in your web browser.
If it works, the search box in the upper right of either Firefox or IE should light up to indicate that a custom search engine was discovered.
Click on the drop down and select your new customized OpenSearch engine.
Search away!
February 8th, 2007 at 8:34 pm
Thank you. That was so easy, I feel guilty about doing it.
February 8th, 2007 at 8:36 pm
A big thanks to David Reese for catching that WordPress had changed all the quotes in the samples into “smart quotes”.
Fixed now. By hand, as WordPress doesn’t have an option to disable it.
February 9th, 2007 at 12:01 am
Darn smart quotes.
I went in and changed the preg_replace in functions-formatting.php.
There you will find the gem of:
—
$cockney = array(”’tain’t”,”’twere”,”’twas”,”’tis”,”’twill”,”’til”,”’bout”,”’nuff”,”’round”,”’cause”);
$cockneyreplace = array(”’tain’t”,”’twere”,”’twas”,”’tis”,”’twill”,”’til”,”’bout”,”’nuff”,”’round”,”’cause”);
$curl = str_replace($cockney, $cockneyreplace, $curl);
—
It felt good that for each request my server was bothering with that :)
Dion
February 9th, 2007 at 10:40 am
[...] Via Mark Pilgrim: Add OpenSearch to your site in five minutes [...]
February 9th, 2007 at 4:55 pm
wet_opensearch: Add OpenSearch to a Textpattern powered site…
wet_opensearch is a Textpattern plugin which adds an OpenSearch template to your site as specified by the OpenSearch specification.
Additionally, it contains a tag which renders the necessary markup allowing search clients like modern browsers to di…
February 9th, 2007 at 6:21 pm
Is the search bar in the left sidebar an example of OpenSearch?
I’d like to see it in action.
February 9th, 2007 at 6:24 pm
No, the search box on the left is using the Google AJAX search API.
I’ll see if I can come up with a clever integration of the two.
February 9th, 2007 at 6:34 pm
And for the swarm of Diggers just arriving, I do want to point out that this site is running WordPress and you all haven’t crashed it yet.
(Famous. Last. Words.)
February 9th, 2007 at 6:53 pm
what is opensearch?
February 9th, 2007 at 6:56 pm
Joost, OpenSearch is a collection of simple formats that help search engines share their search results.
Firefox and IE 7 use OpenSearch as a plugin format format for the search box in the browser. Other applications use OpenSearch over RSS or Atom to syndicate search over the net.
You can learn more at http://www.opensearch.org/.
February 9th, 2007 at 8:09 pm
Thanks ., it was pretty easy ! I setup one for me and my friend !
February 9th, 2007 at 8:39 pm
[...] read more | digg story Share and Enjoy: These icons link to social bookmarking sites where readers can share and discover new web pages. [...]
February 9th, 2007 at 8:52 pm
[...] This is a pretty cool way to customize the search box in the upper right hand part of the browser by adding a quick tag in the HTML and having the static opensearch.xml file in the site. It should make it easy for people to search that specific site using Google through their browser window.read more | digg story [...]
February 9th, 2007 at 9:01 pm
Another good line item for your five minute tutorial is defining an icon for your open search provider, to assist users in identifying your search provider vs. the others.
1) Create an icon file (PNG, ICO, etc.)
2) Transform your icon into a serialized representation using a utility like the URI kitchen:
http://software.hixie.ch/utilities/cgi/data/data
3) Embed the icon in your search provider as described by this Mozilla doc:
http://developer.mozilla.org/en/docs/Creating_OpenSearch_plugins_for_Firefox
February 9th, 2007 at 9:48 pm
[...] read more | digg story [...]
February 9th, 2007 at 10:32 pm
[...] DeWitt Clinton » Blog Archive » Add OpenSearch to your site in five minutes This is … awesome and well worth it for many sites, especially sites with lots of content (tags: search opensearch firefox howto) [...]
February 10th, 2007 at 1:23 am
[...] 如今流行的浏览器，如 Firefox 2.0 和 IE 7 右上角都会有一个搜索框，其中的搜索引擎是可以自己添加的，利用 OpenSearch 就可以很方便的在搜索框中添加自定义引擎。例如添加一个搜索你的 Blog 的引擎，是一个很酷很实用的功能。按照这篇文章的方法，5分钟在你的站点中添加 Open Search，你就可以很轻松的实现这个功能。 [...]
February 10th, 2007 at 5:29 am
[...] Add OpenSearch to your site in five minutes Filed under: Uncategorized — recar @ 12:25 pm Add OpenSearch to your site in five minutes “Firefox 2 and Internet Explorer 7 both support OpenSearch as a way of customizing the browser’s search box… No programming required.”[news][entertainment][technology][programming] [...]
February 10th, 2007 at 5:32 am
[...] NOTE: I’ve discontinued the ldopa.net Firefox plug-in (which, BTW, was a pain in the ass to make; I swear Firefox plug-ins are based on the same technology as “Sherlock” plug-ins from Mac OS 9) in favor of a nifty OpenSearch implementation. Users of Firefox or Internet Explorer 7 should have their search boxes light up when visiting an ldopa.net page, and subsequently get the option to add ldopa.net to their search options. I don’t know why you’d want to add it, but there you go, anyhow. [...]
February 10th, 2007 at 9:43 am
[...] For full instructions on how to do this, click here. [...]
February 10th, 2007 at 10:45 am
Great tip! For the record, took me about 3 minutes. ;-)
Any idea how to make the favicon show up in the search box pick list?
Matt
February 10th, 2007 at 12:48 pm
This is pretty awesome. I wonder if it’d be possible to determine which search engine they came from (if any) and set that as the default, since it’s obviously the one they prefer?? Sounds like a fun weekend project for me!
February 10th, 2007 at 1:04 pm
[...] http://blog.unto.net/opensearch/add-opensearch-to-your-site-in-five-minutes/ [...]
February 10th, 2007 at 4:34 pm
i added opensearch to http://babystepz.com/search/ long time ago, because i wanted a previous firefox search also, it didn’t took 5 mins, but it works perfectly
i used function like this
function addsearch(name) {
try {window.external.AddSearchProvider(”http://babystepz.com/search/”+name+”.xml”);}
catch(eX) {if ((typeof window.sidebar == “object”) && (typeof window.sidebar.addSearchEngine == “function”)) {window.sidebar.addSearchEngine(”http://babystepz.com/search/”+name+”.src”, “http://babystepz.com/search/”+name+”.png”, name, “Web”);}
else {alert(”Browser not supported.”);}}
}
February 10th, 2007 at 4:38 pm
i added opensearch to http://babystepz.com/search/ long time ago, because i wanted a previous firefox search also, it didn’t took 5 mins, but it works perfectly
i used javascript function like this
function addsearch(name) {
try {window.external.AddSearchProvider(”http://babystepz.com/search/”+name+”.xml”);}
catch(eX) {if ((typeof window.sidebar == “object”) && (typeof window.sidebar.addSearchEngine == “function”)) {window.sidebar.addSearchEngine(”http://babystepz.com/search/”+name+”.src”, “http://babystepz.com/search/”+name+”.png”, name, “Web”);}
else {alert(”Browser not supported.”);}}
}
February 10th, 2007 at 4:51 pm
> Any idea how to make the favicon show up in the search box pick list?
It shows up fine in IE7.
February 10th, 2007 at 8:30 pm
[...] If you want to do this for your own site, here are a couple of resources to get your started. You’ll find instructions in the article “Add OpenSearch to your site in 5 minutes” that are quick and easy to follow and will set up a site search that uses Google to provide the site-specific search results. Just a quick note for anyone who tries the instructions in this article, when I tried it out, I had an issue with the quotation marks and line breaks as copied from the code samples provided. If the new xml file you create is throwing errors, try re-typing the quotation marks in the Url line and removing the line break in that line as well. Should work fine then. [...]
February 11th, 2007 at 10:49 am
Opensearch Autodiscovery Link module for Drupal…
This lightweight module creates an opensearch autodiscovery link on every page of your site, as described here. It can serve the description document from a static file, but if no such file exists, it will create a dynamic one with some . . ….
February 11th, 2007 at 12:41 pm
#24…thanks for the javascript. Worked for me as well. I really need to find something that can interface with MySql because most of my pages are dynamic and they don’t show up when searching….shouldn’t be too hard though…right?
John
http://www.monomachines.com
February 11th, 2007 at 2:52 pm
Hey DeWitt,
A few months ago I created a tool for building OpenSearch Description files that can generate a site specific search using a number of popular search engines:
http://opensearchgallery.com/osdxEditor.aspx
It’s really more of a custom search engine builder so by default it wants to just install the provider into IE or Firefox. But if you set the Search Client to “other” it will generate a file that can be downloaded to your client. Only thing is it only supports “Live Search” as a client when you do that because it assumes all other clients would want RSS/Atom based results and Live is the only major search engine (at the time) supporting RSS based results.
I could remove that limitation pretty quickly if anyones interested in using the tool to generate an HTML based OpenSearch Description file for your site. Just let me know…
The site above is my personal playground for exploring all things OpenSearch so I haven’t really broadcast it too much but if others find my tools usefull I don’t mind them using it.
I actually have a number of other OpenSearch related tools posted that aren’t directly visible on the site. Like a REST based API for generating OpenSearch Description files, REST based translator that can convert RSS results to Atom and vice versa, and a bookmarklet for the search engine builder above:
http://opensearchgallery.com/
-Steve
February 11th, 2007 at 5:13 pm
[...] Add OpenSearch to your site in five minutes (tags: Website_Ideas Search2.0) [...]
February 11th, 2007 at 7:38 pm
[...] Add a search [...]
February 12th, 2007 at 9:01 am
[...] DeWitt Clinton » Blog Archive » Add OpenSearch to your site in five minutes If you want an easy way for people to be able to search your site with a search plugin for firefox, take a look at this great simple tutorial. You have a website. Google makes a pretty good search engine. Firefox 2 and Internet Explorer 7 both (tags: blogging branding development opensource media ideas howto generator reference rider tools technology tutorial web20) Bookmark to: LicenseThis work is published under a Creative Commons Attribution-Share Alike 2.5 License.If you want your creativity to make more of an impact, consider the Creative Commons license. [...]
February 12th, 2007 at 9:46 am
[...] Dewitt Clinton teaches you how to add OpenSearch to your site in 5 minutes. [...]
February 14th, 2007 at 12:06 am
I like this idea , however it breaks opera’s navigation bar functionality. I do realise that Opera represents a small percentage of browser usage. However if you have a meta search link Opera’s navigation bar will create a link to it, but as this link now points to an xml file, rather than linking to the search form it outputs
Unto.net Use Google to search Unto.net unto dewitt clinton
this is not the most useful message. One possible solution maybe to add a cdata section to the xml file - which would allow adding a proper link, or doing some browser detection (which is neither foolproof nor futureproof).
February 14th, 2007 at 7:01 pm
We had a few problems setting up the OpenSearch. The issue was going out and getting the OpenSearch plugin when using the downloaded version. We ended up trying the example given rather than the downloaded version. After a few minutes it started working.
February 15th, 2007 at 5:43 am
Tutorial for Adding OpenSearch via Google to Your Blog/Website…
DeWitt Clinton has a nice tutorial on adding an OpenSearch plug-in to your website.
OpenSearch is a search engine description standard supported by both Firefox 2 and Internet Explorer 7 that makes it easy to customize the search engine……
February 26th, 2007 at 12:20 pm
[...] Wer sowas auch für seine Seite will: Hier steht, wie es geht. Meta, OpenSearch, search, Suche, TechnischesMeta, OpenSearch, search, Suche, Technisches [...]