Bookmarklet（ブックマークレット）とは？ 作り方と使い方
Bookmarklet（ブックマークレット）って何？
そんなときに活躍してくれるのが Bookmarklet（ブックマークレット） です。
ブラウザの「お気に入り（ブックマーク）」に登録して使う、インストール不要のミニツールのようなものです。
実体は「ブックマークに保存されたJavaScript」で、クリックするだけでその場で処理を実行できます。
『インストール不要』『無料』『すぐ使える』という手軽さが魅力です。
たとえば「ページの表示を整える」「必要な情報だけ抜き出す」など、
ちょっと面倒な作業をワンクリックで実行できるようにしてくれます。
この記事では、そんなブックマークレットの『作り方』と『使い方』を解説しますね。
ブックマークレット（Bookmarklet）の作り方（登録方法）
ブックマークレットの作り方は、大きく分けて2つあります。
【推奨】登録するブラウザの『ブックマークバー』を表示する。
作成時は、ブックマークバー（お気に入り）を表示しておくと、作業しやすいです。
また当記事は、ブックマークバーを表示していることを前提で説明します。
Chromeの場合は、右上『…(縦)』➔『☆ ブックマークとリスト』➔『ブックマーク バーを表示』をクリックします。
これでブックマークバーがブラウザの上部にでるようになります。
他にも
『Brave』なら、右上『≡』➔『ブックマークとリスト』➔『ブックマークバーを表示』
『Firefox』なら、右上『≡』➔『ブックマーク』➔『ブックマークツールバーを表示』
など、どのブラウザでも、それっぽいの書いてあるので、お試しください。
常に表示していた方が使いやすくはありますが、していなくとも使えます。
ブックマークレットを作り終えた後はまた隠してしまっても問題ありません。
超カンタン版：ブックマークレット作り方
これは用意されているときだけ使える方法です。
このようにコードが書かれているリンク・ボタン⇩があります。
サイト名をアラート
これを掴みます（左クリックしたまま離さない状態）。
ここには置けないという意味の🚫状態になっていたら掴めてます。
そのままブックマークバー（お気に入りバー）に持っていき、ちょうどいい場所で離します。
これだけでブックマークレット完成です！
試しに、作ったブックマークレットを押してみてください。
サイト名が、アラートで出てきます。
通常版：ブックマークレット作り方
今回は『Chrome』で説明します。
Firefox、Opera、Safariも、ほぼ同じです。
1️⃣いつも通りブックマーク（お気に入り）を作成する
今見ているページなどで、URL入力する場所にある『☆』を押してブックマークを作成します。
2️⃣ブックマークレット用コードを入手
ブックマークレット用コードをお持ちの方は、コピーをしてください。
お持ちでない場合、⇩こちらのサンプルコードをコピーしてください。
javascript:(function(){
alert(document.title);
})();
3️⃣ブックマークの編集
ブックマークバーにある『1️⃣にてたった今、作成したブックマーク』を右クリックして『編集…』を押します。
『URL』に、先程2️⃣でコピーした、ブックマークレット用コードを貼り付けます。
ついでに『名前』をわかりやすい名前に変更すると、あとで使いやすいです。
『保存』ボタンを押して、ブックマークレット完成です。
ブックマークレットの使い方
先ほど作成した『ブックマークレット』を
普通にブックマークを使うように、ポチッと押してみてください。
これだけで、プログラムが動きます。
先程のサンプルコードの場合、サイトのタイトルがアラートされます。
色々なページで試してみてくださいね。
動作環境
- PCのブラウザでの利用を推奨します。
- JavaScriptが無効な環境では動作しません
- スマートフォンでは、ブックマークレットの実行に制限があるため、正常に動作しない場合があります（PC・タブレット推奨）
- Safariではセキュリティ設定によっては動作しないことがあります
- サイトの構造（DOM）によっては、正しく動作しない場合があります
よくある疑問への回答
質問受付中です。いただき次第、ここの項目に追加します。
Q. ブックマークレットは無料で使える？
ブックマークレットという機能は、無料で使えます。
通常は通信を必要としないので、基本的には他のサイトに会員登録が必要になることもありません。
ブラウザのお気に入りに入れるだけです。
Q. ブックマークレット用コードは複数行だけど、URL欄にそのまま貼ってもいいの？
そのまま貼って、問題ありません。
ブラウザがうまいこと処理してくれるので、ちゃんと動きます。
Q. スマホでは動かないの？
iPhone/iPadならば、使える場合があります。
昔は動くものもあったそうですが、今のAndroidスマートフォンでは、動かないと見てよいです。
コメント