Use the Evernote Clipper With Safari On iPad and iPhone
Updated 05/15/12: Latest code for the bookmarklet in a text file. The original post was done in May of 2011 with the code at the time that seems to be generating problems for people. I have updated the code part of the post and put it as a separate text file to avoid the code being messed-up with WordPress theming. -Jonathan
The Evernote Clipper is a great way to add URLs and sites to Evernote notebooks. It is a bookmarklet javascript that one can place on their browser bookmark bar to quickly select. But, in iOS, you don’t have that kind of functionality. Good news is the bookmarks function in Safari on iOS does allow execution of javascript. Works well on iPad, works okay on iPhone.
Here is what you do.
1. Go to http://www.evernote.com on your iPad or iPhone
2. Bookmark that in Safari
Add Bookmark on your iOS Device
3. Go to Bookmarks in Safari and edit the Evernote bookmark you just did.
4. Change the name/title to ‘Evernote Clipper’ or whatever you want it to be.
5. Copy the code from this text file and paste it in the field where the URL is (from the “j” in javascript to the “;” ) and save.
Pasting the JavaScript Into the URL Field
6. Save out of everything and go to a website or something and then when you are on the page, hit the bookmarks icon and select ‘Evernote Clipper’ bookmark to get the Evernote clipper screen.
Using the Clipper Bookmark on iOS
You might need to do the initial Safari login to Evernote, but after that, you should be good to go.
Clipper Javascript Bookmark on iOS
Update 05/09/12: It has also been reported on iPhones that it is best to set the Safari Options on “Open Links” from “In New Page” to “In the Background” if you are having resizing issues. Here is how you do it–
Go to “Settings” on your iPhone then Safari.
iPhone Safari Settings “Open Links” preference
Change that “Open Links” option to “In the Background”
iPhone Safari Settings on “Open Links”
Hi, thanks for posting this. I followed the instructions and when I click the link it brings up the clipper box, but unfortunately it’s just blank. Is this because I have an iPad 1 still running iOS 5?
Not necessarily. I am running with the iPad 1 on iOS 5.x and have no issues. Make sure you got the full code for the bookmark URL field.
I still cannot solve the re-sizing issue, I went to Safari settings -> Open Links -> and selected In Backround but it still to large and I cannot navigate it to click the save button. Any other ideas?
Where is the txt file?
If you click on the link right below the text in step 5 you will get a text file you can easily copy/paste.
http://mergy.org/wp-content/uploads/2011/05/iOSEvernoteWebClipper.txt
Does this only clip the URL into Evernote? I followed instructions and it clipped the website URL nicely into Evernote, but I was hoping to clip actual content?
Brilliant fix and enhancement! Thanks a million
I’m a huge fan!
Just wondering if there was any way to use the web clipper when i’m in Reader Mode in Safari on my iPad? Reader mode is much cleaner and easier to read, so it would be amazing to be able to clip directly from there.
I appreciate any help!
Thanks
Emily,
The Reader functionality is pretty hit and miss in my experience on mobile. I will take a look and see if I can get something hacked-out on it.
Greetings!
)
Fabulous tutorial
I used this information to create a tutorial for my staff in English and Portuguese.
I mentioned you and linked to your website.
Here is the link to my tutorial: http://www.tildee.com/DoTYFc
Thanks for letting me know. How awesome! Great job!
Cool, thanks!
Really cool. Works great. Thanks very much.
I was able to work around the resizing problem on my iPhone 4S (although its not the most elegant solution).the settings are set to open a new page in the backgrond. I turn the phone so it’s in a landscape position (horizontal); click somewhere on the web clipper box; when the keyboard screen comes up I’m able to move the web clipper page in the area above the keyboard allowing me to navigate to the “save” button; this allows me to move the page around vertically but Oddly, horizontal movement of the page works intermittently. (Note: avoid pressing the Done” button while the keyboard is open. Hope this helps.
Grazie Mille
New iPad – much to learn. This is wonderful. Thank you so much!
Followed the instructions but when I sign in to Evernote I get a message to enable third party cookies????
What’s the fix?
Maybe the javascript code is now not working. This is on Safari on iOS correct? Not Android or another device? I have seen this error as I have tried to get it going on Android, but not on iOS.
Yes. On iPad running ios 6.1.2
Try this.
1. Go to Evernote.com on Safari.
2. Login there via the web interface.
3. This should set a cookie in Safari for you from Evernote.
4. Then try to clip with the bookmark hack.
The problem is likely that the javascript call is not able to set the cookie from a security standpoint.
Give it a shot.
FYI – that also fixed my issue with the clipper bookmark hack on Firefox in Android! Cool. Thanks for mentioning it. I will post the Webclipper how-to for Android soon then as well.
WORKED! Awesome, thank you
Excellent!