ひとりぶろぐ

価値ある情報をユーザー視点で発信するブログ

MarsEditにキーボードショートカットで画像を挿入する方法の検討

      2014/02/18

ブログ書きの必需品MarsEdit

ひとりぶろぐのmoyashi (@hitoriblog) です。

ブログ書きにOS Xで動作するMarsEditを使っています。大変便利で、これが使えている限りは、これ無しでブログを書くことは無いでしょう。

MarsEdit – the blog editor for WordPress, Tumblr, Blogger and more. 3.6.2(¥4,000)App
カテゴリ: ソーシャルネットワーキング, 仕事効率化
販売元: Red Sweater Software – Red Sweater Software(サイズ: 7.9 MB)
全てのバージョンの評価: (10件の評価)

使っていると画像のドラッグ&ドロップが辛くなってくる

そんなMarsEditですが、書いているエントリに画像を挿入する手段がいまいち使いづらく、どうにかならないものかと思っていました。

ドラッグ&ドロップの案配で挿入位置が変わるため、正確に狙った位置にドロップしないといけません。それを間違うと、不本意な位置にタグが挿入されてしまい、ストレスフル。(MarsEditのMediaManagerから貼る方法がありますが)

URL Schemeで画像を挿入できるようにしてみた

そこで、プログラマブルに画像を挿入する手段を用意してみました。

僕が取った手法は、URL Scheme経由で画像を挿入するというもの。

エディタを開いた状態で以下のようなURLを開くと、MarsEditのカーソル位置に画像が挿入されるよう、ファイルアップロードダイアログ(Upload Utility)が開きます。

marsedit://insertImage=%2fUsers%2fhoge%2fDesktop%2fscreenshot%202013%2d06%2d12%2012%2e42%2e52%2epng

URLを開くためのコマンドとして「open」というものがあります。例えば、openコマンドに以下のURLを渡すと、MarsEditのファイルアップロードダイアログ(Upload Utility)が開きます。(続きは[Read More]から)

$ open marsedit://insertImage=%2fUsers%2fhoge%2fDesktop%2fscreenshot%202013%2d06%2d12%2012%2e42%2e52%2epng


画像挿入のためのURL

URLは、「marsedit://insertImage=」という前段の定型部分と、続く画像へのフルパスで構成されます。上記の例では、フルパスは以下のようなもの。

/Users/hoge/Desktop/screenshot 2013-06-12 12.42.52.png

これをUTF-8でURLエンコードして前段の定型部分にくっつけると、画像挿入のためのURLが出来上がります。

それって嬉しいの?

また小難しいことが始まった。いちいちターミナルを開いてopenコマンドで画像を挿入しなければならないんじゃ、ドラッグ&ドロップの方が3億倍楽だよね」という感想を持つかもしれませんが、これができるということは、openコマンドに限らず様々な手段で画像挿入が可能になることを意味しています。

具体的な活用例は後述します。

要するに、キーボード操作で画像の貼り込みをするための試行の一環というわけです。

MarsEditPatcherで実現

ただ、この機能は僕がMarsEditに勝手に付け加えたものなので、後述のMarsEditPatcherの導入が前提となります。

免責

MarsEditPatcherは無保証です。

MarsEditPatcherのダウンロード

履歴

  • 2014.02.18 Ver.1.3
    • Mac App Store版に対応
  • 2013.06.12 Ver.1.0
    • 初版

動作確認環境

  • MarsEdit Version 3.5.9
  • OS X 10.8.3

インストール方法

上記のリンクから MarsEditPatcher-x.x.zip をダウンロード、解凍し、MarsEditPatcher.bundleを得る。

以下のページ中段から EasySIMBL-1.4.zip をダウンロード。

norio-nomura/EasySIMBL | GitHub

解凍後、「/Applications」フォルダにEasySIMBL.appをコピー。

Skitched 20130612 125414

EasySIMBL.appを起動し、開いたウインドウにMarsEditPatcher.bundleをドラッグ&ドロップ。

Screenshot 2013 06 12 7 05 24

EasySIMBLのリストにMarsEditPatcherが追加されるので、冒頭のチェックボックスがオンになっていることを確認。

