Google Chromeをメインのブラウザとして使っているなら、拡張機能をインストールしてカスタマイズしていることと思います。ただ、特定のページのDOM要素を取得して、ごにょごにょ加工してから利用するようなマニアックなものとなると、自分で作るしかありません。
Chromeの拡張機能はJavaScriptとjsonで記述されており、プログラミングの経験があれば誰でも作成することができます。これにHTMLとCSSを組み合わせて使い勝手を向上させるわけです。
さて、拡張機能を作成したらどこに保存し、どのようにインストールしたらよいのでしょうか。
Googleストアに公開する
Googleストアに登録して作成した拡張機能を世界に向けて発信すれば、普段使っている拡張機能と同じようにインストールできます。
こちらのリンクからどうぞ。
Publish in the Chrome Web Store – Google Chrome
登録料として5ドルが必要になります。今ですと545円91銭ぐらいですね。
ローカル環境に保存した拡張機能をインストールする
無料がいいですよね。作成した拡張機能を好きな場所に保存しておいてください。
Chromeの右上のメニューから「その他のツール」→「拡張機能」を選択してください。
新しいタブで「拡張機能」が表示されます。
画面の上のほうに「デベロッパーモード」とあるので、これにチェックを入れます。
するとニョキっとボタンが表示されるはずです。
「パッケージ化されていない拡張機能を読み込む」ボタンを押すと「フォルダーの参照」ダイアログが表示されるので、作成した拡張機能を保存したフォルダを選択します。
記述したソースコードに問題がなければ、インストールした拡張機能に関する情報が表示されるはずです。
動作確認をしてソースコードを修正した場合、「リロード」をクリックしてChromeに再度読み込ませてあげてください。
拡張機能がうまく動作しない場合には
ソースコードを修正してどこにも問題がないのに、拡張機能がうまく動作しないときがあります。そのような場合には、対象となるウェブページを更新してみてください。
特定のページで動作する拡張機能を作ってるときによくやらかします。Chromeで表示されているウェブページはそれぞれのContents Scriptに紐付けされていますが、ページを更新しないとこれが古いままなのですね。
「プログラムを修正したのに動かないぞ？！」となったときに確認するようにしてください。
Comment