ブックマークレットとは
ブックマークレット(Bookmarklet)とはブラウザの「ブックマーク」として保存されるJavaScriptのプログラムです。
通常、ブラウザのブックマークにはウェブページのURLが保存されます。
例えばこの記事をブックマークするとURLである「https://bibouroku.net/bookmarklet」が保存されるわけです。
ブックマークレットはそのようなURLの代わりに「javascript:」で始めるJavaScriptを保存します。
ブラウザでブックマークレットを選択するとJavaScriptが実行されるわけです。
つまり、ブックマークレットによってブラウザの機能を拡張できます。
パソコンのChrome拡張機能でも同様のことはできますが、ブックマークレットには以下のメリットがあります。
- ほとんどのブラウザで使える
- 簡単に作成できる
ほとんどのブラウザで使える
Chrome拡張機能が使えるのはパソコンのChromeとEdgeだけです。
iPhoneやAndroidのブラウザでは使えません。
それに対してブックマークレットならほとんどのブラウザで使えます。
iPhoneでもAndroidでもFirefoxでもです。
簡単に作成できる
Chrome拡張機能を作成するのはいろいろと面倒なのですが、ブックマーク拡張ならテキストエディタと変換ツール(詳細は後述)だけで手軽に作成できます。
テキストエディアで作るのは辞めた
プログラマーであればブックマークレットは簡単に作れるため、いろいろなブックマークレットを量産してしまいがちです。
過去に似たようなブックマークを作った記憶があっても探すのが面倒なのでまたイチから作るなんてのも日常茶飯事でした。
しかし、いくら簡単とはいっても塵も積もれば山となるでそれでは時間の無駄です。
そのため、ブックマークレットをテキストエディタで書き始めることは辞め、Hatena:Letで作ることにしました。
Hatena:Letとはブックマークレットを作成・公開できるサービスです。
公開しないプライベートなブックマークレットも作成できます。
かなり昔からあるサービスでリリースされたのはなんと2010年のようです。
利用にははてなIDが必要です。
コーディングとデバッグ
Hatena::Letのホームページの「作成する」をクリックします。
ブックマークレットのエディタ画面になります。あらかじめHatena::Let向けのコメントが記載されており、コメント中に「@private」を追記(下図)するとブックマークレットが非公開になります。
エディタ下部の「Debuglet」をブラウザのツールバーにドラッグ&ドロップで登録すると編集中のブックマークレットを実行できます。
わざわざブックマークレットとして保存する必要がないのでサクサクとデバッグできます。
変換
作成したブックマークレットは https://let.hatelabo.jp/はてなID/ に保存されます。
すべてのブックマークレットをここに保存しておけば、量産したブックマークレットが見つからなくなることはありません。
ここのブックマークレットをブラウザのブックマークとして保存する時は「Packed」をクリックして変換します。
ブックマークレット用の変換ツールや変換サービスは山程あるのですが、ツールやサービスによって微妙に変換内容が違います。
ブックマークレットを作成するたびに適当にググってヒットした変換サービスを使うより、常にHatena::Letで変換する方が効率的です。
コメント