diff options
Diffstat (limited to 'files/fr/mozilla/add-ons/webextensions/browser_actions')
| -rw-r--r-- | files/fr/mozilla/add-ons/webextensions/browser_actions/index.html | 46 |
1 files changed, 46 insertions, 0 deletions
diff --git a/files/fr/mozilla/add-ons/webextensions/browser_actions/index.html b/files/fr/mozilla/add-ons/webextensions/browser_actions/index.html new file mode 100644 index 0000000000..754cbc8cf5 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/browser_actions/index.html @@ -0,0 +1,46 @@ +--- +title: Actions du navigateur +slug: Mozilla/Add-ons/WebExtensions/Browser_actions +tags: + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/Browser_actions +--- +<div>{{AddonSidebar}}</div> + +<p>Une action du navigateur est un bouton que vous pouvez ajouter à la barre d'outils du navigateur. Les utilisateurs peuvent cliquer sur le bouton pour interagir avec votre extension.</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/12966/browser-action.png" style="display: block; height: 387px; margin-left: auto; margin-right: auto; width: 782px;"></p> + +<p>Il existe deux façons de spécifier une action du navigateur : avec une <a href="/fr/Add-ons/WebExtensions/Popups">fenêtre contextuelle</a>, ou sans fenêtre contextuelle.</p> + +<p>Si vous ne spécifiez pas de popup, alors lorsque l'utilisateur clique sur le bouton, un événement est envoyé à l'extension, que vous pouvez écouter à l'aide de <a href="/fr/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"><code class="language-js">browser<span class="punctuation token">.</span>browserAction<span class="punctuation token">.</span>onClicked<span class="punctuation token">.</span><span class="function token">addListener</span><span class="punctuation token">(</span>handleClick<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> + +<p>Si vous spécifiez un popup, l'événement click n'est pas distribué : au lieu de cela, le popup sera affiché lorsque l'utilisateur clique sur le bouton. L'utilisateur pourra interagir avec le popup et il se fermera automatiquement lorsque l'utilisateur clique à l'extérieur.</p> + +<p>Notez que votre extension ne peut avoir qu'une seule action du navigateur.</p> + +<h2 id="Specification_de_l'action_de_navigateur">Specification de l'action de navigateur</h2> + +<p>Vous définissez les propriétés de l'action du navigateur - icône, titre, popup - en utilisant la clé <code><a href="/fr/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a></code> dans manifest.json:</p> + +<pre class="brush: json line-numbers language-json"><code class="language-json"><span class="key token">"browser_action":</span> <span class="punctuation token">{</span> + <span class="key token">"default_icon":</span> <span class="punctuation token">{</span> + <span class="key token">"19":</span> <span class="string token">"button/geo-19.png"</span><span class="punctuation token">,</span> + <span class="key token">"38":</span> <span class="string token">"button/geo-38.png"</span> + <span class="punctuation token">}</span><span class="punctuation token">,</span> + <span class="key token">"default_title":</span> <span class="string token">"Whereami?"</span><span class="punctuation token">,</span> + <span class="key token">"default_popup":</span> <span class="string token">"popup/geo.html"</span> +<span class="punctuation token">}</span></code></pre> + +<p>La seule clé obligatoire est <code>default_icon</code>. Vous pouvez changer n'importe laquelle de ces propriétés par programme à l'aide de l'API <code><a href="/fr/Add-ons/WebExtensions/API/browserAction">browserAction</a></code> .</p> + +<h2 id="Exemples">Exemples</h2> + +<p>Le repo <a href="https://github.com/mdn/webextensions-examples">webextensions-examples</a> sur GitHub contient plusieurs exemples d'extensions qui utilisent les actions du navigateur :</p> + +<ul> + <li><a href="https://github.com/mdn/webextensions-examples/blob/master/bookmark-it/">bookmark-it</a> utilise une action de navigateur sans popup</li> + <li><a href="https://github.com/mdn/webextensions-examples/tree/master/beastify">beastify</a> utilise une action de navigateur avec une fenêtre popup</li> +</ul> |