How To: Make a Firefox Search Plugin for a WP Site

September 20, 2006 · 20 comments

After 9rules released their comprehensive new search feature on Monday, allowing users to search member content and receive results from Flickr, YouTube and Technorati, it was only a matter of time before someone created a Firefox search plugin. This got me thinking that it would be pretty cool if PaulStamatiou.com readers could have that same convenience. Well now you can, and I’m going to show you how to make one for your WordPress-powered blog as well.

The Mycroft site, which stores a repository of Firefox search plugins, has a basic outline of how to make a working plugin. However, to get it working with WordPress you will need to change a few items. First off, every search plugin has two parts: the source file, which is converted to XML once you upload it to Mycroft, and search image. I’m not sure what image file types the search plugin can take but it seems to work well with GIF’s and PNG’s. Both of these files must be named the same, with the exception of the file type. For example, my files are named PSsearch.gif and PSsearch.src.

The main thing that needed to be changed for WordPress compatibility was the search query which goes by index.php?s= instead of using query. Below is the code I changed from the Mycroft tutorial; the rest of it stayed the same.

<search version=“7.1″
 name=“PaulStamatiou.com Search”
 description=“PaulStamatiou.com – Tech News/Reviews/Guides”
 action=“http://paulstamatiou.com/index.php”
 searchForm=“http://paulstamatiou.com/index.php”
 method=“GET”
 >

<input name=“sourceid” value=“Mozilla-search”/> /* for some reason WordPress insists on putting the ending slashes */
<input name=“s” user/>

<browser update=“http://mycroft.mozdev.org/update.php/id0/PSsearch.src”
 updateIcon=“http://mycroft.mozdev.org/update.php/id0/PSsearch.gif”
 updateCheckDays=“7″
>

When you’re done with that, submit your plugin with this tool. Once everything is uploaded, do a quick search on Mycroft to find your plugin and install it. That being said, go ahead and try out my search plugin. I decided to convert my site’s favicon and use it with the search plugin for consistency. Overall I think it turned out quite well for something that took me a few minutes of work. A great addition to any blog.

PaulStamatiou.com Search

Alternatively, you can host the search plugin on your site using JavaScript and a properly constructed link as done on UNEASYsilence in the sidebar.

{ 8 trackbacks }

Internet Vibes » Blog Archive » How To: Make a Firefox Search Plugin for a WordPress Site
September 21, 2006 at 2:07 am
bitacle.org
September 21, 2006 at 8:08 am
How To Time « Daily Grind
September 21, 2006 at 4:44 pm
The Acorn » The Acorn search plugin for Mozilla Firefox
October 27, 2006 at 5:53 am
Firefox Search Plugin at Constantinos Kouloumbris Weblog
November 1, 2006 at 1:43 pm
Affenheimtheater » Affenheimtheater: Suchmaschinen Plugin für Firefox: This Shit Is Bananas!
November 13, 2006 at 5:33 am
BloqNum » Plugin de búsqueda para firefox
December 3, 2006 at 3:02 pm
links for 2007-01-25 » SridhaReena
January 25, 2007 at 6:21 pm

{ 12 comments… read them below or add one }

1 Paul Stamatiou September 20, 2006 at 9:54 pm

I just tested it and it seems to work in Flock as well.

Reply   More from author

2 Ronald Heft September 20, 2006 at 10:06 pm

Great tutorial, Paul. Too bad I couldn’t have used it for the 9rules Search plugin. I had to go through Mozilla’s horribly confusing documentation on how to create a plugin. Oh well, if I wouldn’t have suffered through creating the plugin, this tutorial wouldn’t exist. At least future search plugin creators can enjoy the simplicity of your tutorial.

Reply   More from author

3 Paul Stamatiou September 20, 2006 at 10:08 pm

Thanks for even giving me the idea to make one. =)

Reply   More from author

4 Mike Rundle September 20, 2006 at 10:36 pm

Hey guys, if you’re looking for a more in-depth tutorial on how to write these things from scratch, I put together a long tutorial over at BusinessLogs.com back in February 2005 that talks about the ins and outs, code, XML, the whole enchilada.

Reply   More from author

5 Dan September 20, 2006 at 10:55 pm

Might have to link back to this – Thanks for the nod!

Reply   More from author

6 Jerry Chacon September 21, 2006 at 2:23 am

For the less coordianted among us, there is a good plugin for all this here

Reply   More from author

7 c. wess daniels September 21, 2006 at 3:35 pm

Paul – as always you rock! I’ll be making one for my site later today. Thanks!

Reply   More from author

8 Thanasi September 21, 2006 at 4:38 pm

Paul, you made it on TUAW twice in one week, nice!

Reply

9 Montoya September 22, 2006 at 10:21 am

Do these work for Flock too, or is there an extra step to make them compatible? And what about Firefox 2.0? Are there any compatibility issues there?

Reply   More from author

10 Mahesh September 22, 2006 at 10:23 am

Thats cool info man i would love to play with it.Make some search site tool for our college website.

Reply   More from author

11 Thilak September 23, 2006 at 4:31 pm

Thanks for the tip,

I prefer Quick Search on Firefox rather than the search box

Reply   More from author

12 Tom Bond March 3, 2007 at 9:41 am

Wow, thanks for this nice simple explanation. I gave up looking through the Firefox /Mozilla page on plugin development. This is great. I’m going to give it a try for my Level1Diet site, which has almost a million pages.

By the way, I created an XML version to search my big online database in MSIE 7.0 with their tool that adds a search. Seems to work fine in Explorer 7.0 (but not for earlier versions of course). Can it work in Firefox, with some modification?

Reply   More from author

Leave a Comment

You can use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Previous post: RC1 for Firefox 2.0 Release Candidate 1 Hits the Tubes

Next post: The Inquirer Looks at the Corsair Readout Flash Drive