Little JavaScript-scripts you can place in your bookmarks, favorites, hotlist, whatever to perform some useful functions, based on the site that you are currently viewing. Simply click on the bookmark or drag it into the current window (you will have to drag them if you are using Opera and have it set to NOT reuse existing windows).

To use one of the bookmarklets below, simply right click the link and choose the option that will file the link address to your bookmarks. Simply clicking on the links to the bookmarklets will execute them. Most of the scripts below can be tested this way, but some will behave quite strange, because they might find themselves among the links on this page. However, nothing bad should happen in this case. Your Back-button will always be there to help you.

As usual, Opera users are one step ahead. You can download all of those bookmarklets in one single file in Opera's bookmarks file format (adr). Extract the zip file, and import the result into your hotlist, bookmarks, or whatever you like to call them.

I have tested them with Opera, MS Internet Explorer 6, and Mozilla 1. Guess what! They do work in all of these browsers.

I am still trying to categorize the bookmarklets. But this is not that easy. Currently these categories are available:

Apart from the scripts themselves, you can find:

 

Get information about the current page

List Mailtos This bookmarklet will pop-up a window showing you all the email addresses listed as mailto-links on the current page (if there are any).
Count all images Counts all the images on the current page. Will also pop up an alert box to let you know the result.
Show HTTP headers Open a new window using Mozilla.org's webtools to view the headers the current server is sending for the current page. Maybe quite slow.
Read Cookie for Site This one will show you the information about the cookie the current site has set on your machine (or inform you that no cookie was set).
Last Modified Hmm this page looks like it was created in the late 20th century. Is the information still valid or should I forget about it? You might use this bookmarklet to get the date of the last modification.
 

Navigation

num+ If you are on a page, which name ends with a number, e.g. docs03.htm, this will take you to the next number (docs04.htm in the case of the example). Very useful for docs, indeed.
num- Same as above. Nearly. It won't add to the number but subtract one.
Up This takes you up one level in the directory hierarchy you are currently in. Say you have been reading www.domain.tld/level1/level2/ it will take you to level1. If you have been reading www.domain.tld/level1/doc.html, it will take you to level1, too.
Top Cousin of the above. It will take you to www.domain.tld no matter where you are on that site.
 

Searching stuff

Search Site Can't find what you were looking for? They did even hide their search function. Try this. It will ask you for a search string and then open a new window with a google search limited to the current site (if you are on www.domain.tld/something it will search www.domain.tld).
Search Domain Same as above but it will search the whole domain. If you are on www.domain.tld/something, it will limit the search to domain.tld. So you might get more (in some cases much more) results than with the site search bookmarklet.
Search links to this page Ask google for pages that link to the current one.
Search for related pages Do a google search for related sites
 

Geek Tools

Show uptime for site server This one will ask netcraft.com for uptime information of the current server.
Whois This one will query geektools.com for whois information about the current page's domain. Unlike the bookmarklet found on other sites that will query netsol.com, this one should work with almost any TLD.
Generate Link to current page It will open a new window, containing a link to the current page. Gives you something to point your right mouse button at.
 

Handle badly coded sites

Statusbar Shows URL Somebody stole your statusbar to display some stupid ticker there. Great! Now you can no longer see the addresses of links in the status bar. Use this bookmarklet and each link will display its target address in the status bar.
ImageTitles Opera won't show you the alt tags of images in that little yellow window when you hover your mouse above the image. They say this is standard compliant. The problem is: site creators don't know that, and they don't care because IE will do it just fine as long as you provide the alt attribute. This bookmarklet will give every image a title attribute with the same value as the alt attribute. If there are any alt attributes, of course.
Split Frames into Windows This will split all frames into separate, new windows.
Validate at WDG Will open a new window with the results of a validation of the current page's HTML on htmlhelp.com.
Validate HTML at W3C Same as above, but it uses the W3C validator.
Validate CSS at W3C Validate the CSS used on the current page at W3C and show the results in a new window.
 

Currently unsorted

