Guide: Bookmarklets

I’ve been using bookmarklets for some years now, they are supremely handy little tools. What is a bookmarklet you ask? Well, according to Wikipedia:

A bookmarklet is an applet, a small computer application, stored as the URL of a bookmark in a web browser or as a hyperlink on a web page. The term is a portmanteau of the terms bookmark and applet. Whether bookmarklet utilities are stored as bookmarks or hyperlinks, they are designed to add one-click functionality to a browser or web page. When clicked, a bookmarklet performs some function, one of a wide variety such as a search query or data extraction. Usually the applet is a JavaScript program.

What do they look like?

Well that depends – basically, just like any other bookmark on your browser toolbar. You can rename them just like any bookmark, move them around, or, as I have done, use a Firefox plugin to allow me to assign an icon to them, so I can remove the name entirely giving me more toolbar space.

I have, added a folder there called Bookmarklets that does nothing but act as a title for the Bookmarkets section of my toolbar. On the right is a non-icon bookmark – this is what bookmarklets would look like without the plugin mentioned above.


What do they do?

Lots of things! Lets explain the ones I use, from left to right:

  • WordPress PressThis – if I’m reading an interesting page I want to share on this blog, simply clicking that bookmarklet pops up a new browser window that opens a new WordPress post on this site. with the article title and link to the article already embedded, ready for me to add anything else. If you’re a WordPress user, you can find this by clicking the Tools menu in your Dashboard.
  • Facebook Share – Pretty much the same as above, but slaps the output on your FaceBook profile instead.
  • Twit This – Pretty much the same as above, but slaps the output on your FaceBook Twitter profile instead.
  • Google Reader – If you use Google Reader for RSS feeds, this one will open the RSS feed of the page you are on in Reader, all ready for you to subscribe to it.
  • ImageShack – opens up a page with all the images on your current page embedded into it. A single click on any of the images rehosts them on ImageShack for you, meaning you don’t have the problem of trying to hotlink images in blog or forum posts.
  • Linked Images – faced with a web server directory listing of images and you don’t want to click on each one to view? This opens them all up fullsize on a page for you to scroll through.
  • Readability – sick of trying to read websites with “hip” and “trendy” designs? Or maybe your eyes just aren’t what they once were. Well, click on this, and it opens your current page in a nice smooth, large font format, with all the guff stripped out.

How do they work?

JavaScript sorcery. In practise? To “install” them is usually a manner of simply dragging a link (from a page like the ones linked above) to your browser bookmark toolbar. To use them, simply click! To “uninstall”, simply right click and delete! It couldn’t be easier!

I use Firefox, is that OK?


I use Safari, is that OK?


I use Internet Explorer, is that OK?

Yes! With some exceptions, but generally they work fine. You usually can’t drag the link to your Favourites bar, but right clicking and ‘Add to Favourites’ works.

I use Chrome, is that OK?


I use Opera, is that OK?

Hurr. Weirdo. Fucked if I know or care. 😛