blob: d3ae50e9d92fb216c6cc1be52369f2f9fb24777a (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
|
---
title: כפתור בסרגל הכלים
slug: Mozilla/Add-ons/WebExtensions/user_interface/Browser_action
tags:
- WebExtension
- הרחבת רשת
translation_of: Mozilla/Add-ons/WebExtensions/user_interface/Browser_action
---
<div>{{AddonSidebar}}</div>
<p>קרוי בשימוש נפוץ <a href="/he/docs/Mozilla/Add-ons/WebExtensions/API/browserAction">פכולת דפדפן</a>, אפשרות זו של ממשק המשתמש היא כפתור המתוסף לסרגל הכלים של הדפדפן. המשתמשים מקישים על הכפתור כדי לתקשר עם ההרחבה שלך.<br>
<img alt="" src="https://mdn.mozillademos.org/files/15751/browser-action.png" style="display: block; height: 182px; margin-left: auto; margin-right: auto; width: 350px;"></p>
<p>הכפתור בסרגל הכלים (פעולת דפדפן) דומה לכפתור של שur, הכתובת (פעולת דף). להבדלים ולהדרכה מתי להשתמש במה,ראו <a href="/en-US/Add-ons/WebExtensions/user_interface/Page_actions#Page_actions_and_browser_actions">Page actions and browser actions</a>.</p>
<h2 id="Specifying_the_browser_action">Specifying the browser action</h2>
<p>You define the browser action's properties using the <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a></code> key in manifest.json:</p>
<pre class="brush: json notranslate"><code class="language-json">"browser_action": {
"default_icon": {
"19": "button/geo-19.png",
"38": "button/geo-38.png"
},
"default_title": "Whereami?"
}</code></pre>
<p>The only mandatory key is <code>default_icon</code>.</p>
<p>There are two ways to specify a browser action: with or without a <a href="/en-US/Add-ons/WebExtensions/Popups">popup</a>. If you don't specify a popup, when the user clicks the button an event is dispatched to the extension, which the extension listens for using <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/BrowserAction/onClicked" title="Fired when a browser action icon is clicked. This event will not fire if the browser action has a popup."><code>browserAction.onClicked</code></a>:</p>
<pre class="brush: js line-numbers language-js notranslate"><code class="language-js">browser.browserAction.onClicked.addListener(<var>handleClick</var>);</code></pre>
<p>If you specify a popup, the click event is not dispatched: instead, the popup is shown when the user clicks the button. The user is able to interact with the popup and it closes automatically when the user clicks outside it. See the <a href="/en-US/Add-ons/WebExtensions/Popups">Popup</a> article for more details on creating and managing popups.</p>
<p>Note that your extension can have only one browser action.</p>
<p>You can change many of the browser action properties programmatically using the <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction">browserAction</a></code> API.</p>
<h2 id="Icons">Icons</h2>
<p>For details on how to create icons to use with your browser action, see <a href="https://design.firefox.com/photon/visuals/iconography.html">Iconography</a> in the <a class="grey-90 no-underline hover-no-underline" href="https://design.firefox.com/photon/index.html">Photon Design System</a> documentation.</p>
<h2 id="Examples">Examples</h2>
<p>The <code><a href="https://github.com/mdn/webextensions-examples">webextensions-examples</a></code> repository on GitHub contains two examples of extensions that implement browser actions:</p>
<ul>
<li><a href="https://github.com/mdn/webextensions-examples/blob/master/bookmark-it/">bookmark-it</a> uses a browser action without a popup</li>
<li><a href="https://github.com/mdn/webextensions-examples/tree/master/beastify">beastify</a> uses a browser action with a popup</li>
</ul>
|