AutoFill Another site that wants you to fill out a stupid registration form just so you can download something or read a page. This bookmarklet will fill out the form for you. With nonsense data, of course.
Open all images Browsing for images? Open all the links to JPGs that are referenced on that thumbnail page.
Show All Images Open a new window that will show you all the images on the current page.
Resize Window to 640 x 480 Do I really have to give an explanation for this one? Well, I might say that it is handy for web developers. Of course you can change 640 x 480 to something more likely like 800 x 600.
Find Links To this Page This one will open a new window with a google search for links to the current page.
 

The pain of creating bookmarklets and putting them on the web

Creating bookmarklets is a little tricky because to put them among your bookmarks requires the JavaScript code to be in one single line. Of course editing something like that is no fun at all and next to impossible. I don't know what others do, but here is what I did:

I use UltraEdit as my editor for everything. So it was only logical to use it to edit my bookmarklets. Among its features are syntax highlighting and macros. So I set it up to syntax-highlight JavaScript code and wrote a little macro that would loop through all the lines of the code and append each one to the contents of the clipboard. I could now go to my browser and simply paste the clipboard contents to the URL property of a bookmark.

The next difficulty was to put my bookmarklets on this web page. This turned out to be a little tricky. Here is a simple example, a link to a bookmarklet:

<a href="javascript:var x=prompt('Enter some number', '');
    if ( x > 5) alert('Number was above 5');">bookmarklet</a>

This is certainly valid JavaScript code, but it won't work as link in your browser if you just copy it and then paste it into the body of some web page. This is how the link would look like in Opera, e.g.:
10) alert('Number was above 5');>bookmarklet
Not quite what we wanted. What made this one break is the ( x > 5) part. The >-sign made Opera think that <a href...> part of the link was over and that the rest must be the text visible for the viewer.

The logical thing to do was replace every > with its corresponding HTML-entity: &gt;. Opera was ok now, but MS IE still didn't like it. It would display the link correctly, but then give a syntax error for the JavaScript. The trick was to use the numeric notation for special (or any, for that matter) characters. So > became &#62;. (%3e wouldn't help either. Opera didn't like this one.) Finally, both Opera AND Internet Explorer were happy. Even Mozilla liked it.

Happy end? Well, not quite. To quote something in JavaScript you can either use double quotes (") or single quotes ('). However, if you are going to put a bookmarklet onto the web, you better use single quotes. Believe me.

To end this long winded, sad story, I'll give you a couple of versions of the example above. See whether your browser likes it or not. If it doesn't I'll happily accept contributions of changes to these scripts that work in yet another browser (I'll delete anything without comment that will not work in either Opera, MS IE, or Mozilla).

 

Thanks and links and stuff

The first bookmarklets I tried were from Phil Burns site www.philburns.com. He's got a neat collection there and you might recognize some of his bookmarklets among mine. I always changed the code a little and often tweaked their behavior. E.g. most of my bookmarklets will rather open a new window than replace the old content with the new. So many thanks to Phil!

Another very good site with lots of bookmarklets and a browser comparison chart is maintained by Jesse Ruderman and can be found at www.squarefree.com/bookmarklets/.Highly recommended.

Here is a new entry in this little collection of links: Bookmarklets - Browser Power. The author of this site, Troels Jakobsen, was kind enough to provide a link to my page. Because I am a nice guy and because the site is quite good, I also provide a link to his page. One of the really cool features on Troels' site is his bookmarklets builder. Opera 6 can not really deal with all of its features, but as Opera 7 doesn't seem to have any problems, I gladly recommend it.

I also tried to have a look at some of the bookmarklets offered by bookmarklets dot com. I had to do some weird stunts to even be able to see them. They won't let anybody with any browser on their pages. Of course, their bookmarklets won't work with any browser either. But is that a good reason to lock out the interested?


That's all, folks! If you like, send me an email. Suggestions for improvements, new bookmarklets, and links are always welcome. Here's my address: feedback@manni-heumann.de