PopClipの拡張機能を自作する方法(スニペットの作成から公開まで)

PopClipの公式ディレクトリにはさまざまな拡張機能が登録されています。
翻訳やノートアプリへの取り込みといったよくありそうな機能は、だいたいここで見つかります。
しかし、自分が使っているマイナーなサービスに投げたい、社内ツールのURLを選択したIDで開きたい、といった用途では、既存の拡張機能だけで対応できないことがあります。
そんなときは、拡張機能を自作する選択肢があります。
開発者登録もビルドも要らず、テキストエディタがあれば完結します。
今回はPopClipの拡張機能を自作する方法についてまとめます。
拡張機能の2つの形式
PopClipの拡張機能には、大きく分けて「Snippets(スニペット)」と「Packages(パッケージ)」の2つの形式があります。
違いをまとめると下記の通りです。
| 項目 | Snippets | Packages |
|---|---|---|
| 形式 | テキスト | .popclipextで終わる名前のフォルダ |
| 設定の書き方 | YAMLやJavaScriptなど | Config.yamlなどの設定ファイル |
| 追加ファイル | 持てない | アイコン画像・スクリプト・READMEを同梱できる |
| インストール | テキストを選択して実行 | ダブルクリック |
| 署名 | できない | できる |
Snippetsの方が気軽に追加できますが、追加ファイルの同梱や署名はできません。
配布したり自分以外も使う場合はPackagesがいいですが、自分専用や個人でのお試しレベルであればSnippetsで十分です。
まずはSnippetsで作って、配布したくなったらPackagesにする流れが良さそうです。
Snippetsで自作する
SnippetsはYAML形式のテキストを書くだけで作れます(JavaScriptで書く方法もありますが、その方法は後述します)。
最小のサンプルは下記の通りです。
#popclip
name: Urban Dictionary
icon: UD
url: https://www.urbandictionary.com/define.php?term=***1行目の#popclipが目印で、この形式のテキストを丸ごと選択すると、PopClipが自動的に検知して「Install Extension」のアクションを表示してくれます。***には、選択したテキストの前後の空白を取り除き、URLエンコードした値が入ります。
検索先のURLを差し替えれば、好きなサイトの検索用アクションが作れます。
そしてテキストを選択するだけで、PopClip上にインストールボタンが表示されます。

