I frequently use the Evernote webclipper on my Mac but wanted something which:
A. Would work instantly i.e. eliminate the wait for the webclipper to capture, upload and sync the page
B. Could be triggered faster with less interaction / fewer mouse clicks than the webclipper
So I’ve strung together an alternative solution which instantly clips the full contents of the current browser tab as a long single-page PDF and automatically saves it to the relevant Evernote notebook in the background. There’s no need to wait for clipping or syncing: the browser tab can be closed immediately.
I want to explain my solution here, and throw it open to improvements from the community: I’m sure it could be improved!
There are really two parts to this solution
1. The ‘trigger’ i.e. how the workflow is activated
My approach could be entirely customised or replaced with a keyboard shortcut in order to broaden compatibility to Macs without touchbars.
My approach requires BetterTouchTool (for the Touchbar integration) and Alfred, but could be implemented as a keyboard shortcut or Alfred command, without using BetterTouchTool
2. The automated page capture and upload to Evernote
This users Zapier (at least a Starter account), PhantomJSCloud (free for up to 500 pages per day) and a Dropbox account.
How the trigger works
User taps ‘Evernote elephant’ button on the touchbar
User selects destination notebook on the touchbar (“Web Clips”) in this example
BetterTouchTool runs the following AppleScript
tell application “Safari”
set _pageURL to the URL of front document as string
set _noteTitle to the name of front document as string
set _pageTitle to the name of front document as string
tell application “Alfred 3”
run trigger “webclips” in workflow “com.zapier.alfredbasic” with argument _pageURL
tell application “System Events” to key code 36
The AppleScript activates an Alfred Workflow which triggers a Zapier web hook
How the page capture and upload works
The trigger has now activated the Zapier webhook. Your zap should look something like this its fully set up
In the Zapier zap, the webhook trigger should be configured as “Catch Hook”, with “Silent Mode” left unticked, and the “Pick off a child key” field left empty
The second stage of the Zap is a “Custom Request” for “Webhooks by Zapier”. This will use PhantomJS to capture the page as a PDF. The custom request template should be as follows:
Data Pass Through: No
Basic Auth: leave empty
Headers: Leave empty
- The third stage of the zap is to upload the resulting PDF to dropbox. The Zapier template should be:
File: Select “Step 2, Exists but not shown’ from the dropdown
Specify File Name: Select ‘Step 1 Querystring Keywords’
Specify File Extension: .pdf
- The final stage is to create a new Evernote note and upload the PDF from Dropbox to Evernote. The Evernote action is ‘Create Note’. The template is:
Notebook: select the relevant notebook from the dropdown
Step 1, Catch Hook, Querystring Note from the dropdown
Step 1, Catch Hook, Querystring Note
Tags: whatever you want
Reminder time: leave blank
Reminder Done time: leave blank
Attachment: select: Step 3 > Upload File > Direct Media Link
Limitations of this solution
- This solution won’t work with any pages which require a login
- It requires a separate Alfred workflow and separate Zapier zap for each destination notebook which you want to make available to the TouchBar trigger
Obvious room for improvement
- The current trigger mechanism is pretty inelegant in the way it uses Alfred as a ‘middleman’ to trigger the web hook. I’d prefer to trigger the web hook directly from BetterTouchTool - but couldn’t figure out how to do it.
- Capture the name of the page, and use that to name the Evernote note and the PDF.