Use the Evernote Clipper With Safari On iPad and iPhone by the mergy notes

May 14, 2012

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.

iOSEvernoteWebClipper

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”

Comments

Brad Lakritz said on May 12, 2011 at 10:04 am:

Awesome! Thanks for sharing these steps. I wonder how this could be done for student roaming accounts for lab computers. I suppose they would have to do this themselves independently on their browser. Of course we are moving away from such accounts and that may be a moot point going forwards.
Reply ↓
Pingback: Evernote Future? « iCSUS
Pingback: Use the Evernote Web Clipper On Your iPhone | Dan Hall's Sourcing Seattle Blog
Pingback: Comment transférer sur Evernote un page web depuis Safari… | cellCIPS.ch
Pingback: Sharing on the use of iPad to Physics Teachers « Leetl's Weblog
Joan said on March 14, 2012 at 10:04 am:

Thank you so much. I had thought about joining Pinterest, but all I really wanted was a way to save bookmarks. I already had Evernote but couldn’t install Clipper on my iPad, so I was not using it much….now I am good to go!
Reply ↓
Pingback: 10 ways Evernote can make students more productive « newtechtimeline
Bob Jonson said on April 4, 2012 at 3:58 pm:

Thank you soooo much! This helped me a ton!
Reply ↓
Pingback: How to add an Evernote bookmarklet to Safari for iPad - macography.net by Pietro Montalcino
Kristin said on April 15, 2012 at 7:51 am:

Worked perfectly. Thank you!
Reply ↓
KvG said on April 18, 2012 at 1:59 am:

This is great. Thank you.
Reply ↓
Stephen J. Rosen said on April 22, 2012 at 4:57 pm:

Awesome. Yet another reason Evernote is my main ‘go to’ app to get things done.
Reply ↓
Stephen Zablotny said on April 23, 2012 at 9:35 pm:

This also works on the desktop for older versions of safari if you can’t get or find the web clipper from evernote for your version of the browser
Reply ↓
Eric said on April 27, 2012 at 7:11 am:

And make sure that you have Javascript set to ‘ON’ in your Safari Settings because if you don’t you will spend 20 min wondering if you’ve gone bonkers like I did. ‘ON’ Thanks for the great instructions.
Reply ↓
- mergy said on April 27, 2012 at 7:13 am:
  
  Great point Eric.
  
  When I wrote this last year, I think Apple was leaving it on by default. They might have changed that now at time of OS install/update.
  Reply ↓
Diane said on April 28, 2012 at 4:34 am:

This “works” on my iPhone in that the box comes up, but it’s too big and I can’t move it to get to the send button.
Reply ↓
clivia said on May 3, 2012 at 12:34 am:

diane, i have the same problem
Reply ↓
Dave said on May 4, 2012 at 4:28 am:

I have the same problem. Any suggestions?
Reply ↓
mergy said on May 4, 2012 at 4:52 am:

Been a while since I set this up and wrote the article, but perhaps something changed. Still works fine on my iPhone and iPad.

Can people who have problems provide more details on the devices you are using? like which iPhone/iPad model?

Thanks.
Reply ↓
- Paul said on May 9, 2012 at 3:13 am:
  
  Can’t resize on iPhone 4
  Reply ↓
  - Paul said on May 9, 2012 at 5:13 am:
    
    found that this behaviour is connected to the “open links – in new page” setting.
    If you set it to ” – in background” all works fine
    Reply ↓
John said on May 4, 2012 at 3:31 pm:

Thanks so much. This is the ONLY place I’ve found with instructions to clip on my iPad with Safari that works flawlessly. You rock.
Reply ↓
Jim said on May 5, 2012 at 12:25 am:

IPhone 4s. Used to be able to resize to get to send button, but now can’t.
Reply ↓
Peter Draper said on May 6, 2012 at 5:57 am:

All I can say is WOW! After searching hi and low, the solution is your solution…and it works! Thanks so much!
Reply ↓
mergy said on May 9, 2012 at 5:25 am:

