More than 3 years have passed since last update.

つくってみよう - FireFox拡張機能でブックマークを一覧表示する（２）動作を確認する

Last updated at 2021-01-04Posted at 2020-12-02

つくってみよう - FireFox拡張機能でブックマークを一覧表示する記事一覧

つくってみよう - FireFox拡張機能でブックマークを一覧表示する（１）公式サンプルを体験する
 つくってみよう - FireFox拡張機能でブックマークを一覧表示する（２）動作を確認する
[つくってみよう - FireFox拡張機能でブックマークを一覧表示する（３）ソースコードを読む - 構成について]
(https://qiita.com/madaaamj/items/bef7102722da2f249515)
[つくってみよう - FireFox拡張機能でブックマークを一覧表示する（４）ソースコードを読む - 画面について]
(https://qiita.com/madaaamj/items/27dd820d10fd20c51dee)
[つくってみよう - FireFox拡張機能でブックマークを一覧表示する（５）ソースコードを読む - 処理の概要について]
(https://qiita.com/madaaamj/items/af88405b30820b19a114)
[つくってみよう - FireFox拡張機能でブックマークを一覧表示する（６）ソースコードを読む - JSON情報の取得について]
(https://qiita.com/madaaamj/items/d9e7b1c296221218d46a)
[つくってみよう - FireFox拡張機能でブックマークを一覧表示する（７）ソースコードを読む - 表示について①]
(https://qiita.com/madaaamj/items/68888b5d0fdb8f2af84f)
[つくってみよう - FireFox拡張機能でブックマークを一覧表示する（８）ソースコードを読む - 表示について②]
(https://qiita.com/madaaamj/items/a7e3f764f8177139bf7d)

さっそくはじめましょう

「FireFox拡張機能でブックマークを一覧表示する」機能をつくっていきましょう。
今回からは自作のブックマーク拡張機能「ExBmSearch」を使って解説していきます。

まずはインストールして動作を確認していきます。

ダウンロード

GitHibから「ex_bm_search」を選択してダウンロードします。
「ex_bm_search」フォルダーを任意の場所（どこでもＯＫ）に配置します。

インストール

FireFoxに拡張機能を追加します。
今回は「"一時的なアドオンを読み込む" 」でインストールします。
（注意：「"一時的なアドオンを読み込む" 」でインストールしてFireFoxを再起動すると当拡張機能は無効になります。必要な場合は再度「"一時的なアドオンを読み込む" 」でインストールしてください。）

Firefox の場合: about:debugging ページを開いて、"この Firefox" (Firefox の新しいバージョンで)をクリックし、"一時的なアドオンを読み込む" をクリックし、アドオンのディレクトリーにあるファイルをどれか 1 つ選択します。

選択するファイルは「manifest.json」です。

インストールが完了すると以下のように表示されます。

メニューバーに拡張機能のアイコンが表示されます。

拡張機能を使う

拡張機能のアイコンをクリックすると新しいタブが開きます。
[ブックマークファイル選択]をクリックすると[参照…]ボタンが表示されます。

[参照…]ボタンをクリックしてブックマークファイルを選択します。
あらかじめ自分の環境のブックマークファイルが用意してあればそちらを選択します。なければダウンロードしたファイルの中に「bookmarks-sample.json」というファイルがあるのでそちらを選択します。

ブックマークの一覧が表示されます。

機能の説明

ボタンによるブックマークへのジャンプ

表示される青いボタンをクリックすると該当するブックマークリストまでジャンプします。
青枠はブックマークフォルダー名、青塗りつぶしはタグ名です。タグはブックマークに紐づけて登録できます。

「自然言語処理」フォルダーを選択した場合

「Basic認証」タグを選択した場合

画面右下のボタンをクリックすると画面トップに戻ります。