posterous header
« Back to blog

A Not So Easy Way To Add Bookmarklets To Safari For iPad, iPhone, and iPod Touch

April 22, 2010

No-bookmarks
Let me tell you something you probably already know.

Bookmark management in Safari for the iPad, iPhone, and iPod Touch completely sucks.

Yes, you could manage your bookmarks with whatever version of Safari you happen to be running on your desktop or laptop, and then synchronize the bookmarks to your devices through iTunes. That works great if you're one of the 2% of crazies that actually use Safari or pay Apple $99 a year for MobileMe. You could also import all of your bookmarks from IE or Firefox or what-have-you into Safari and then synchronize to your devices. Knock yourself out. I'm sure that will be a great use of your time and that you'll really enjoy regularly maintaining your bookmarks across browsers and devices.

None of this ever really bothered me, though. I don't use browser bookmarks anyway (does anyone anymore?) There's browser history and address bar autocomplete, not to mention there are more than enough online tools to keep track of where you've been, where you want to go back to, and what you want to remember. All of this eliminates the need to load up your browser with thousands of bookmarks.

What I do use, however, is bookmarklets -- those tasty little bits of Javascript that masquerade as bookmarks but add actual functionality and convenience to your everyday World-Wide-Web experience. Unfortunately, getting these bookmarklets into Safari on the iPhone is an extremely painful process. But that didn't bother me either... until I got my iPad.

Once I got my hands on the pad, I quickly realized I could no longer function without my beloved bookmarklets. I found myself surfing in a way that mimicked my desktop browsing behavior much more closely than when I browsed on the iPhone.  This meant that I now needed to have my bookmarklets for sharing, posting, tagging, saving, look-ups, etc. But the steps for adding a bookmarklet on the iPad was the same as with the iPhone -- an awful one.

The process is far too painful to describe in detail, but Marco Arment of Instapaper details the procedure nicely in his step-by-step guide to adding the Instapaper bookmarklet to an iPhone or iPad.

Basically, you first need to add a placeholder bookmark, and then edit that bookmark by renaming it and pasting the bookmarklet's Javascript into the field reserved for the bookmark's URL. That doesn't sound so terrible until you realize it involves somewhere between 10 and 13 taps as well as typing and pasting.

It goes something like this:  

bookmarklet-madness

Of course that's only IF you managed to find a way to copy a bookmarklet's Javascript to your clipboard.

And that, for me, is the part that goes beyond pain and crosses over into torture territory. Bookmarklets are created by putting Javascript into a URL.  This enables you to drag the snippet to your browser's bookmark bar like any other link.  Unfortunately this just wont work in Safari for the i-Devices. And if you think you can take a gander at the page's source in mobile Safari and copy the Javascript from there, you are mistaken. Furthermore, it isn't standard practice (thankfully) for bookmarklet creators to put the bookmarklet's Javascript on the page for you to copy and paste into a bookmark. In most cases that would be fugly. And stupid.

So I took a few minutes to copy the Javascript from all my Chrome bookmarklets and made myself a little iPhone/iPad formatted page with all the Javascript in a selectable textarea for each bookmarklet. I opened up the page on my gadgets, and in about 5 minutes had all of my important bookmarklets loaded into Safari on both my iPad and my iPhone.

I know this is far from ideal, and even further from anything resembling a solution, but until some smart person comes up with a way around this, or until Apple adds some better bookmark management or add-on capabilities to mobile Safari this will have to do for now.

I'll leave this page up for anyone who wants to add some of these bookmarklets to Safari on their own iPads or iPhones. Just visit http://static.chrisbray.com/bookmarklets on your iPad or iPhone and start tapping.  I hope this takes at least some of the pain out of the process.

Here is the list of somewhat popular bookmarklet Javascripts that I have on the page.  Note that bookmarklets that utilize selected page text (Wikipedia lookup, dictionaries, searches, etc.) wont work due to the way that Apple has implemented select/copy/cut/paste on i-Devices, so I haven't included any of those.