わざわざファイルを作らなくてもテキストを選択するだけで拡張機能をインストールできるという方法は、PopClipらしい仕組みで面白いです。
なお、テキスト選択からインストールできるのは5,000文字までです。
それ以上に長い場合やファイルとして保存したい場合は、.popcliptxt拡張子で保存することで、ファイルをダブルクリックでインストールできるようになります。
.yaml・.js・.tsで保存した場合は、Finderの[このアプリケーションで開く]→[PopClip]を選ぶか、PopClipのメニューバーアイコンへドラッグします。
なお、YAMLのインデントにはタブではなく半角スペースを使う必要があるので注意が必要です。
アイコンを指定する
iconで指定できる代表的な形式は、下記の通りです(アイコンの公式仕様)。
| 書き方 | 例 | 内容 |
|---|---|---|
| テキスト | icon: square filled AB | 最大3文字を使ったアイコンを生成する |
| SF Symbols | icon: symbol:globe | macOS標準のSF Symbolsから指定する |
| Iconify | icon: iconify:simple-icons:notion | Iconifyのアイコンライブラリから指定する |
テキストアイコンはsquare(四角)やcircle(丸)といった図形の指定に、filled(塗りつぶし)を組み合わせて書きます。icon: UDのように文字だけを書くこともできます。
バーに同じような四角が並ぶと押し間違えるので、サービスのロゴがIconifyにあるならそれを指定しておくのが分かりやすいです。
アクションの種類
指定できるアクションには、下記の6種類があります。
| 種類 | 設定キー | 内容 |
|---|---|---|
| URL | url | URLを開く |
| キー入力 | keyCombo | ショートカットキーを送る |
| サービス | serviceName | macOSのサービスを呼び出す |
| ショートカット | shortcutName | ショートカット.appのショートカットを実行する |
| AppleScript | appleScript | AppleScriptを実行する |
| シェルスクリプト | shellScript | シェルスクリプトを実行する |
文字列の加工や条件分岐が必要になったら、JavaScriptやシェルスクリプトを使います。
キー入力を送る
アプリのショートカットキーを押すだけのアクションはkeyComboで書けます。
#popclip
name: Bold
icon: B
keyCombo: command b
keyComboTarget: app
stayVisible: truecommand bのように、修飾キーと通常のキーを半角スペースで区切って書きます。
修飾キーはcommand・option・control・shiftが使え、cmdやoptのような省略形も通ります。
また、stayVisible: trueを付けると、クリックしてもPopClipバーが消えません。
太字と斜体を続けて当てたいときなど、連続で押したいアクションに向いています。
シェルスクリプトを実行する
シェルスクリプトを実行する場合、選択したテキストは環境変数POPCLIP_TEXTから受け取ります。
#popclip
name: Character Count
icon: symbol:textformat.123
after: show-result
interpreter: /bin/zsh
shellScript: printf '%s' "$POPCLIP_TEXT" | wc -m | tr -d ' 'POPCLIP_TEXT以外にも、ブラウザで開いているURLが入るPOPCLIP_BROWSER_URLなどが用意されています。
JavaScriptで書く
JavaScriptの場合は#popclipをコメントとして書き、その下に処理を続けます。
拡張子は.jsです。
// #popclip
// language: javascript
// name: Uppercase
// icon: square filled AB
popclip.pasteText(popclip.input.text.toUpperCase());選択したテキストはpopclip.input.textで取得でき、popclip.pasteText()で置換できます。
上記のサンプルは選択テキストを大文字に変換していますが、このレベルの処理なら簡単に作成できます。
ちなみに、あとで説明する公式ディレクトリへの公開ではJavaScriptが推奨されています。
複数のアクションを設定する
1つの拡張機能に複数のアクションを持たせる場合はactionsに並べます。
#popclip
name: 検索
actions:
- title: Google
icon: iconify:simple-icons:google
url: https://www.google.com/search?q=***
- title: MDN
icon: iconify:simple-icons:mdnwebdocs
url: https://developer.mozilla.org/ja/search?q=***titleはアイコンが無いときにボタンへ表示され、アイコンがある場合はツールチップに表示されます。
よく使う検索先を、1つの拡張機能としてまとめて管理なんてことができます。
表示条件を絞る
拡張機能を増やしていくと、バーが横に長くなって目的のアクションを探すのに時間がかかるようになってしまいます。
そこで便利な設定が「requirements」です。
選択した内容が条件に合うときだけアクションを表示する指定で、主な値は下記の通りです。
| 値 | 条件 |
|---|---|
text | 文字が選択されている |
url | 選択範囲にURLが1つだけ含まれている |
isurl | 選択範囲がURLそのもの |
email | メールアドレスが1つだけ含まれている |
path | 存在するローカルのファイルパスである |
paste | ペーストできる状態である |
formatting | 書式変更に対応する状況である |
値の先頭に!を付けると条件を反転することもできます。
さらに、細かく絞りたい場合はregexで正規表現の指定も可能です。
「requirements」で絞ったあとに正規表現がかけられて、マッチした部分だけがアクションに渡ります。
例えば、選択した文字列がチケット番号のときだけ管理ツールを開く、といった書き方ができます。
#popclip
name: Issue
icon: symbol:number
regex: "^[A-Z]+-[0-9]+$"
url: https://example.com/browse/***上記のサンプルでは選択テキストがABC-123のような形式に一致したときだけ表示されます。
他にも、特定のアプリでだけ表示したい場合はrequiredAppsにバンドルIDを指定します。
実行後の動作を決める
afterを指定すると、アクションの実行結果をどう扱うかを決められます。
| 値 | 動作 |
|---|---|
paste-result | 結果を選択範囲にペーストする |
copy-result | 結果をクリップボードにコピーする |
show-result | 結果をその場に表示する |
preview-result | 結果をプレビュー表示する |
show-status | 成功・失敗のマークだけ表示する |
copy | 選択範囲をコピーする |
対になるbeforeもあって、アクションの実行前にcopyやcutを挟めます。
シェルスクリプトの標準出力を選択範囲に戻す場合は、after: paste-resultを指定します。
URLを開くだけのアクションなど、テキストの結果を返さない処理には使えません。
Packagesにする
アイコン画像や別ファイルを同梱したい場合、または公式ディレクトリへ公開したい場合は、Packages(パッケージ形式)にします。
Packagesと言っても、.popclipextで終わる名前のフォルダを作ってその中に設定ファイルを置くだけです。
MyExtension.popclipext/
├── Config.yaml
├── icon.png
└── readme.md今回の例では設定ファイルにConfig.yamlを使っていますが、他にJSONやplist、JavaScriptなどでも記述できます。
中身に書く内容はSnippetsと同じですが、公開する場合はname・identifier・description・popclip versionの4つが必須になります。
name: My Extension
identifier: com.example.myextension
popclip version: 6221
description: 選択したテキストを社内ツールで開きます。
icon: icon.png
url: https://example.com/search?q=***identifierは拡張機能を識別する値なので、一意の名前を決めて、更新時も同じ値を使います。popclip versionは必要なPopClipの最低バージョンのビルド番号で、上記サンプルでは2026.8.1(6221)以降を対象にしています。
icon.pngも実際の画像を用意します。
画像を使わない場合はicon: square filled ABのようなテキストアイコンに変更し、画像ファイルを省けます。
パッケージ化したら、フォルダをダブルクリックするとインストールされます。
なお、配布用にはフォルダをzipで圧縮して、拡張子を.popclipextzに変えたものを渡します。
自作した拡張機能を公開する方法
自分で使うだけなら前述のファイルだけで事足りますが、公式のディレクトリに載せることもできます。
ディレクトリに掲載された拡張機能はサーバー側で署名されるので、インストール時に警告が出なくなりますし、更新も自動で配信されます。
提出の準備
公式の提出手順に沿って、公開したGitHubリポジトリを登録します。
2026年8月に新しい方式へ切り替わったようで、以前より手順が整理されました。
流れは下記の通りです。
- 拡張機能を
.popclipextパッケージとしてGitHubの公開リポジトリに置く - リポジトリのルートに
popclip-directory.yamlを作る - PopClip Directoryのアプリを対象のリポジトリにインストールする
- バージョンのタグを付けてプッシュする
popclip-directory.yamlには、どのフォルダを拡張機能として扱うかを書きます。
include: "source/*.popclipext"
versionPrefix: vこの設定例では、パッケージをリポジトリ内のsource/フォルダに置きます。
ソースと設定ファイルをコミットしてGitHubへプッシュしたら、提出するコミットにバージョンのタグを付けて送ります。
git tag v1.0.0
git push origin v1.0.0タグをプッシュすると自動チェックが始まり、結果をGitHubで確認できます。
サイズ制限は1つの拡張機能につきファイル数は100個まで、1ファイル1MiBまで、全体で2MiBまでです。
そしてreadme.mdを置くと、拡張機能のページに表示されます。
デモ動画(demo.mp4)を置くこともできて、こちらは目立つ位置に表示されます。
自動チェックを通ると手動レビューへ進みます。
それも承認されると、専用のページと署名済みの.popclipextzのダウンロードが用意されて公開されます。
シェルスクリプトは理由が必要
ひとつ注意したいのが、ディレクトリではJavaScriptで書くことが強く推奨されている点です。
シェルスクリプトを使う拡張機能を提出する場合は、shellScriptRationaleに「なぜJavaScriptでは実現できないのか」を書く必要があります。
理由は20文字以上が必要で、項目が無い場合は自動チェックを通りません。
公開を考えている場合は、JavaScriptで実現できる処理かを先に確認しておくと作り直しを減らせます。
まとめ
PopClipの拡張機能の自作は、想像していたよりずっと手前から始められました。
特に公開予定もなく、とりあえず自分で使う用のものであれば、YAMLを4行書いてそれを選択するだけで追加できます。
何よりテキストを選択するだけでインストール表示が出てくるのは、PopClipらしくて非常に面白いです。
まずは自分で試してみて、便利そうであれば公式ディレクトリへの申請も考えてみてはいかがでしょうか。

