HACK
#44
Build Your Own Firefox Search Engine
Firefox's built-in search box lets you search Google from wherever you are. You don't have to settle for that built-in searching, though, because you can build your own Firefox search engine plug-in to search through any site from the Google search box
[Discuss (5) | Link to this hack]

Take a look at the upper-right corner of your Firefox browser [Hack #43]. You'll see a nifty search box called the Search Bar that lets you search Google by typing in a search term. Better yet, you don't have to settle for searching just Google that way. You can search through other sites as well by installing a specific search engine add-in for that site to the Search Bar. So, instead of using Google to search the Internet, for example, you can use Ask Jeeves (http://www.ask.com) or A9 (http://www.a9.com).

And you're not limited to search sites. You can also search through an individual site. So, for example, you can search through Amazon.com (http://www.amazon.com), eBay (http://www.ebay.com), Dictionary.com (http://www.dictionary.com), or the health site WebMD (http://www.webmd.com) from that box as well. All you need to do is find and add the right search engine plug-in.

To do so, click the down arrow next to the G in the search box, and choose Add Engines. You'll be sent to http://mycroft.mozdev.org/download.html, which is a directory of hundreds of search engines you can use in Firefox. Browse or search until you find one you want; then click its link. You'll get a dialog box like that shown in Figure 1, asking whether you want to add it to the Search Bar. Click OK, and it'll be added.
Figure 1. Confirming the addition of a new search engine to the Firefox Search Bar

To choose which search engine to use in the Search Bar, click the down arrow next to the G in the Search Bar and choose your search engine from the list. Then, type in a search term, and you'll search using that engine. The engine will stay there as your default until you choose another one.

All that's well and good. But why settle for a search engine that's already been written? It's not that hard to write a plug-in of your own.

To get started, open a new file in a text editor such as Notepad. Give it the name of the site for which you're building a search engine, and give it the extension .src. In our instance, we're going to build a search engine for searching the federal government's White House site, so we'll call it White House.src. Save it in the folder C:\Program Files\Mozilla Firefox\searchplugins\.

The first line of the plug-in should be the search tag
version="7.1

Next, name your plug-in by using this syntax:

name="My Plugin"

But replace My Plugin with the name of the plug-in you're writing. In our instance, we're calling it White House.

Now, describe your plug-in by using this syntax:

description="My Plugin - My First Search Plugin"

Our plug-in now looks like this:

version="7.1"
name="White House"
description="Search www.whitehouse.gov"

Now you have to tell the plug-in what action to take when you type in a search term and press Enter. What you're doing here is telling it how to search the site. To get this information, go to the site for which you want to build a search engine. Do a search, and look at the first part of the resulting URL, the portion before the first question mark (?). That's what will tell what action your search engine should take. For the http://www.whitehouse.gov site, that first part of the URL before the ? is http://www.whitehouse.gov/query.html.

Here's the syntax:

action="http://myplugin.faq/search"

So, in our instance, the line looks like this:

action="http://www.whitehouse.gov/query.html"

Now you need to put in the name of the search form. This will be the name of the site you're on, written with the following syntax:

searchForm="http://myplugin.faq"

Again, in our instance, this is:

searchForm="http://www.whitehouse.gov"

Underneath that, put the following code:

method="GET"

This tells the plug-in to use the GET method of searching, which is the only method supported, so there's no choice here. After that line, close off the search tag with a closing tag:

>

So, here's what our plug-in looks like so far:

version="7.1"
name="White House"
description="Search www.whitehouse.gov"
action="http://www.whitehouse.gov/query.html"
searchForm="http://www.whitehouse.gov"
method="GET"
>

Now you need to add a line that tells the site's webmasters and site administrators someone is searching the site using the plug-in. So, put in this line:



Next, you need to tell your plug-in what syntax to use when searching for the text you'll type into the Search Bar. This varies from site to site. Again, take a look at the URL that results after you search the site. Look for whatever falls between the first ampersand (&) and your search term. For the www.whitehouse.gov site, it is qt.

Here's the syntax for this line:



So, in our instance, the line looks like this:



Now you need to close off the entire search section with a closing tag:



Here's what our final file looks like:

version="7.1"
name="White House"
description="Search www.whitehouse.gov"
action="http://www.whitehouse.gov/query.html"
searchForm="http://www.whitehouse.gov"
method="GET"
>






That's it; you're done. Close Firefox and restart it. Click the down arrow at the Search Bar, and your search engine plug-in will show up. Select it, type in your search term, press Enter, and you'll search the site.
Hacking the Hack

When you right-click the down arrow on the Search Bar, you'll see that many plug-ins have a small icon next to them. Yours doesn't, however. That's because you haven't created an icon for it. Create a 16 16 pixel icon, give it the same name as your plug-in, and save it as either a .jpg or .png graphics file. Then, put it in the C:\Program Files\Mozilla Firefox\searchplugins folder. So, in our instance, we create one called White House.jpg.

For information about how to create icons, see [Hack #19] . You can also find ready-made icons in the right size, although not the right format, right on the Web. When you visit many web sites, you'll see in your web browser a small icon to the left of the http://; that same icon might show up next to the http:// on your Favorites list because the sites use something called a favicon which the browser displays.

You can find the favicon for the site, save it to your PC, convert it to .jpg or .png format, and use it for your search engine plug-in. To find the favicon for a site, go to http://www.website.com/favicon.ico, where website is the Favorite you want an icon for. For example, go to http://www.oreilly.com/favicon.ico for the O'Reilly icon. Keep in mind, though, that not all web sites have favicons, so you won't be able to do this for every site.

If you're using Firefox to get the icon, a dialog box will open, asking what to do with the file. Save it to your hard disk. If you're using Internet Explorer, you'll open the icon itself in your browser. Right-click it, choose Save Picture As..., and save it on your hard disk.

It'll be in .ico format, so you need to convert it to .jpg or .png. An excellent program for doing this is IrfanView, available from http://www.irfanview.com. For details about how to do the conversion, see [Hack #99]. When you store the file, make sure it's in C:\Program Files\Mozilla Firefox\searchplugins.

See also:

*

If you'd like, you can share your plug-in with
others and have it available for download from the http://mycroft.mozdev.org/download.html site.
To do so, you'll have to add some code to your
plug-in. For details, go to http://mycroft.mozdev.org/deepdocs/quickstart.html#firstplugin.
The page also has more detailed instructions for creating your search
plug-in.