Scroll the menu to find all the places to visit
Direct to Evernote Bookmarklet 2.0
22 Sep 2010For ten or so months now I’ve been clipping web pages from Safari on my iOS devices into Evernote using a one touch bookmarklet. Whilst Evernote’s own bookmarklet works for this activity, you have to enter some details for the note, maybe even login. For me this was just too much to be concerned with when I’m browsing on the move. My solution simply pushed the whole page into my default Evernote notebook for dealing with later.
I find it indispensable, but it frequently includes lots of extraneous information like ads that take up some of my monthly data allocation, take longer to synchronise and just generally foul up the flow of the note. This means I usually end up doing a bit more tidying than I’d like later on.
Over time I grew more dissatisfied with the solution until I finally created a new bookmarklet - Direct to Evernote Bookmarklet 2.0.
The solution to DEB2.0 was to combine the previous ToRead.cc bookmarklet with a Readability bookmarklet. Arc90 Lab’s Readability solution overrides the page layout to simplify it. This strips out all the things I’d like to get rid of an nicely formas the remaining page content. The ToRead bookmarklet takes the content of a page and mails it to a pre-registered account. By combining them we send the stripped down page content to the pre-registered address.
So here the steps on how to set-up the bookmarklet.
Step 1 - Get your unique toread code
- Browse to toread.cc.
- Enter the e-mail address for your Evernote account (this can be found in your account information) and click the start now button.
- Open Evernote, synchronise it and locate the e-mail from toRead which should now be a note in your default notebook.
- Open the registration link it gives you.
- From the toread.cc site copy one of the bookmarklet links.
- Paste the link into your favourite text editor.
- The unique code you require can be found after
php?s=and before&d=and in the iPhone link example below is1a2b3c4d5f60.
Note line breaks have been added to the bookmarklet below purely for readability.
http://toread.cc/iphone.php?&a=javascript:(function()
{var%20s=document.createElement(%22scr%22+%22ipt%22);
s.charset=%22UTF-8%22;
s.language=%22javascr%22+%22ipt%22;
s.type=%22text/javascr%22+%22ipt%22;
var%20d=new%20Date;s.src=%22http://toread.cc/bjs.php?s=1a2b3c4d5f60&d=%22+d.getMilliseconds();
document.body.appendChild(s)})
();
Step 2 - Create your bookmarklet
Copy the text below into your text editor and replace the example unique code (as above) with your own. This particular bookmarklet is based on my own preferences from the choices for Readability, but if you’re happy hacking around with Javascript, you just want to pull out your own preferences from Arc90 Lab’s Readability bookmark generator and substitute them in for the Readability function.
Note line breaks have been added to the bookmarklet below purely for readability - remove them when you edit it so that you have just a single line of script.
javascript:
function%20ToRead()
{var%20s=document.createElement(%22scr%22+%22ipt%22);
s.charset=%22UTF-8%22;
s.language=%22javascr%22+%22ipt%22;
s.type=%22text/javascr%22+%22ipt%22;var%20d=new%20Date;
s.src=%22http://toread.cc/bjs.php?s=1a2b3c4d5f60&d=%22+d.getMilliseconds();
document.body.appendChild(s)}
function%20Readability()
{readStyle=%27style-ebook%27;
readSize=%27size-large%27;
readMargin=%27margin-medium%27;
_readability_script=document.createElement(%27SCRIPT%27);
_readability_script.type=%27text/javascript%27;
_readability_script.src=%27http://lab.arc90.com/experiments/readability/js/readability.js?x=%27+(Math.random());
document.getElementsByTagName(%27head%27)[0].appendChild(_readability_script);
_readability_css=document.createElement(%27LINK%27);
_readability_css.rel=%27stylesheet%27;
_readability_css.href=%27http://lab.arc90.com/experiments/readability/css/readability.css%27;
_readability_css.type=%27text/css%27;
document.getElementsByTagName(%27head%27)[0].appendChild(_readability_css);
_readability_print_css=document.createElement(%27LINK%27);
_readability_print_css.rel=%27stylesheet%27;
_readability_print_css.href=%27http://lab.arc90.com/experiments/readability/css/readability-print.css%27;
_readability_print_css.media=%27print%27;
_readability_print_css.type=%27text/css%27;
document.getElementsByTagName(%27head%27)[0].appendChild(_readability_print_css);}
function%20timedCount()
{if(document.readyState%20==%20%27complete%27)
{t=setTimeout(%22ToRead()%22,2000);}}
Readability();
timedCount();
ToRead();
Step 3 - Add it to your browser
Whilst I use this on my iPod and iPad in Safari, it should work in any browser when added as a bookmark. For iOS devices the easiest method I’ve found is to….
- Copy the bookmarklet to the clipboard (if you have it on another machine, put it in Evernote).
- Open your browser.
- Navigate to thoughtasylum.com (any page will actually do).
- Bookmark the page and title it something meaningful - like DEB2.0
- Save the bookmark. Currently it has the wrong URL so ….
- Edit the bookmark. Remove the URL and paste in your bookmarklet.
- Save the bookmark. Now you have the right URL.
So there you have it, a one touch method of getting a relatively clean web page in its entirety right into Evernote from your mobile browser without ever leaving the page.
