diff options
Diffstat (limited to 'files/fr/mozilla/add-ons/webextensions/user_interface/notifications')
-rw-r--r-- | files/fr/mozilla/add-ons/webextensions/user_interface/notifications/index.md | 45 |
1 files changed, 25 insertions, 20 deletions
diff --git a/files/fr/mozilla/add-ons/webextensions/user_interface/notifications/index.md b/files/fr/mozilla/add-ons/webextensions/user_interface/notifications/index.md index e0106d3b7d..60c1fe4ab4 100644 --- a/files/fr/mozilla/add-ons/webextensions/user_interface/notifications/index.md +++ b/files/fr/mozilla/add-ons/webextensions/user_interface/notifications/index.md @@ -5,46 +5,51 @@ tags: - WebExtensions translation_of: Mozilla/Add-ons/WebExtensions/user_interface/Notifications --- -<div>{{AddonSidebar}}</div> +{{AddonSidebar}} -<p>Les notifications vous permettent d'afficher des informations sur votre extension ou son contenu en utilisant le système d'exploitation sous-jacent.</p> +Les notifications vous permettent d'afficher des informations sur votre extension ou son contenu en utilisant le système d'exploitation sous-jacent. + +![](notify-shadowed.png) -<p><img alt="" src="notify-shadowed.png"></p> Les notifications peuvent inclure un appel d'action pour l'utilisateur, et votre extension peut écouter l'utilisateur en cliquant sur la notification ou la fermeture de la notification. -<h2 id="Spécification_des_notifications">Spécification des notifications</h2> +## Spécification des notifications -<p>Vous gérez les notifications en programmant, en utilisant l'API {{WebExtAPIRef("notifications")}}. Pour utiliser cette API, vous devez demander la permission de notification dans votre manifest.json :</p> +Vous gérez les notifications en programmant, en utilisant l'API {{WebExtAPIRef("notifications")}}. Pour utiliser cette API, vous devez demander la permission de notification dans votre manifest.json : -<pre class="brush: json">"permissions": ["notifications"]</pre> +```json +"permissions": ["notifications"] +``` -<p>Vous utilisez ensuite {{WebExtAPIRef("notifications.create")}} pour créer vos notifications, comme dans cet exemple de <a href="https://github.com/mdn/webextensions-examples/tree/master/notify-link-clicks-i18n">notify-link-clicks-i18n</a> :</p> +Vous utilisez ensuite {{WebExtAPIRef("notifications.create")}} pour créer vos notifications, comme dans cet exemple de [notify-link-clicks-i18n](https://github.com/mdn/webextensions-examples/tree/master/notify-link-clicks-i18n) : -<pre class="brush: js">var title = browser.i18n.getMessage("notificationTitle"); +```js +var title = browser.i18n.getMessage("notificationTitle"); var content = browser.i18n.getMessage("notificationContent", message.url); browser.notifications.create({ "type": "basic", "iconUrl": browser.extension.getURL("icons/link-48.png"), "title": title, "message": content -});</pre> +}); +``` -<p>Ce code crée une notification avec un icône, un titre et un message.</p> +Ce code crée une notification avec un icône, un titre et un message. -<p>Si la notification inclut un appel à l'action, vous pouvez écouter l'utilisateur en cliquant sur la notification pour appeler la fonction pour gérer l'action:</p> +Si la notification inclut un appel à l'action, vous pouvez écouter l'utilisateur en cliquant sur la notification pour appeler la fonction pour gérer l'action: -<pre class="brush: js">browser.notifications.onClicked.addListener(handleClick);</pre> +```js +browser.notifications.onClicked.addListener(handleClick); +``` -<p>Si vous émettez des appels à l'action par le biais de notifications, vous souhaitez également définir l'ID de notification facultatif, afin de déterminer quel appel à l'action a sélectionné.</p> +Si vous émettez des appels à l'action par le biais de notifications, vous souhaitez également définir l'ID de notification facultatif, afin de déterminer quel appel à l'action a sélectionné. -<h2 id="Icônes">Icônes</h2> +## Icônes -<p>Pour plus d'informations sur la création d'icônes à utiliser avec votre notification, reportez-vous à la section <a href="https://design.firefox.com/photon/visuals/iconography.html">Iconography</a> dans la documentation <a href="https://design.firefox.com/photon/index.html">Photon Design System</a>.</p> +Pour plus d'informations sur la création d'icônes à utiliser avec votre notification, reportez-vous à la section [Iconography](https://design.firefox.com/photon/visuals/iconography.html) dans la documentation [Photon Design System](https://design.firefox.com/photon/index.html). -<h2 id="Exemples">Exemples</h2> +## Exemples -<p>Le dépôt <a href="https://github.com/mdn/webextensions-examples">webextensions-examples</a> sur GitHub contient plusieurs exemples de WebExtensions qui utilise la création de notifications :</p> +Le dépôt [webextensions-examples](https://github.com/mdn/webextensions-examples) sur GitHub contient plusieurs exemples de WebExtensions qui utilise la création de notifications : -<ul> - <li><a href="https://github.com/mdn/webextensions-examples/tree/master/notify-link-clicks-i18n">notify-link-clicks-i18n</a> utilise la création de notifications.</li> -</ul>
\ No newline at end of file +- [notify-link-clicks-i18n](https://github.com/mdn/webextensions-examples/tree/master/notify-link-clicks-i18n) utilise la création de notifications. |