--- title: ツールバーボタン slug: Mozilla/Add-ons/WebExtensions/user_interface/Browser_action tags: - WebExtension translation_of: Mozilla/Add-ons/WebExtensions/user_interface/Browser_action ---
{{AddonSidebar}}

よくブラウザーアクションとして参照され、 このユーザーインターフェイスオプションはブラウザーのツールバーに追加されるボタンです。 ユーザーはボタンをクリックして拡張機能とやりとりします。

ツールバーボタン (ブラウザーアクション) はアドレスバーボタン (ページアクション)とよく似ています。違いといつ使うかについてのガイダンスは、ページアクションとブラウザーアクションを見てください。

ブラウザーアクションを指定する

ブラウザーアクションのプロパティは manifest.json の browser_action キーで定義します。

"browser_action": {
  "default_icon": {
    "19": "button/geo-19.png",
    "38": "button/geo-38.png"
  },
  "default_title": "Whereami?"
}

唯一不可欠なキーは default_icon です。

ブラウザーアクションの指定には 2 つの方法があります: ポップアップがつくのとつかないのです。 ポップアップを指定しないと、ユーザーがボタンをクリックした時に、拡張機能にイベントがディスパッチされ、これを拡張機能が browserAction.onClicked を使ってリッスンします:

browser.browserAction.onClicked.addListener(handleClick);

ポップアップを指定すると、クリックイベントはディスパッチされません: その代わりに、ユーザーがボタンをクリックした時にポップアップが表示されます。ユーザーはポップアップとやりとりできて、ユーザーが範囲外をクリックした時に自動的にポップアップが閉じます。ポップアップを作成、管理することの詳細はポップアップの記事を見てください。

拡張機能は 1 つだけのブラウザーアクションを持つ必要があります。

なお、上に示されている任意のプロパティは browserAction API を使ったコードからも変更できます。

アイコン

ブラウザーアクションのアイコンを作る詳細は、Photon Design System 文書の Iconography を見てください。

例

Github の webextensions-examples リポジトリには、ブラウザーアクションを使う拡張機能の例がいくつかあります。