Popclip to Obsidian: The easiest way of capturing text.

UPDATED:

An extension and a plugin for Popclip and Obsidian respectively.


Popclip Obsidian Plugin

I'm introducing the Popclip extension and Obsidian plugin that I built in a day.

I've been using these tools extensively for a while now. I'm a big fan of Popclip and Obsidian.

I'm using Popclip to capture the text from the web and Obsidian to store my notes.

However, capturing text from the web and pasting it to Obsidian is a bit of a hassle.

There are other tools that I've tried but either they are so expensive for the value they create, or they are not working as I expected.

What are the requirements?

  • You need a Popclip app on your MacOS.
  • You need an Obsidian app on your MacOS.

How does it work?

There are two part of the workflow.

  • Installing the Popclip extension.
  • Installing the Obsidian plugin.

Both of those options are open-sourced and available on Github.

The List of Best Blogging Platforms

The list of best blogging platforms for your creative works. The list includes free and paid platforms.

The List of Best Blogging Platforms

Part I: Installing the Popclip extension.

Install Popclip Extension

The first step is installing Popclip extension to capture text. You can select the text below and your popclip automatically shows the installation option.

# PopClip - Obsidian extension, markdown variant
name: ObsidianClipper
icon: O
capture html: true
options:
- identifier: "vault"
label: "Vault name"
type: string
- identifier: "path"
label: "Location"
type: string
javascript: |
const vaultName = encodeURIComponent(popclip.options.vault)
const fileLocation = encodeURIComponent(popclip.options.path)
const data = {
clipping: popclip.input.markdown,
path: fileLocation || undefined,
}
let clipping = popclip.input.markdown
if (popclip.context.browserUrl.length > 0) { // append markdown source link if available
data["title"] = popclip.context.browserTitle
data["source"] = popclip.context.browserUrl
}
clipping = encodeURIComponent(JSON.stringify(data))
popclip.openUrl(`obsidian://advanced-uri?vault=${vaultName}&daily=true&heading=popclip&data=%0A${clipping}&mode=append`)
#end

Part II: Installing the Obsidian plugin.

Popclip Obsidian Plugin

The second part is installing the Obsidian plugin. It basically, manipulate the text you capture with the Popclip extension you installed in step 1.

I didn't submit the plugin yet. Therefore, you need to install it manually.

  1. Download GitHub repository of Obsidian Popclip plugin.
  2. Copy the popclip folder under "dist".
  3. Paste the popclip folder under your Obsidian plugin folder.
  4. Restart Obsidian.
obsidian pluginpopclip extensionobsidian popclip workflow