Screenshot 2013 06 12 7 05 29 1

EasySIMBLウインドウ上部の「Use SIMBL」のチェックをオン。EasySIMBLを終了します。終了後も、このチェックを外さない限りは効能が持続する作りです。

Screenshot 2013 06 12 7 05 56 1

MarsEditが起動中の場合は、一旦終了させ、再度起動します。MarsEditPatcherは、MarsEditの起動時のタイミングで読み込まれます。

既に元祖SIMBLをインストールしている場合のインストール手順

EasySIMBLでなく、元祖SIMBLをインストールしている場合は、FinderでCommand+Shift+Gとキーボードを押して「フォルダの場所を入力」ダイアログを表示させた後、「~/Library/Appication Support/SIMBL/Plugins」と入力し、移動ボタンを押す。

Skitched 20130612 124559

しかる後にMarsEditPatcher.bundleをその場所にコピー。

Screenshot 2013 06 12 12 42 52

MarsEditが起動中の場合は、一旦終了させ、再度起動します。MarsEditPatcherは、MarsEditの起動時のタイミングで読み込まれます。

やっておくと便利な設定 

Upload Utilityのボタンをキーボードで押すために「システム環境設定>キーボード>フルキーボードアクセス」を「すべてのコントロール」に設定します。

Skitched 20130612 071109

この設定にしておくと、Upload Utilityの「Upload With Post」、「Upload Now」ボタンをキーボードで押すことができるようになります。

具体的には、当該のボタンにフォーカスが当たるまでTabキーを押して、フォーカスが当たったらSpaceキーを押す、とします。Shift+Tabだと、フォーカスが逆順に当たっていきます。

Skitched 20130612 142604

活用例: Finderで選択中の画像を送る

Finderで選択中の画像を送る。というものをやってみたいと思います。書いたスクリプトが下掲のInsertImageToTheMarsEdit。

カーソルキー下を1回押してからファイルをMarsEditに送っているのがミソ。

これを繰り返し実行すると、複数あるファイル(画像)を順次MarsEditに貼り込めるわけです。

このスクリプトをキーボードから実行できるようにしたいと思います。

設定1: スクリプトをダウンロード

InsertImageToTheMarsEdit.scpt.zip

上記スクリプトをダウンロードして解凍してください。

設定2: 指定フォルダにコピー

MarsEditのメニュー「スクリプトアイコン>Open Script Folder」を実行。

Skitched 20130711 210648

「/Users/ユーザ名/Library/Application Support/MarsEdit/Scripts」が開かれるはずなので、解凍したスクリプトをコピー。

Skitched 20130711 211006

設定3: ユニバーサルアクセスを設定

AppleScriptの動作に必要なので、以下を設定。

「システム環境設定>ユニバーサルアクセス>補助装置にアクセスできるようにする」をオン。

Skitched 20130806 191043

設定3: キーボードショートカットを設定

  1. 「システム環境設定>キーボード」を開き、キーボードショートカットタブにある+ボタンを押下。
  2. 「アプリケーション:」はMarsEditを選択。
  3. 「メニュータイトル:」は「InsertImageToTheMarsEdit」に。
  4. 「キーボードショートカット:」は、Commandキーを伴わないものを指定。
  5. 「追加」ボタンを押下。

Screencapture

設定後、こうなればOK。

Skitched 20130711 212050

使い方

Finderで貼りたい画像の一つ手前のファイルにカーソルを合わせ、MarsEditに切り替えてからスクリプトを実行。

すると、いったんFinderが最前面に回り、一つ下にカーソルを動かした後、フォーカスの当たった画像をMarsEditに貼り込みます。

これを繰り返すと、キーボード操作だけで画像を次々と貼っていけます。

いろいろな活用

別にFinderとしか連携できないわけでなく、画像へのフルパスが取得できるアプリとなら連携ができます。

例えばiPhoto。上掲のスクリプトのiPhoto版が欲しいところですが、どなたか作ってみてください。

自分で作りました。

ひとりぶろぐ » iPhotoで選択中の画像をMarsEditにキーボードショートカット一発で貼り込む

 - AppleScript, OS X, WordPress, ブログ運営