Share on Posterous
Shorten with bit.ly
Add to Google Reader
Bookmark on del.icio.us
Instapaper: Read Later
Share on Facebook
Clip to Evernote
Share on Tumblr
Ping.fm
Translate to English
Digg This
Reddit
Stumble Upon
Site Info
Show Images
Validate HTML

Let me know if you'd like to see other popular bookmarklets added, and I'll do my best to throw them in there when I have the time.

 

Comments (15)

Jun 19, 2010
Dominik said...
Thanks a lot! Extremely helpful!
Jun 23, 2010
Ray Wu said...
Thanks Chris. Have you heard of other instances where the Google Reader bookmarklet you created couldn't pick up the feed of the webpage? I've double checked Andre-added the java script to the bookmarklet a few times. Thanks again!
Jun 23, 2010
Ray Wu said...
Actually overcame the problem: I suspected the JavaScript you posted was specific to your google reader account. Copied from my reader button and it worked!
Jun 24, 2010
Chris Bray said...
RCJW -- Yes, there are some sites that Google's bookmarklet can not find a feed on the page. Also, the bookmarklet is generic, and not specific to my account. Thanks!
Jul 03, 2010
Denny McCorkle said...
Thanks Chris. It worked like a charm! Though I still wish we could use Chrome on the iPad.
Jul 11, 2010
Thanks Chris!! This is a Productivity lifesaver!!!
Oct 08, 2010
Sean Elfstrom said...
This bookmarklet makes things easier by displaying JavaScript source so you can copy it. http://kawanet.blogspot.com/2010/08/bookmarklet-viewer-bookmarklet-for.html
Dec 20, 2010
George Roberts said...
Many thanks for these. Cant agree more with the limitations of this horrible browser. Now, I am Trying to get the Posterous bookmarklet to work on my iSad. Had similar problem with the tweetie work around. Suspect it is the posterous script that doesn't render properly. Anyone else tried the Posterous one? Does it work?
Dec 20, 2010
George Roberts said...
The delicious one works treat. Thank you!
Apr 07, 2011
Andrew Johnson said...
That's cool, all the scripts off my Mac are on the iPad and the script ones were hopeless until now of course, cheers ;)
Jul 10, 2011
ATLJohn said...
Thanks for this! I've been using your page for a while. Could you possibly add a share to google plus bookmarklet? not +1. Thanks!
Sep 03, 2011
TavisS said...
Thanks for this, I have used it several times. Do you have a bookmarklet to share a page onto Google+ from iPad? I've been searching the web but no luck.
Oct 14, 2011
Can you add this one to your iPad list @ http://static.chrisbray.com/bookmarklets/ too?

This bookmarklet allows you to submit quickly to hacker news once you've finished reading something.

javascript:location.href='http://news.ycombinator.com/submitlink?u='+encodeURIComponent(document.location)+'&t='+encodeURIComponent(document.title);

Thanks for the others, they are super helpful.

Oct 17, 2011
web2write said...
You can use the wonderful collection of javascripts on
http://static.chrisbray.com/bookmarklets/
.. or copy the javascript (on a computer) and paste it somewhere, you can read from your iPad, for example as a note in diigo - as I did for the code of thestorify bookmarklet
http://www.diigo.com/item/note/5eyh/8ge3
... or even mail the have-code to your account ....

... so it works!

Heiko

Oct 17, 2011
web2write said...
You can use on of the collections for bookmark lets to paste it to your safari bookmarks as described here:
http://www.labnol.org/software/iphone-ipad-bookmarklets/18969/
or just copy the javascript-code (plaintext!) to a page you can visit by your iPad and copy/paste it on your own ...
like I did with the storify bookmarklet on a diigo-note:
http://www.diigo.com/item/edit/note/5eyh/8ge3
.. or even mail it to your account :-)
...
So you can include every bookmarklet to your iPad!

Much Fun!

Heiko

Leave a comment...