Monday, December 07, 2009

Parse and display Firefox bookmarks.json on the fly as HTML with jQuery

Abstract: this small HTML/JS/CSS file is parsing the bookmarks.json file located in the Firefox profile directory and displays all of your bookmarks as HTML. This file can be set at a default home page and so you can choose any of your bookmarks with less clicks.

Screenshot:

Note: This code has been programmed as an exercise to learn jQuery, but serves my own practical needs as well. The same effect (displaying bookmarks) can probably be archived by using a Firefox plugin, but I like it this way.


Usage:
  1. Download the code and put it into your Firefox profile directory "bookmarkbackups" subfolder. 
  2. Adjust the name of the bookmark file on line 58.
  3. Navigate to the file like this: file:///C:/Home/Mozilla/bookmarkbackups/view.html. The exact address will be different on your computer (how to find out).
  4. Optionally set this URL as a default.
Code documentation: the script is loading jQuery from google.com and loads the specified JSON file upon startup. Then it converts it from JSON to Javascript objects and loops through them making DIVs for folders and A HREF for bookmarks.

What's next: I hope this code makes an interesting reading for jQuery novices. I'm happy to receive comments and improvements to this code.

Dirty PR: see the links on the right for other sites I've made.

1 comment:

MalSoMalSo said...

Very nice, thanks!
I also needed this:
http://stackoverflow.com/questions/335409/jquery-getjson-firefox-3-syntax-error-undefined