Macの音量や輝度を「細かく調節」したり「音量を確認しながら調節」する方法
Keyboard Maestroを使ってGyazoアプリをショートカットキーで起動する方法
MacのターミナルアプリはiTerm2で決まり!!オススメの設定と基本的な機能まとめ
ツイエバを使ってTwitterのいいねやツイート履歴をEvernoteに保存する方法
Macのアプリケーションやウインドウの切り替えまとめ
2019年2月時点でのMacアプリのダークモード対応状況
ATOKで登録した単語の品詞を、あとから一括で変更する方法
Haptic Touch Barでタッチバーを押した時のフィードバックを追加する
MacでYouTubeの動画再生速度を4倍速にする方法
Alfred 4のスニペットで使えるプレースホルダー機能
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
Visual Studio Codeで複数ファイルを編集するときにタブやペインの操作方法
Ulyssesの外部フォルダ機能を使って、原稿をGit管理しながらUlyssesで編集する方法
単語登録はルールをキッチリ決めるよりも、とにかく登録・改善を繰り返した方が良さそう
Visual Studio CodeでIllustratorのスクリプトを書く時に便利な拡張機能「ExtendScript Debugger」
Visual Studio Codeでコメントを色分けして管理する「Better Comments」
時間に合わせてディスプレイの色温度を調節してくれるアプリ「f.lux」の導入方法
作業効率化に大きく貢献してくれているMacのアプリ達
HTTP通信をラクに実装できる「axios」の基本