Thanks Paul – I will update this.
Reply ↓
mergy said on May 9, 2012 at 5:39 am:

I have updated the post with the latest javascript code and I am not seeing the reported issue on my iPhone 4 anymore.
Reply ↓
mergy said on May 9, 2012 at 5:57 am:

I have now update the post from last May with the new code for the Evernote bookmarklet and added the open links “in the background” recommendation. Both should help people out –

Thanks everyone for the heads-up.
Reply ↓
Patricia said on May 12, 2012 at 8:37 pm:

This does not appear to be working either on my iPad or in Safari on my Macbook… I can add the bookmark just fine and paste in the javascript but nothing happens when I click on it.
Reply ↓
- mergy said on May 13, 2012 at 9:52 am:
  
  You might want to make sure javascript is enabled. Seems like Apple might be disabling this by default now on shipping. Also, make sure you copied the full code.
  Reply ↓
  - Patricia said on May 14, 2012 at 1:49 am:
    
    I have checked both. No joy!
    Reply ↓
    - Mike said on May 14, 2012 at 9:41 am:
      
      I’m having the same problem. I checked Javascript in both places as well. The Safari console on my MacBook Pro says “SyntaxError: Invalid character ‘\u8217′” when I select the bookmark. I just upgraded to OS X 10.7.4.
      Reply ↓
    - Mark said on May 15, 2012 at 4:51 am:
      
      Also having this issue. Double checked everything but doesn’t seem to do anything.
      Reply ↓
mergy said on May 15, 2012 at 5:01 am:

Sorry it hasn’t worked out for some people. This is only to try and get the javascript code into iOS Safari.

BTW, I would suggest just using the standard bookmarklet from Evernote for OS X. There is no need to try and have in javascript for a bookmarklet at evernote.com.
Reply ↓
mergy said on May 15, 2012 at 5:25 am:

I think I know what was happening.

The code was getting messed-up with WordPress/page formatting. I have changed to just a txt file now. This is actually even easier for people to copy/paste from their iOS devices.

Hope this helps people. I tested a few different ways from the text file copy/paste and all good.
Reply ↓
- Mark said on May 16, 2012 at 5:10 am:
  
  The fix worked! Thanks.
  Reply ↓
  - mergy said on May 16, 2012 at 5:21 am:
    
    Thanks Mark.
    
    The code in the browser issue was probably it. Thanks very much for pointing this out so I could fix it for people.
    Reply ↓
Pingback: Use the Evernote Clipper With Safari On iPad and iPhone | the mergy notes
mergy said on May 15, 2012 at 5:45 am:

I have updated the post to this year because of the recent changes and created a redirect for people finding the old page.
Reply ↓
Pat said on May 17, 2012 at 4:11 pm:

It’s not working for me on iPod Touch. It looks like “}” is being converted to “%7″ when I save the edited bookmark. Unfortunately, the iOS keyboard doesn’t give me the option to insert “}”.
Reply ↓
skyeblu said on May 17, 2012 at 7:54 pm:

this was extremly helpful!!! u rock!!!
Reply ↓
kath said on May 20, 2012 at 2:55 pm:

tried the ipad thing over and over with the code, which i couldn’t really read. what do I put under the bookmark? WHAT is the correct code. thanks
Reply ↓
Mr Parrot said on May 23, 2012 at 2:21 pm:

Thanks so much for this. I’m new to iPad and it was driving me nuts. Can’t understand why this isn’t an Evernote feature.
Reply ↓
- mergy said on May 23, 2012 at 2:27 pm:
  
  Really nice to take the time to write a thanks. Appreciate it.
  Reply ↓
Mick said on May 24, 2012 at 2:18 pm:

Just saying thanks as well! Cheers!
Reply ↓
Ernestasia said on May 28, 2012 at 12:05 am:

Thank you very much for this! i have just bought my ipad for several weeks now and have been looking for a way to clip websites to my Evernote. Thanks!
Reply ↓
Li said on May 28, 2012 at 4:03 pm:

It works fine with my iPad 2. Brilliant!
Reply ↓
- mergy said on May 28, 2012 at 4:44 pm:
  
  Appreciate the heads-up and confirmation. Thanks for taking the time to comment. Take care!
  Reply ↓
Dan said on May 31, 2012 at 8:13 pm:

This looks good but does not appear to work for clipping only some text from a web page. When I select some text on my iPad and then choose the bookmark, the highlighting is turned off. The bookmark works but sends only a link to the page rather than any selected text. Forgive me if this is already known or expected.
Reply ↓
jer said on June 2, 2012 at 8:03 am:

Just tried this this morning in my ipad3. Getting a “who goes there?” message from Evernote. I tried logging in and trying again but still get the same message. Says “403 access restricted”

Anyone know how to get around this?
Reply ↓
- mergy said on June 2, 2012 at 9:26 am:
  
  Crazy. Not seen before and I am not seeing it.
  Reply ↓
Toni said on June 13, 2012 at 1:18 pm:

Great, thanks
Reply ↓
Robert said on June 17, 2012 at 5:58 pm:

For some reason I can’t paste my password into the password slot when it asks for it on the clipper. I can paste the password on other places but not in the evernote clipper. Help?
Reply ↓
Robert said on June 17, 2012 at 6:04 pm:

When I try to paste my password into the password space it wont take it. I use 1password so my password is VERY complex. I can paste the password in any other place but not in the evernote clipper. Help?
Reply ↓
Pingback: Clip full web pages directly to Evernote on your iPad « How-To « tabletproductive
alvin said on July 7, 2012 at 4:45 pm:

Works great, thanks a lot
Reply ↓
Leo said on July 13, 2012 at 11:10 pm:

This is great! I had been looking for this since I got my iPad and still wonder why it is not a standard feature for Evernote…
Thanks a lot!
Reply ↓
Justin said on July 14, 2012 at 6:59 pm:

Awesome! Thankyou this is fantastic!
Reply ↓
- mergy said on July 14, 2012 at 7:02 pm:
  
  Thanks. Glad it worked for you. The text file code copy/paste method seems to have been a big help for people. Take care…
  Reply ↓
Pingback: Tips on effectively using Evernote on ipad and PC to take notes – Q & A « little miss pharmacist
Joe said on August 1, 2012 at 10:26 am:

Having same issue as Pat, braces { } are saved as %7B and %7D and are not an available punctuation in the address field. Wonder why some have this issue and others not???
Reply ↓
- mergy said on August 1, 2012 at 11:08 am:
  
  Seems like you are typing stuff out. I would recommend opening the text file link on the iOS device and finger-press hold to get the contextual menu to “Select-All” then “Copy” to paste into Safari Bookmark. This way, you don’t need to type anything or try to find crazy symbology.
  Reply ↓
Melissa said on August 2, 2012 at 4:08 am:

I’m such a novice, but even I eventually figured it out and it works perfectly! Thanks for taking the time to share and to support.
Reply ↓
John said on August 7, 2012 at 5:19 pm:

I love this but it requires me to enter my password every time… even when I check the “Remember Me …” button.

Any ideas?
Reply ↓
- mergy said on August 9, 2012 at 8:39 pm:
  
  Clear cookies and check your password settings to be sure Safari can keep it.
  Reply ↓
B said on August 15, 2012 at 12:23 pm:

I think I followed all the instructions, and it still is way too big on iPhone. Has anyone gotten it to work on iPhone? Thanks!
Reply ↓
- mergy said on August 16, 2012 at 8:30 pm:
  
  Sorry it isn’t working for you. YMMV.
  Reply ↓
- mergy said on August 22, 2012 at 7:38 am:
  
  I will also see if something had changed on Evernote’s side. Perhaps a code mod since May?
  Reply ↓