From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../manifest.json/arriere-plan/index.html | 93 ++ .../webextensions/manifest.json/auteur/index.html | 44 + .../manifest.json/browser_action/index.html | 254 ++++ .../browser_specific_settings/index.html | 117 ++ .../chrome_settings_overrides/index.html | 136 ++ .../manifest.json/chrome_url_overrides/index.html | 97 ++ .../manifest.json/commands/index.html | 200 +++ .../manifest.json/content_scripts/index.html | 235 ++++ .../content_security_policy/index.html | 117 ++ .../manifest.json/default_locale/index.html | 46 + .../manifest.json/description/index.html | 44 + .../manifest.json/developer/index.html | 52 + .../manifest.json/devtools_page/index.html | 50 + .../manifest.json/dictionaries/index.html | 47 + .../externally_connectable/index.html | 69 + .../manifest.json/homepage_url/index.html | 46 + .../webextensions/manifest.json/icons/index.html | 78 ++ .../manifest.json/incognito/index.html | 70 + .../add-ons/webextensions/manifest.json/index.html | 138 ++ .../manifest.json/manifest_version/index.html | 45 + .../webextensions/manifest.json/name/index.html | 46 + .../manifest.json/offline_enabled/index.html | 48 + .../webextensions/manifest.json/omnibox/index.html | 52 + .../manifest.json/optional_permissions/index.html | 106 ++ .../manifest.json/options_page/index.html | 62 + .../manifest.json/options_ui/index.html | 118 ++ .../manifest.json/page_action/index.html | 200 +++ .../manifest.json/permissions/index.html | 198 +++ .../manifest.json/protocol_handlers/index.html | 85 ++ .../manifest.json/short_name/index.html | 44 + .../manifest.json/sidebar_action/index.html | 151 +++ .../webextensions/manifest.json/storage/index.html | 69 + .../webextensions/manifest.json/theme/index.html | 1374 ++++++++++++++++++++ .../manifest.json/theme_experimentation/index.html | 194 +++ .../manifest.json/user_scripts/index.html | 48 + .../webextensions/manifest.json/version/index.html | 63 + .../manifest.json/version_name/index.html | 40 + .../web_accessible_resources/index.html | 98 ++ 38 files changed, 4974 insertions(+) create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/arriere-plan/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/auteur/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/browser_action/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/browser_specific_settings/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/chrome_settings_overrides/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/chrome_url_overrides/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/commands/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/content_scripts/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/content_security_policy/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/default_locale/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/description/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/developer/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/devtools_page/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/dictionaries/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/externally_connectable/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/homepage_url/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/icons/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/incognito/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/manifest_version/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/name/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/offline_enabled/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/omnibox/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/optional_permissions/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/options_page/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/options_ui/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/page_action/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/permissions/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/protocol_handlers/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/short_name/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/sidebar_action/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/storage/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/theme/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/theme_experimentation/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/user_scripts/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/version/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/version_name/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/manifest.json/web_accessible_resources/index.html (limited to 'files/fr/mozilla/add-ons/webextensions/manifest.json') diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/arriere-plan/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/arriere-plan/index.html new file mode 100644 index 0000000000..4181a9e841 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/arriere-plan/index.html @@ -0,0 +1,93 @@ +--- +title: background +slug: Mozilla/Add-ons/WebExtensions/manifest.json/arriere-plan +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/background +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObject
ObligatoireNo
Exemple + 
+"background": {
+  "scripts": ["background.js"]
+}
+
+ +

Utilisez la clé background pour inclure un ou plusieurs scripts d'arrière-plan, et éventuellement une page d'arrière-plan dans votre extension.

+ +

Les scripts d'arrière-plan sont l'endroit pour placer le code qui doit maintenir l'état à long terme, ou effectuer des opérations à long terme, indépendamment de la durée de vie de toutes les pages Web ou les fenêtres du navigateur.

+ +

Les scripts d'arrière-plan sont chargés dès que l'extension est chargée et restent chargés jusqu'à ce que l'extension soit désactivée ou désinstallée. Vous pouvez utiliser n'importe laquelle des WebExtension APIs dans le script, tant que vous avez demandé les permissions nécessaires.

+ +

Voir la section "Pages arrière-plan" dans l'anatomie d'une WebExtension pour plus de détails.

+ +

La clé background est un objet qui peut avoir l'une des deux propriétés suivantes, toutes deux facultatives :

+ + + + + + + + + + + + +
"scripts" +

Un ensemble de chaînes, chacune étant un chemin d'accès à une source JavaScript. Le chemin est relatif au fichier manifest.json lui-même. Ce sont les scripts d'arrière-plan qui seront inclus dans l'extension.

+ +

Les scripts partagent la même fenêtre globale.

+ +

Les scripts sont chargés dans l'ordre où 'ils apparaissent dans le tableau.

+ +

Notez qu'il y a un bug affectant les versions de Firefox antérieures à la version 50 : lorsque le débogueur Firefox est ouvert, les scripts ne sont pas toujours chargés dans l'ordre indiqué dans le tableau. Pour contourner ce bug, vous pouvez utiliser la propriété "page" et inclure des scripts de fond de page en utilisant les balises <script>. Ce bug est résolu dans Firefox 50, et à partir de ce moment, les scripts sont toujours chargés dans l'ordre indiqué dans le tableau.

+
"page" +
+

Note : Si vous souhaitez récupérer un script à partir d'un emplacement distant avec la balise <script> (par exemple : <script src = "https://code.jquery.com/jquery-1.7.1.min.js"> ), vous devrez également modifier la clé content_security_policy dans le fichier manifest.json de votre extension.

+
+ +

Si vous spécifiez des "scripts", une page vide sera créée pour que vos scripts s'exécutent.

+ +

Si vous avez besoin de contenu particulier dans la page, vous pouvez définir votre propre page en utilisant l'option "page".

+ +

Si vous utilisez cette propriété, vous ne pouvez plus spécifier de scripts de fond à l'aide de «scripts», mais vous pouvez inclure vos propres scripts à partir de la page, tout comme dans une page Web normale.

+
+ +

Exemple

+ +
 "background": {
+    "scripts": ["jquery.js", "my-background.js"]
+  }
+ +

Chargez deux scripts de fond.

+ +
  "background": {
+    "page": "my-background.html"
+  }
+ +

Chargez une page d'arrière-plan personnalisée.

+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.background", 10)}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/auteur/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/auteur/index.html new file mode 100644 index 0000000000..a00c7dab33 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/auteur/index.html @@ -0,0 +1,44 @@ +--- +title: author +slug: Mozilla/Add-ons/WebExtensions/manifest.json/auteur +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/author +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
Typechaîne de caractères
ObligatoireNon
Exemple + 
+"author": "Walt Whitman"
+
+ +

L'auteur de l'extension, destiné à être visualisé dans l'interface utilisateur du navigateur. Si la clé du developpeur est fournie et qu'elle contient la propriété "nom", elle remplacera la clé de l'auteur. Il n'y a aucun moyen de spécifier plusieurs auteurs.

+ +

Notez que Firefox ne supporte cette clé qu'à partir de la version 52 et que cette clé est obligatoire dans Microsoft Edge.

+ +

Exemple

+ +
"author": "Walt Whitman"
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("webextensions.manifest.author")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/browser_action/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/browser_action/index.html new file mode 100644 index 0000000000..1b452dc9b8 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/browser_action/index.html @@ -0,0 +1,254 @@ +--- +title: browser_action +slug: Mozilla/Add-ons/WebExtensions/manifest.json/browser_action +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/browser_action +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObject
MandatoryNo
Example + 
+"browser_action": {
+  "browser_style": true,
+  "default_icon": {
+    "16": "button/geo-16.png",
+    "32": "button/geo-32.png"
+  },
+  "default_title": "Whereami?",
+  "default_popup": "popup/geo.html",
+  "theme_icons": [{
+    "light": "icons/geo-16-light.png",
+    "dark": "icons/geo-16.png",
+    "size": 16
+  }, {
+    "light": "icons/geo-32-light.png",
+    "dark": "icons/geo-32.png",
+    "size": 32
+  }]
+}
+
+ +

Une action de navigateur est un bouton que votre extension ajoute à la barre d'outils du navigateur. Le bouton comporte une icône et peut éventuellement avoir une fenêtre contextuelle dont le contenu est spécifié à l'aide de HTML, CSS et JavaScript.

+ +

Si vous fournissez une fenêtre contextuelle, la fenêtre contextuelle est ouverte lorsque l'utilisateur clique sur le bouton, et votre JavaScript s'exécute dans la fenêtre contextuelle permettant l'interaction de l'utilisateur avec elle. Si vous ne fournissez pas de popup, un événement de clic est envoyé aux scripts d'arrière-plan de votre extension lorsque l'utilisateur clique sur le bouton.

+ +

Vous pouvez également créer et manipuler des actions de navigateur de manière programmée à l'aide de l'API browserAction.

+ +

Syntaxe

+ +

La clé browser_action est un objet qui peut avoir l'une des propriétés suivantes, toutes optionnelles :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
browser_styleBooléen +

Facultatif, par défaut à false.

+ +

Utilisez-le pour inclure une feuille de style dans votre popup qui le rendra cohérent avec l'interface utilisateur du navigateur et avec d'autres extensions qui utilisent la propriété browser_style. Bien que cette touche par défaut soit false, il est recommandé de l'inclure et de la mettre à true afin de rendre vos fenêtres contextuelles cohérentes avec l'apparence du reste de l'interface utilisateur du navigateur.

+ +

Dans Firefox, la feuille de style peut être vue à chrome://browser/content/extension.css, ou chrome://browser/content/extension-mac.css sur OS X. Lorsque vous définissez les dimensions, sachez que cette feuille de style définit actuellement  box-sizing: border-box (voir box-sizing).

+ +

Les Browser styles décrivent les classes que vous pouvez appliquer aux éléments dans le popup afin d'obtenir des styles particuliers.

+ +

L'extension de l'exemple latest-download utilise browser_style dans son popup.

+
default_areaChaîne de caractères +
Nouveau dans Firefox 54
+ +

Définit la partie du navigateur dans laquelle le bouton est initialement placé. Il s'agit d'une chaîne qui peut prendre l'une des quatre valeurs suivantes:

+ +
    +
  • "navbar" : le bouton est placé dans la barre d'outils principale du navigateur, à côté de la barre d'URL.
    • +
  • "menupanel" : le bouton est placé dans un panneau contextuel.
    • +
  • "tabstrip" : le bouton est placé dans la barre d'outils qui contient les onglets du navigateur.
    • +
  • "personaltoolbar" : le bouton est placé dans la barre d'outils des signets
    • +
+ +

Cette propriété est seulement supportée dans Firefox.

+ +

Cett propriété est facultative, et defaut à "navbar".

+ +

Firefox se souvient des paramètres default_area d'une extension,  même si cette extension est désinstallée et réinstallée par la suite. Pour forcer le navigateur à reconnaître une nouvelle valeur pour  default_area, l'identifiant de l'extension doit être modifié.

+ +

Une extension ne peut pas changer l'emplacement du bouton après son installation, mais l'utilisateur doit pouvoir déplacer le bouton en utilisant le mécanisme de personnalisation du navigateur.

+
default_iconObjet ou chaîne de caractères +

Utilisez cette option pour spécifier une ou plusieurs icônes pour le bouton d'action du navigateur. L'icône est affichée dans la barre d'outils du navigateur par défaut.

+ +

Les icônes sont spécifiées comme des URL relatives dans le fichier manifest.json lui-même.

+ +

Vous pouvez spécifier un seul fichier d'icône en fournissant une chaîne ici:

+ + 
+"default_icon": "path/to/geo.svg"
+ +

Pour spécifier plusieurs icônes dans différentes tailles, spécifiez ici un objet. Le nom de chaque propriété est la hauteur de l'icône en pixels et doit être converti en un nombre entier. La valeur est l'URL. Par exemple:

+ + 
+    "default_icon": {
+      "16": "path/to/geo-16.png",
+      "32": "path/to/geo-32.png"
+    }
+ +

Vous ne pouvez pas spécifier plusieurs icônes de la même taille.

+ +

Voir Choisir les tailles des icones pour plus de conseils à ce sujet.

+
default_popupchaîne de caractères +

Le chemin d'accès à un fichier HTML contenant la spécification de la fenêtre contextuelle.

+ +

Le fichier HTML peut inclure des fichiers CSS et JavaScript en utilisant des éléments <link> et <script>, tout comme une page Web normale. Cependant, <script> doit avoir l'attribut src pour charger un fichier. N'utilisez pas <script> avec du code intégré, car vous obtiendrez une erreur de politique de violation de contenu confuse.

+ +

Contrairement à une page Web normale, JavaScript en cours d'exécution dans la fenêtre contextuelle peut accéder à toutes les APIs WebExtension (soumis, bien sûr, à l'extension possédant les permissions appropriées).

+ +

Ceci est une propriété localisable.

+
default_titlechaîne de caractères +

Info-bulle pour le bouton, affichée lorsque l'utilisateur passe sa souris dessus.

+ +

Ceci est une propriété localisable.

+
theme_iconsTableau +

Cette propriété vous permet de spécifier différentes icônes pour les thèmes selon que Firefox détecte que le thème utilise du texte sombre ou clair.

+ +

Si cette propriété est présente, il s'agit d'un tableau contenant au moins un objet ThemeIcons. Un objet ThemeIcons contient trois propriétés obligatoires :

+ +
+
"dark"
+
Une URL pointant vers une icône. Cette icône s'affiche lorsqu'un thème utilisant du texte sombre est actif (tel que, le thème Light de Firefox et le thème Default si default_icon n'est pas spécifié).
+
"light"
+
Une URL pointant vers une icône. Cette icône s'affiche lorsqu'un thème utilisant du texte clair est actif (tel que, le thème sombre de Firefox).
+
"size"
+
La taille des deux icônes en pixels.
+
+ +

Les icônes sont spécifiées en tant qu'URL par rapport au fichier manifest.json lui-même.

+ +

Vous devez fournir un ThemeIcons en taille 16x16 et un en taille 32x32 (pour l'affichage de la rétine).

+
+ +

Choisir les tailles des icônes

+ +

L'icône de l'action du navigateur peut devoir être affichée dans différentes tailles dans différents contextes:

+ + + +

Si le navigateur ne peut pas trouver une icône de la bonne taille dans une situation donnée, il choisira la meilleure correspondance et la mettra à l'échelle. Cette correction peut donner une apparence floue à l'icône, il est donc important de choisir attentivement les tailles d'icône.

+ +

Il y a deux approches principales pour cela. Vous pouvez fournir une seule icône en tant que fichier SVG, et elle sera mise à l'échelle correctement :

+ +
"default_icon": "path/to/geo.svg"
+ +

Ou vous pouvez fournir plusieurs icônes dans différentes tailles, et le navigateur choisira la meilleure.

+ +

Dans Firefox:

+ + + +

Vous pouvez donc spécifier des icônes qui correspondent exactement, à la fois aux affichages normaux et à Retina, en fournissant trois fichiers d'icônes et en les spécifiant comme suit:

+ +
    "default_icon": {
+      "16": "path/to/geo-16.png",
+      "32": "path/to/geo-32.png",
+      "64": "path/to/geo-64.png"
+    }
+ +

 

+ +

Si Firefox ne peut pas trouver une correspondance exacte pour la taille qu'il veut, alors il choisira l'icône la plus petite spécifiée qui est plus grande que la taille idéale. Si toutes les icônes sont plus petites que la taille idéale, elle choisira la plus grande icône spécifiée.

+ +

 

+ +

Exemple

+ +
"browser_action": {
+  "default_icon": {
+    "16": "button/geo-16.png",
+    "32": "button/geo-32.png"
+  }
+}
+ +

Une action de navigateur avec juste une icône, spécifiée en 2 tailles différentes. Les scripts d'arrière-plan de l'extension peuvent recevoir des événements de clic lorsque l'utilisateur clique sur l'icône en utilisant un code comme celui-ci :

+ +
 browser.browserAction.onClicked.addListener(handleClick);
+ +
"browser_action": {
+  "default_icon": {
+    "16": "button/geo-16.png",
+    "32": "button/geo-32.png"
+  },
+  "default_title": "Whereami?",
+  "default_popup": "popup/geo.html"
+}
+ +

Une action de navigateur avec une icône, un titre et une fenêtre contextuelle. Celle-ci s'affiche lorsque l'utilisateur clique sur le bouton.

+ +

Pour une extension simple, mais complète, qui utilise une action de navigateur, consultez le tutoriel pas à pas.

+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.manifest.browser_action", 10)}}

+ +

See also

+ + diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/browser_specific_settings/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/browser_specific_settings/index.html new file mode 100644 index 0000000000..073caeeb6b --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/browser_specific_settings/index.html @@ -0,0 +1,117 @@ +--- +title: browser_specific_settings +slug: Mozilla/Add-ons/WebExtensions/manifest.json/browser_specific_settings +tags: + - Add-ons + - Extensions + - WebExtensions + - browser_specific_settings +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/browser_specific_settings +--- +

{{AddonSidebar}}

+ + + + + + + + + + + + + + + + +
TypeObject
Obligatoire +

Habituellement, non (mais voir aussi Quand avec-vous besoin d'une ID Complémentaire?). Obligatoire avant Firefox 48 (desktop) et Firefox pour Android.

+
Example + 
+"browser_specific_settings": {
+  "gecko": {
+    "id": "addon@example.com",
+    "strict_min_version": "42.0"
+  }
+}
+
+
+ +

Description

+ +

La clé browser_specific_settings contient des clés qui sont spécifiques à certaines applications hôtes.

+ +

Propriétés (Gecko) Firefox

+ +

Actuellement, elle contient uniquement une clé, gecko, qui est structurée ainsi :

+ + + +

Vois la liste des versions Gecko valides.

+ +

Format d'ID d'extension

+ +

L'ID d'extension doit être l'un des suivants :

+ + + +

Ce dernier format est plus facile à générer et à manipuler. Sachez que l'utilisation d'une véritable adresse e-mail ici peut attirer des spams.

+ +

Par exemple :

+ +
"id": "extensionname@example.org"
+ +
"id": "{daf44bf7-a45e-4450-979c-91cf07434c3d}"
+ +

Propriétés Microsoft Edge

+ +
+

Avertissement : L'ajout de propriétés spécifiques à Edge au manifeste a causé une erreur avant Firefox 69 qui peut empêcher l'extension de s'installer.

+
+ +

Microsoft Edge stocke les paramètres spécifiques à son navigateur dans la sous-clé edge, qui possède les propriétés suivantes :

+ +
+
browser_action_next_to_addressbar
+
+

Propriété booléenne qui contrôle le placement de l'action du navigateur.

+ + +
+
+ +

Exemples

+ +

Exemple avec toutes les clés possibles. Notez que vous n'incluez normalement ni une version strict_max_version ni une clé update_url.

+ +
"browser_specific_settings": {
+  "gecko": {
+    "id": "addon@example.com",
+    "strict_min_version": "42.0",
+    "strict_max_version": "50.*",
+    "update_url": "https://example.com/updates.json"
+  },
+  "edge": {
+    "browser_action_next_to_addressbar": true
+  }
+}
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("webextensions.manifest.browser_specific_settings")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/chrome_settings_overrides/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/chrome_settings_overrides/index.html new file mode 100644 index 0000000000..a421830363 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/chrome_settings_overrides/index.html @@ -0,0 +1,136 @@ +--- +title: chrome_settings_overrides +slug: Mozilla/Add-ons/WebExtensions/manifest.json/chrome_settings_overrides +tags: + - Add-ons + - Extensions + - WebExtensions + - chrome_settings_overrides + - manifest.json +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/chrome_settings_overrides +--- +
{{AddonSidebar}}
+ +

Utilisez la clé chrome_settings_overrides pour remplacer certains paramètres du navigateur. Deux paramètres sont disponibles :

+ + + +
"chrome_settings_overrides" : {
+  "homepage": "https://developer.mozilla.org/"
+}
+ +
"chrome_settings_overrides": {
+  "search_provider": {
+    "name": "Discogs",
+    "search_url": "https://www.discogs.com/search/?q={searchTerms}",
+    "keyword": "disc",
+    "favicon_url": "https://www.discogs.com/favicon.ico"
+  }
+}
+ + + + + + + + + + + + + + + +
clé de manifeste : chrome_settings_overrides
TypeObjet
ObligatoireNon
+ +

Syntaxe

+ +

La clé chrome_settings_overrides est un objet qui peut avoir les propriétés suivantes:

+ + + + + + + + + + + + + + + + + + + + + +
NomTypeDescription
homepageChaîne de caractères +

Définit la page à utiliser comme page d'accueil du navigateur.

+ +

Le remplacement est donné comme une URL. L'URL peut :

+ +
    +
  • pointer sur un fichier regroupé avec l'extension, auquel cas il est donné comme une URL relative au fichier manifest.json
    • +
  • être une URL distante comme "https://developer.mozilla.org/".
    • +
+ +

Si deux ou plusieurs extensions définissent toutes les deux cette valeur, alors le paramètre de la dernière extension installée aura la priorité.

+ +

Pour éviter de nouveaux onglets, utilisez à la place "chrome_url_overrides".

+ +

C'est une  propriété localisable.

+
search_providerObjet +

Définit un moteur de recherche à ajouter au navigateur.

+ +

Le moteur de recherche a un nom et une URL principale. D'autres URL peuvent être fournies, y compris des URL pour des recherches plus spécialisées comme des recherches d'images. Dans l'URL que vous fournissez, utilisez "{searchTerms}" pour interpoler le terme de recherche  dans l'URL, comme : https://www.discogs.com/search/?q={searchTerms}. Vous pouvez également fournir des paramètres POST à envoyer avec la recherche.

+ +

Le moteur de recherche sera présenté à l'utilisateur à côté de ceux fournis dans l'interface. Si vous incluez la propriété is_defaultet le configurez avec true, le nouveau moteur de recherche devient l'option par défaut. Avec l'utilisation de la propriétékeyword, vous permettez à l'utilisateur de sélectionner votre moteur de recherche en tapant le mot-clé dans la barre d'adresse avant le terme recherché.

+ +

C'est un objet avec les propriétés listées ci-dessous. Toutes les propriétés chaîne de caractères sont localisables.

+ +
+
name
+
Chaîne de caractères : le nom du moteur de recherche, affiché pour l'utilisateur.
+
search_url
+
Chaîne de caractères : l'URL utilisée par le moteur de recherche. Il peut être une URL HTTPS.
+
is_default
+
Booléen: "True" si le moteur de recherch doit être le choix par défaut.
+
alternate_urls {{optional_inline}}
+
Tableau de chaînes de caractères : un éventail d'URL alternatives, qui peut être utilisé à la place desearch_url.
+
encoding {{optional_inline}}
+
Chaîne de caractères : codage du terme de recherche, spécifié comme un standard character encoding name, voir "UTF-8".
+
favicon_url {{optional_inline}}
+
Chaîne de caractères : URL pointant sur une icône pour le moteur de recherche. Ce doit être une URL absolue HTTP ou HTTPS.
+
image_url {{optional_inline}}
+
Chaîne de caractères : URL utilisée pour une recherche d'images.
+
image_url_post_params {{optional_inline}}
+
Chaîne de caractères : paramètres POST à envoyer àimage_url.
+
instant_url {{optional_inline}}
+
Chaîne de caractères : URL utilisée pour une recherche instantanée.
+
instant_url_post_params {{optional_inline}}
+
Chaîne de caractères : paramètres POST à envoyer à instant_url.
+
keyword {{optional_inline}}
+
Chaîne de caractères : mots-clés de la barre d'adresse pour le moteur de recherche.
+
prepopulated_id {{optional_inline}}
+
L'ID d'un moteur de recherche intégré à utiliser.
+
search_url_post_params {{optional_inline}}
+
Chaîne de caractères : paramètres POST à envoyer àsearch_url.
+
suggest_url {{optional_inline}}
+
Chaîne de caractères : URL utilisée pour les suggestions de recherche. Ceci doit être une URL HTTPS
+
suggest_url_post_params {{optional_inline}}
+
Chaîne de caractères : paramètres POST à envoyer àsuggest_url.
+
+
+ +

Compatibilité de navigateur

+ + + +

{{Compat("webextensions.manifest.chrome_settings_overrides", 10)}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/chrome_url_overrides/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/chrome_url_overrides/index.html new file mode 100644 index 0000000000..0cf35648f1 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/chrome_url_overrides/index.html @@ -0,0 +1,97 @@ +--- +title: chrome_url_overrides +slug: Mozilla/Add-ons/WebExtensions/manifest.json/chrome_url_overrides +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/chrome_url_overrides +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObjet
ObligatoireNon
Exemple + 
+  "chrome_url_overrides" : {
+    "newtab": "my-new-tab.html"
+  }
+
+ +

Utilisez la clé chrome_url_overrides pour fournir un remplacement personnalisé pour les documents chargés dans différentes pages spéciales généralement fournies par le navigateur lui-même.

+ +

Syntaxe

+ +

La clé chrome_url_overrides est un objet qui peut avoir les propriétés suivantes:

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
NomTypeDescription
bookmarksChaîne de caractères +

Remplace la page qui affiche les signets.

+
historychaîne de caractères +

Remplace la page qui affiche l'historique de navigation.

+
newtabchaîne de caractères +

Remplace le document qui s'affiche dans la page "Nouvel onglet". Ceci est la page affichée lorsque l'utilisateur a ouvert un nouvel onglet, mais n'a chargé aucun document : par exemple, en utilisant le raccourci clavier Ctrl/Command+T.

+ +

Le remplacement est donné en tant qu'URL d'un fichier HTML. Le fichier doit être regroupé avec l'extension : vous ne pouvez pas spécifier une URL distante ici. Vous pouvez le spécifier par rapport au dossier racine de l'extension, comme : "path/to/newtab.html".

+ +

Le document peut charger CSS et JavaScript, tout comme une page Web normale. L'utilisation de JavaScript dans la page permet d'accéder aux mêmes API privilégiées "browser.*" comme une extension d'arrière-plan.

+ +

Il est très pratique d'inclure un <title> pour la page, ou le titre de l'onglet sera l'URL "moz-extension://..." .

+ +

Un cas d'utilisation courant est de permettre à l'utilisateur de définir une nouvelle page d'onglet : pour ce faire, fournir une nouvelle page d'onglet personnalisée qui navigue vers la page définie par l'utilisateur.

+ +

Si deux ou plusieurs extensions définissent toutes les deux de nouvelles pages à onglet personnalisées, alors la dernière à être installée ou activée utilise sa valeur.

+ +

Pour remplacer la page d'accueil du navigateur, utilisez plutôt "chrome_settings_overrides".

+
+ +

Toutes les propriétés sont localisables.

+ +

Exemple

+ +
"chrome_url_overrides" : {
+  "newtab": "my-new-tab.html"
+}
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.chrome_url_overrides")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/commands/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/commands/index.html new file mode 100644 index 0000000000..067ac67927 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/commands/index.html @@ -0,0 +1,200 @@ +--- +title: commands +slug: Mozilla/Add-ons/WebExtensions/manifest.json/commands +tags: + - Add-ons + - Extensions + - Keyboard Shortcuts + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/commands +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObjet
ObligatoireNon
Exemple + 
+"commands": {
+  "toggle-feature": {
+    "suggested_key": {
+      "default": "Ctrl+Shift+Y",
+      "linux": "Ctrl+Shift+U"
+    },
+    "description": "Send a 'toggle-feature' event"
+  }
+}
+
+ +

Utilisez la clé commands pour définir un ou plusieurs raccourcis clavier pour votre extension.

+ +

Chaque raccourci clavier est défini avec un nom, une combination de clé, et un description. Une fois que vous avez défini des commandes dans le fichier manifest.json, de votre extension, vous pouvez écouter leurs combinaisons de touches associées avec l'API JavaScript  {{WebExtAPIRef("commands")}}.

+ +

Syntaxe

+ +

La clé commands est un objet et chaque raccourci est une propriété de celui-ci. Le nom de la propriété est le nom du raccourci.

+ +

Chaque raccourci est lui-même un objet, qui possède jusqu'à deux propriétés :

+ + + +

La propriété suggested_key est elle-même un objet pouvant avoir l'une des propriétés suivantes et qui sont toutes des chaînes :

+ + + +

La valeur de chaque propriété est le raccourci clavier pour la commande sur la plateforme donnée, sous la forme d'une chaîne contenant les touches séparées par "+". La valeur de "default" est utilisée sur toutes les plateformes qui ne sont pas listées explicitement.

+ +

Par exemple :

+ +
"commands": {
+  "toggle-feature": {
+    "suggested_key": {
+      "default": "Alt+Shift+U",
+      "linux": "Ctrl+Shift+U"
+    },
+    "description": "Send a 'toggle-feature' event to the extension"
+  },
+  "do-another-thing": {
+    "suggested_key": {
+      "default": "Ctrl+Shift+Y"
+    }
+  }
+}
+ +

Cela définit deux raccourcis :

+ + + +

Vous pouvez alors écouter la commande "toggle-feature" avec un code comme celui-ci :

+ +
browser.commands.onCommand.addListener(function(command) {
+  if (command == "toggle-feature") {
+    console.log("toggling the feature!");
+  }
+});
+ +

Raccourcis spéciaux

+ +

Il existe 3 raccourci spéciaux avec des actions par défaut, pour lesquels l'événement  {{WebExtAPIRef("commands.onCommand")}} n'est pas déclenché :

+ + + +

Par exemple, ce JSON définit une combinaison de touches qui clique sur l'action du navigateur de l'extension :

+ +
"commands": {
+  "_execute_browser_action": {
+    "suggested_key": {
+      "default": "Ctrl+Shift+Y"
+    }
+  }
+}
+ +

Les valeurs de raccourci

+ +

Il existe deux formats valides pour les touches de raccourci : comme une combinaison de touches ou comme une clé multimédia.

+ +

Combinaisons de touches

+ +
+
Sur Mac, "Ctrl" est interprété comme "Command", donc si vous avez réellement besoin de "Ctrl", spécifiez "MacCtrl".
+
+ +

Les combinaisons de touches doivent être composées de deux ou trois touches :

+ +
    +
  1. modificateur (obligatoire, à l'exception des touches de fonction). Il peut s'agir de "Ctrl", "Alt", "Command", ou "MacCtrl".
    2. +
  2. second modificateur (facultatif). S'il est fourni, il doit être "Shift" ou (pour Firefox ≥ 63) l'un quelconque des "Ctrl", "Alt", "Command", ou "MacCtrl". Ne doit pas être le modificateur déjà utilisé comme modificateur principal.
    3. +
  3. touche (obligatoire). Ce peut être l'une des touches : +
      +
    • lettres A–Z
      • +
    • chiffres 0–9
      • +
    • fonctions F1–F12
      • +
    • Comma(virgule), Period(point), Home (début), End (Fin), PageUp(page précédente), PageDown (page suivante), Space (espace), Insert(inser), Delete(Suppr), Up (haut), Down (bas), Left(gauche), Right (droite)
      • +
    +
    4. +
+ +

La clé est ensuite donnée sous la forme d'une chaîne contenant l'ensemble des valeurs de clé, dans l'ordre indiqué ci-dessus, séparées "+". Par exemple, "Ctrl+Shift+Z".

+ +

Si une combinaison de touches est déjà utilisée par le navigateur (comme "Ctrl+P") ou par un complément existant, vous ne pouvez pas la remplacer. Vous pouvez le définir, mais votre gestionnaire d'événements ne sera pas appelé lorsque l'utilisateur appuiera sur la combinaison de touches.

+ +

Touches médias

+ +

Une alternative est de spécifier le raccourci comme l'une des touches de média suivantes :

+ + + +

Mise à jour des raccourcis

+ +

Les raccourcis peuvent être mis à jour via {{WebExtAPIRef("commands.update()")}}. Les utilisateurs peuvent également mettre à jour les raccourcis via l'option "Gérer les raccourcis d'extension" sur about:addons dans Firefox, comme montré dans cette video. Dans Chrome, les utilisateurs peuvent modifier les raccourcis sur chrome://extensions/shortcuts.

+ +

Exemple

+ +

Définissez un seul raccourci clavier en utilisant uniquement la combinaison de touches par défaut :

+ +
"commands": {
+  "toggle-feature": {
+    "suggested_key": {
+      "default": "Ctrl+Shift+Y"
+    },
+    "description": "Send a 'toggle-feature' event"
+  }
+}
+ +

Définissez deux raccourcis clavier, l'un avec une combinaison de touches spécifique à la plate-forme :

+ +
"commands": {
+  "toggle-feature": {
+    "suggested_key": {
+      "default": "Alt+Shift+U",
+      "linux": "Ctrl+Shift+U"
+    },
+    "description": "Send a 'toggle-feature' event"
+  },
+  "do-another-thing": {
+    "suggested_key": {
+      "default": "Ctrl+Shift+Y"
+    }
+  }
+}
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.commands")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/content_scripts/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/content_scripts/index.html new file mode 100644 index 0000000000..8bad37fb58 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/content_scripts/index.html @@ -0,0 +1,235 @@ +--- +title: content_scripts +slug: Mozilla/Add-ons/WebExtensions/manifest.json/content_scripts +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/content_scripts +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
Type{{ jsxref("array", "Tableau") }}
ObligatoireNon
Exemple + 
+"content_scripts": [
+  {
+    "matches": ["*://*.mozilla.org/*"],
+    "js": ["borderify.js"]
+  }
+]
+
+ +

Ordonne au navigateur de charger des scripts de contenu dans les pages web dont l’URL correspond à un modèle donné.

+ +

Cette clé est un tableau. Chaque élément est un objet qui :

+ + + +

Le tableau ci-dessous présente le détail de toutes les clés que vous pouvez inclure.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NomTypeDescription
all_frames{{ jsxref("boolean", "Booléen") }} +

true : injecte les scripts spécifiés dans {{ anch("js") }} et {{ anch("css") }} dans tous les cadres correspondant aux exigences d’URL spécifiées, même s’il n’est pas le cadre le plus haut d’un onglet. Cela n’injecte pas dans les cadres enfants quand seul leur parent correspond aux exigences d’URL et pas les cadres enfants. Les exigences d’URL sont vérifiées pour chaque cadre indépendamment.

+ +

false : injecte seulement dans le cadre le plus haut de l’onglet qui répond aux exigences d’URL.

+ +

Par défaut à false.

+
css{{ jsxref("array", "Tableau") }} +

Un tableau de chemins, relatifs à manifest.json, référençant les fichiers CSS qui seront injectés dans les pages correspondantes.

+ +

Les fichiers sont injectés dans l’ordre donné, et avant que le DOM ne soit chargé.

+ +
+

Firefox résout les URLs dans les fichiers CSS injectés par rapport au fichier CSS lui-même, plutôt que par rapport à la page dans laquelle il est injecté.

+
+
exclude_globs{{ jsxref("array", "Tableau") }} +

Un tableau de chaînes contenant des caractères génériques. Voir les {{ anch("Les_modèles_de_correspondance_d’URL", "modèles de correpondance d’URL") }} ci-dessous.

+
exclude_matches{{ jsxref("array", "Tableau") }} +

Un tableau de modèles de correspondance. Voir les {{ anch("Les_modèles_de_correspondance_d’URL", "modèles de correpondance d’URL") }} ci-dessous.

+
include_globs{{ jsxref("array", "Tableau") }}Un tableau de chaînes contenant des caractères génériques. Voir les {{ anch("Les_modèles_de_correspondance_d’URL", "modèles de correpondance d’URL") }} ci-dessous.
js{{ jsxref("array", "Tableau") }} +

Un tableau de chemins, relatifs au fichier manifest.json, référençant les fichiers JavaScript qui seront injectés dans les pages correspondantes.

+ +

Les fichiers sont injectés dans l’ordre indiqué. Cela signifie que, par exemple, si vous incluez ici jQuery suivi d’un autre script de contenu, comme ceci :

+ + 
+"js": ["jquery.js", "my-content-script.js"]
+ +

alors my-content-script.js peut utiliser jQuery.

+ +

Les fichiers sont injectés au moment spécifié par {{ anch("run_at") }}.

+
match_about_blank{{ jsxref("boolean", "Booléen") }} +

Insère les scripts de contenu dans les pages dont l’URL est about:blank ou about:srcdoc, si l’URL de la page qui a ouvert ou créé cette page {{ anch("Les_modèles_de_correspondance_d’URL", "correspond aux modèles") }} spécifiés dans le reste de la clé content_scripts.

+ +

Ceci est particulièrement utile pour exécuter des scripts dans des {{ htmlelement("iframe", "iframes") }} vides, dont l’URL est about:blank. Pour ce faire, vous devez également définir la clé all_frames.

+ +

Par exemple, supposons que vous disposiez d’une clé de content_scripts comme ceci :

+ + 
+"content_scripts": [
+  {
+    "js": ["my-script.js"],
+    "matches": ["https://example.org/"],
+    "match_about_blank": true,
+    "all_frames": true
+  }
+]
+ +

Si l’utilisateur ou l’utilisatrice charge https://example.org/, et si cette page intègre une iframe vide, alors my-script.js sera chargé dans l’iframe.

+ +

match_about_blank est supporté dans Firefox à partir de la version 52. Notez que dans Firefox, les scripts de contenu ne seront pas injectés dans les iframes vides à "document_start" même si vous spécifiez cette valeur dans {{ anch("run_at") }}.

+
matches{{ jsxref("array", "Tableau") }} +

Un ensemble de modèles de correspondance. Voir les {{ anch("Les_modèles_de_correspondance_d’URL", "modèles de correpondance d’URL") }} ci-dessous.

+ +

C’est la seule clé obligatoire.

+
run_at{{ jsxref("string", "Chaîne") }} +

Cette option détermine quand les scripts spécifiés dans {{ anch("js") }} sont injectés. Vous pouvez fournir une chaîne parmi trois ici, chacune identifiant un état dans le processus de chargement d’un document. Les états correspondent directement à {{domxref("Document/readyState", "Document.readyState")}} :

+ +
    +
  • "document_start" : correspond à "loading". Le DOM est toujours en cours de chargement.
    • +
  • "document_end" : correspond à "interactive". Le DOM a fini de charger, mais des ressources telles que des scripts et des images peuvent toujours être en cours de chargement.
    • +
  • "document_idle" : correspond à "complete". Le document et toutes ses ressources ont terminé de charger.
    • +
+ +

La valeur par défaut est "document_idle".

+ +

Dans tous les cas, les fichiers dans {{ anch("js") }} sont injectés après les fichiers dans {{ anch("css") }}.

+
+ +

Les modèles de correspondance d’URL

+ +

La clé content_scripts associe les scripts de contenu aux documents en fonction de la correspondance des URL : si l’URL du document correspond à la spécification de la clé, le script sera joint. Il existe quatre propriétés dans content_scripts que vous pouvez utiliser pour cette spécification :

+ + + +

Pour associer une de ces propriétés, une URL doit correspondre à au moins un des éléments de son tableau. Par exemple, donner une propriété comme :

+ +
"matches": ["*://*.example.org/*", "*://*.example.com/*"]
+ +

Les deux adresses http://example.org/ et http://example.com/ correspondront.

+ +

Étant donné que matches est la seule clé obligatoire, les trois autres clés sont utilisées pour limiter davantage les URL qui correspondent. Pour associer la clé dans son ensemble, une URL doit :

+ +
    +
  1. Correspondre à la propriété matches ;
    2. +
  2. ET associer à la propriété include_globs, si présent ;
    3. +
  3. ET NE PAS correspondre à la propriété exclude_matches, si présent ;
    4. +
  4. ET NE PAS correspondre à la propriété exclude_globs, si présent.
    5. +
+ +

globs

+ +

Un « glob » est juste une chaîne qui peut contenir des caractères génériques. Il existe deux types de caractères génériques, et vous pouvez les combiner dans le même glob :

+ + + +

Par exemple : "*na?i" correspond à "illuminati" et à "annunaki", mais pas à "sagnarelli".

+ +

Exemple

+ +
"content_scripts": [
+  {
+    "matches": ["*://*.mozilla.org/*"],
+    "js": ["borderify.js"]
+  }
+]
+ +

Cela injecte un seul script de contenu borderify.js dans toutes les pages sous mozilla.org ou l’un de ses sous-domaines, qu’ils soient fournis via HTTP ou HTTPS.

+ +
"content_scripts": [
+  {
+    "exclude_matches": ["*://developer.mozilla.org/*"],
+    "matches": ["*://*.mozilla.org/*"],
+    "js": ["jquery.js", "borderify.js"]
+  }
+]
+ +

Cela implique deux scripts de contenu dans toutes les pages sous mozilla.org ou l’un de ses sous-domaines, à l’exception de developer.mozilla.org, qu’il s’agisse de HTTP ou HTTPS.

+ +

Les scripts de contenu ont la même vue du DOM et sont injectés dans l’ordre où ils apparaissent dans le tableau, de sorte que borderify.js peut voir les variables globales ajoutées par jquery.js.

+ +

Compatibilité des navigateurs

+ + + +
{{Compat("webextensions.manifest.content_scripts")}}
diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/content_security_policy/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/content_security_policy/index.html new file mode 100644 index 0000000000..fd1c0d131b --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/content_security_policy/index.html @@ -0,0 +1,117 @@ +--- +title: content_security_policy +slug: Mozilla/Add-ons/WebExtensions/manifest.json/content_security_policy +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/content_security_policy +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeString
ObligatoireNon
Exemple + 
+"content_security_policy": "default-src 'self'"
+
+ +

Les extensions ont une politique de sécurité de contenu qui leur est appliquée par défaut. La stratégie par défaut restreint les sources à partir desquelles elles peuvent charger les ressources <script> et <object>, et interdit les pratiques potentiellement dangereuses telles que l’utilisation d’eval(). Voir la politique de sécurité de contenu par défaut pour en savoir plus sur ces implications.

+ +

Vous pouvez utiliser la clé "content_security_policy" pour desserrer ou resserrer la politique par défaut. Cette clé est spécifiée de la même manière que l’en-tête HTTP Content-Security-Policy. Voir l’utilisation de la politique de sécurité de contenu pour une description générale de la syntaxe de CSP.

+ +

Par exemple, vous pouvez utiliser cette clé pour :

+ + + +

Il existe des restrictions sur la politique que vous pouvez spécifier ici :

+ + + +

Exemple

+ +

Examples valides

+ +

Autoriser les scripts distants de "https://example.com" : (voir note 1)

+ +
"content_security_policy": "script-src 'self' https://example.com; object-src 'self'"
+ +

Autoriser les scripts distants depuis n’importe quel sous-domaine de « jquery.com » :

+ +
"content_security_policy": "script-src 'self' https://*.jquery.com; object-src 'self'"
+ +

Autoriser eval() et ses amis :

+ +
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self';"
+ +

Autoriser le script en ligne : "<script>alert('Hello, world.');</script>" :

+ +
"content_security_policy": "script-src 'self' 'sha256-qznLcsROx4GACP2dm0UCKCzCG+HiZ1guq6ZZDob/Tng='; object-src 'self'"
+ +

Conserver le reste de la politique, mais exiger également que les images soient empaquetées avec l’extension :

+ +
"content_security_policy": "script-src 'self'; object-src 'self'; img-src 'self'"
+ +

Exiger que tous les types de contenu soient empaquetés avec l’extension :

+ +
"content_security_policy": "default-src 'self'"
+
+ +

Exemples non valides

+ +

Politique qui omet la directive "object-src" :

+ +
"content_security_policy": "script-src 'self' https://*.jquery.com;"
+ +

Politique qui omet le mot-clé "self" dans la directive "script-src" :

+ +
"content_security_policy": "script-src https://*.jquery.com; object-src 'self'"
+ +

Le schéma pour une source distante n’est pas https: :

+ +
"content_security_policy": "script-src 'self' http://code.jquery.com; object-src 'self'"
+ +

Le caractère générique est utilisé avec un domaine générique :

+ +
"content_security_policy": "script-src 'self' https://*.blogspot.com; object-src 'self'"
+ +

La source spécifie un schéma mais aucun hôte :

+ +
"content_security_policy": "script-src 'self' https:; object-src 'self'"
+ +

La directive inclut le mot-clé non pris en charge 'unsafe-inline' :

+ +
"content_security_policy": "script-src 'self' 'unsafe-inline'; object-src 'self'"
+ +

1. Note : les exemples valides montrent l’utilisation correcte des clés dans CSP. Toutefois, les extensions avec 'unsafe-eval', 'unsafe-inline', des blobs, des scripts ou des sources distantes dans leur CSP ne sont pas autorisées à être répertoriées sur addons.mozilla.org en raison de problèmes de sécurité majeurs.

+ +

Compatibilité des navigateurs

+ + + +

{{Compat("webextensions.manifest.content_security_policy")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/default_locale/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/default_locale/index.html new file mode 100644 index 0000000000..a22132ac17 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/default_locale/index.html @@ -0,0 +1,46 @@ +--- +title: default_locale +slug: Mozilla/Add-ons/WebExtensions/manifest.json/default_locale +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/default_locale +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
Typechaîne
Obligatoire +

Il doit être présent si le sous-répertoire _locales est présent, sinon il doit être absent.

+
Exemple + 
+"default_locale": "fr"
+
+ +

Cette clé doit être présente si l'extension contient le répertoire _locales, et doit être absente sinon. Il identifie un sous-répertoire de _locales, et ce sous-répertoire sera utilisé pour trouver les chaînes par défaut pour votre extension.

+ +

Voir Internationalisation.

+ +

Exemple

+ +
"default_locale": "fr"
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.default_locale")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/description/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/description/index.html new file mode 100644 index 0000000000..a229e7a2c5 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/description/index.html @@ -0,0 +1,44 @@ +--- +title: description +slug: Mozilla/Add-ons/WebExtensions/manifest.json/description +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/description +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
Typechaîne
ObligatoireNon
Exemple + 
+"description": "Remplace des images par des portraits de chats."
+
+ +

Une brève description de l'extension, destinée à être affichée dans l'interface utilisateur du navigateur.

+ +

Ceci est une propriété localisable.

+ +

Exemple

+ +
"description": "Remplace des images par des portraits de chats."
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.description")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/developer/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/developer/index.html new file mode 100644 index 0000000000..aa9b4d4cf7 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/developer/index.html @@ -0,0 +1,52 @@ +--- +title: developer +slug: Mozilla/Add-ons/WebExtensions/manifest.json/developer +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/developer +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObjet
ObligatoireNon
Exemple + 
+"developer": {
+  "name": "Walt Whitman",
+  "url": "https://en.wikipedia.org/wiki/Walt_Whitman"
+}
+
+ +

Le nom du développeur de l'extension et l'URL de sa page d'accueil, destinés à être affichés dans l'interface utilisateur du navigateur.

+ +

L'objet et ses deux propriétés sont facultatifs. Les propriétés "nom" et "url", si présentes, remplacent respectivement les clés author et homepage_url. Cet objet ne permet qu'un seul nom de développeur et une URL à spécifier.

+ +

Ceci est une propriété localisable.

+ +

Exemple

+ +
"developer": {
+  "name": "Walt Whitman",
+  "url": "https://en.wikipedia.org/wiki/Walt_Whitman"
+}
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.developer")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/devtools_page/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/devtools_page/index.html new file mode 100644 index 0000000000..ad9e89c36f --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/devtools_page/index.html @@ -0,0 +1,50 @@ +--- +title: devtools_page +slug: Mozilla/Add-ons/WebExtensions/manifest.json/devtools_page +tags: + - Add-ons + - DevTools + - Extensions + - Manifest + - Reference + - WebExtensions + - devtools_page +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/devtools_page +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
Typechaîne
ObligatoireNon
Exemple + 
+"devtools_page": "devtools/my-page.html"
+
+ +

Utilisez cette clé pour activer votre extension et intégrer les outils de développement du navigateur.

+ +

Cette clé est définie comme une URL d'un fichier HTML. Le fichier HTML doit être regroupé avec l'extension, et l'URL est relative à la racine de l'extension.

+ +

Voir Extension des outils développeurs pour plus d'informations.

+ +

Exemple

+ +
"devtools_page": "devtools/my-page.html"
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.devtools_page")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/dictionaries/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/dictionaries/index.html new file mode 100644 index 0000000000..b5847938a6 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/dictionaries/index.html @@ -0,0 +1,47 @@ +--- +title: dictionaries +slug: Mozilla/Add-ons/WebExtensions/manifest.json/dictionaries +tags: + - Add-ons + - Extensions + - WebExtensions + - manifest.json +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/dictionaries +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObject
ObligatoireNon
Exemple + 
+"dictionaries": {
+  "en-US": "dictionaries/en-US.dic"
+}
+
+ +

Les clés des dictionaries specifie le locale_code pour lequel votre extension fournit un dictionnaire. Bien que le dictionnaire se compose de deux fichiers, l'un avec une extension  .dic et l'autre avec une extension .aff, seul celui avec l'extension .dic est référencé dans le fichier manifest.json.

+ +

Exemple

+ +
"dictionaries": {
+  "en-US": "dictionaries/en-US.dic"
+}
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("webextensions.manifest.dictionaries")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/externally_connectable/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/externally_connectable/index.html new file mode 100644 index 0000000000..bc2f106f90 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/externally_connectable/index.html @@ -0,0 +1,69 @@ +--- +title: externally_connectable +slug: Mozilla/Add-ons/WebExtensions/manifest.json/externally_connectable +tags: + - Add-ons + - WebExtensions + - manifest.json +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/externally_connectable +--- +

{{AddonSidebar}}{{SeeCompatTable}}

+ + + + + + + + + + + + + + + + +
TypeObject
ObligatoireNon
Exemple + 
+"externally_connectable": {
+  // List of extension IDs that extension wishes to communicate with
+  // If "browser_action" is specified but "browser_action.ids" is not,
+  // no extensions can communicate with this extension.
+  // To match all extension IDs use "*".
+  "ids": [
+    "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
+    "bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb",
+    "cccccccccccccccccccccccccccccccc"
+  ],
+  // Regular expression patterns specifying web pages
+  // If "matches" is not specified, no web pages can communicate with
+  // this extension
+  "matches": [
+    "https://example1.com/*",
+    "*://*.example2.com/*"
+  ]
+}
+
+ +

Une connexion externe permet au développeur d’extensions de contrôler quelles autres extensions et pages Web peuvent communiquer avec cette extension via  {{WebExtAPIRef("runtime.connect","runtime.connect()")}} et {{WebExtAPIRef("runtime.sendMessage", "runtime.sendMessage()")}} passage de message. Si externally_connectable n'est pas spécifié, toutes les extensions peuvent communiquer entre elles, mais pas avec les pages Web.

+ +

attribut "ids"

+ +

ids active la communication entre cette extension et les autres extensions installées spécifiées par les identificateurs d'extension. Utilisez le motif "*" si vous souhaitez communiquer avec toutes les extensions. 

+ +

attribut "matches"

+ +

Les correspondances permettent la communication entre cette extension et les pages Web. Voici une liste d'expressions régulières pour les URL de page avec lesquelles vous souhaitez communiquer.

+ +
+

Note: Si browser_action n'est pas spécifié, la communication entre les extensions est toujours autorisée, comme si browser_action était {"ids": ["*"] }, par conséquent, si vous spécifiez browser_action.matches n'oubliez pas d'ajouter des identifiants si vous souhaitez toujours communiquer. avec d'autres extensions.

+
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.externally_connectable")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/homepage_url/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/homepage_url/index.html new file mode 100644 index 0000000000..2ff68077df --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/homepage_url/index.html @@ -0,0 +1,46 @@ +--- +title: homepage_url +slug: Mozilla/Add-ons/WebExtensions/manifest.json/homepage_url +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/homepage_url +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
Typechaîne
ObligatoireNon
Exemple + 
+"homepage_url": "https://example.org/my-addon"
+
+ +

URL pour la page d'accueil de l'extension.

+ +

Si la clé dévelopeur est fournie et qu'elle contient la propriété "url", cela remplacera la clé "homepage_url".

+ +

c'est une proriété localisable.

+ +

Exemple

+ +
"homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/beastify"
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.homepage_url")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/icons/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/icons/index.html new file mode 100644 index 0000000000..6fa09fab94 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/icons/index.html @@ -0,0 +1,78 @@ +--- +title: icons +slug: Mozilla/Add-ons/WebExtensions/manifest.json/icons +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/icons +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObjet
ObligatoireNon
Exemple + 
+"icons": {
+  "48": "icon.png",
+  "96": "icon@2x.png"
+}
+
+ +

La clé icons spécifie des icônes pour votre extension. Ces icônes seront utilisées pour représenter l'extension dans des composants tels que le gestionnaire des modules d'extensions.

+ +

Elle se compose d'une paire de valeurs-clés de taille d'image et le chemin d'accès au fichier image par rapport au répertoire racine de l'extension.

+ +

Si la clé icons n'est pas fournie, une icône d'extension standard sera utilisée par défaut.

+ +

Vous devez fournir au moins une icône d'extension principale, idéalement d'une taille de 48x48 pixels. C'est l'icône par défaut qui sera utilisée dans le Gestionnaire des extensions. Vous pouvez, cependant, fournir des icônes de n'importe quelle taille, et Firefox tentera de trouver la meilleure icône à afficher dans les différents composants.

+ +

Firefox considérera la résolution de l'écran lors du choix d'une icône. Pour offrir la meilleure expérience visuelle aux utilisateurs avec des écrans haute résolution, tels que les écrans Retina, fournissez des versions deux fois plus grandes de toutes vos icônes.

+ +

Exemple

+ +

Les clés dans l'objet icons spécifient la taille de l'icône en pixels et la valeur spécifie le chemin relatif de l'icône. Cet exemple contient une icône d'extension 48px et une version plus grande pour les écrans haute résolution.

+ +
"icons": {
+  "48": "icon.png",
+  "96": "icon@2x.png"
+}
+ +

SVG

+ +

Vous pouvez utiliser SVG et le navigateur mettra à l'échelle appropriée votre icône. Il existe actuellement deux réserves :

+ +
    +
  1. Vous devez spécifier un "viewBox" dans l'image. Par exemple : + 
    <svg viewBox="0 0 48 48" width="48" height="48" ...
    +
    2. +
  2. Même si vous pouvez utiliser un fichier, vous devez toujours spécifier différentes tailles de l'icône dans votre manifest. Par exemple : + 
    "icons": {
+  "48": "icon.svg",
+  "96": "icon.svg"
+}
    +
    3. +
+ +
+

Note : si vous utilisez un programme comme Inkscape pour créer un SVG, vous voudrez peut-être l'enregistrer en tant que "SVG simple". Firefox peut être gêné par des espaces de noms spéciaux, et ne pas afficher votre icône.

+
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.icons")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/incognito/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/incognito/index.html new file mode 100644 index 0000000000..c03d7cad8b --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/incognito/index.html @@ -0,0 +1,70 @@ +--- +title: incognito +slug: Mozilla/Add-ons/WebExtensions/manifest.json/incognito +tags: + - Add-ons + - WebExtensions + - incognito + - manifest.json +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/incognito +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
Typechaîne
ObligatoireNon
Exemple + 
+"incognito": "spanning"
+ + 
+"incognito": "split"
+ + 
+"incognito": "not_allowed"
+
+ +

Utilisez la clé incognito pour contrôler la façon dont l'extension fonctionne avec les fenêtres de navigation privées.

+ +

Il s'agit d'une chaîne qui peut prendre l'une des valeurs suivantes:

+ + + +

Exemple

+ +
"incognito": "spanning"
+
+ +
"incognito": "split"
+
+ +
"incognito": "not_allowed"
+
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.incognito")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/index.html new file mode 100644 index 0000000000..51e44acdca --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/index.html @@ -0,0 +1,138 @@ +--- +title: manifest.json +slug: Mozilla/Add-ons/WebExtensions/manifest.json +tags: + - Add-ons + - Extensions + - Overview + - WebExtensions + - manifest.json +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json +--- +

{{AddonSidebar}}

+ +
+

Cet article décrit manifest.json pour les extensions web. Si vous cherchez des informations sur le manifeste.json dans les PWAs, consultez l'article Web App Manifest.

+
+ +

Le fichier manifest.json est le seul fichier que chaque extension utilisant les API WebExtension doit contenir.

+ +

En utilisant manifest.json, vous spécifiez les métadonnées basiques de votre extension comme son nom et sa version, et des fonctionnalités de votre extension comme les scripts en arrière-plan (les scripts de contenu et les actions du navigateur).

+ +

C'est un fichier au format JSON à une exception près : il peut contenir des commentaires de type "//".

+ +

List of manifest.json keys

+ +

Les clés manifest.json sont listées ci-dessous:

+ +
{{ListSubpages("/en-US/Add-ons/WebExtensions/manifest.json")}}
+ +

Notes about manifest.json keys

+ + + +

Accessing manifest.json keys at runtime

+ +

Vous pouvez accéder au manifest de votre extension depuis le JavaScript de l'extension en utilisant la fonction {{WebExtAPIRef("runtime.getManifest()")}} :

+ +
browser.runtime.getManifest().version;
+ +

Exemple

+ +

Le bloc ci-dessous contient la syntaxe de base de certaines clés communes du manifest

+ +
+

Note : Il ne s'agit pas d'un exemple à copier-coller. Le choix des clés dont vous aurez besoin dépend de l'extension que vous développez.

+
+ +

Pour des exemples complets d'extensions, voir Exemple d'extensions.

+ +
{
+  "browser_specific_settings": {
+    "gecko": {
+      "id": "addon@example.com",
+      "strict_min_version": "42.0"
+    }
+  },
+
+  "background": {
+    "scripts": ["jquery.js", "my-background.js"],
+  },
+
+  "browser_action": {
+    "default_icon": {
+      "19": "button/geo-19.png",
+      "38": "button/geo-38.png"
+    },
+    "default_title": "Whereami?",
+    "default_popup": "popup/geo.html"
+  },
+
+  "commands": {
+    "toggle-feature": {
+      "suggested_key": {
+        "default": "Ctrl+Shift+Y",
+        "linux": "Ctrl+Shift+U"
+      },
+      "description": "Send a 'toggle-feature' event"
+    }
+  },
+
+  "content_security_policy": "script-src 'self' https://example.com; object-src 'self'",
+
+  "content_scripts": [
+    {
+      "exclude_matches": ["*://developer.mozilla.org/*"],
+      "matches": ["*://*.mozilla.org/*"],
+      "js": ["borderify.js"]
+    }
+  ],
+
+  "default_locale": "en",
+
+  "description": "...",
+
+  "icons": {
+    "48": "icon.png",
+    "96": "icon@2x.png"
+  },
+
+  "manifest_version": 2,
+
+  "name": "...",
+
+  "page_action": {
+    "default_icon": {
+      "19": "button/geo-19.png",
+      "38": "button/geo-38.png"
+    },
+    "default_title": "Whereami?",
+    "default_popup": "popup/geo.html"
+  },
+
+  "permissions": ["webNavigation"],
+
+  "version": "0.1",
+
+  "user_scripts": {
+    "api_script": "apiscript.js",
+  },
+
+  "web_accessible_resources": ["images/my-image.png"]
+}
+ +

Compatibilité du navigateur

+ +

Pour un aperçu complet de toutes les clés de manifeste et de leurs sous-clés, voir le tableau complet de compatibilité du navigateur manifest.json.

+ + + +

{{Compat("webextensions.manifest")}}

+ +

Voir aussi

+ +

{{WebExtAPIRef("permissions")}} JavaScript API

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/manifest_version/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/manifest_version/index.html new file mode 100644 index 0000000000..a13f5331f4 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/manifest_version/index.html @@ -0,0 +1,45 @@ +--- +title: manifest_version +slug: Mozilla/Add-ons/WebExtensions/manifest.json/manifest_version +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/manifest_version +--- +

{{AddonSidebar}}

+ + + + + + + + + + + + + + + + +
TypeNumérique
ObligatoireOui
Exemple + 
+"manifest_version": 2
+
+ +

Cette clé spécifie la version de manifest.json utilisée par cette extension.

+ +

Actuellement, cela doit toujours être 2.

+ +

Exemple

+ +
"manifest_version": 2
+
+ +

Comptabilité des navigateurs

+ + + +

{{Compat("webextensions.manifest.manifest_version")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/name/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/name/index.html new file mode 100644 index 0000000000..ad38b3615c --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/name/index.html @@ -0,0 +1,46 @@ +--- +title: name +slug: Mozilla/Add-ons/WebExtensions/manifest.json/name +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/name +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
Typechaîne
ObligatoireOui
Exemple + 
+"name": "Mon extension"
+
+ +

Nom de l'extension. Ceci permet d'identifier l'extension dans l'interface utilisateur du navigateur et sur les sites comme addons.mozilla.org.

+ +

Il est recommandé de garder le nom suffisamment court pour pouvoir s'afficher dans l'interface utilisateur. Google Chrome et Microsoft Edge limitent la longueur du nom à 45 caractères.

+ +

C'est une propriété localisable.

+ +

Exemple

+ +
"name": "Mon extension"
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.name")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/offline_enabled/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/offline_enabled/index.html new file mode 100644 index 0000000000..01c454f220 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/offline_enabled/index.html @@ -0,0 +1,48 @@ +--- +title: offline_enabled +slug: Mozilla/Add-ons/WebExtensions/manifest.json/offline_enabled +tags: + - Add-ons + - Deprecated + - Extensions + - Non-standard + - Offline + - WebExtensions + - google chrome +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/offline_enabled +--- +

{{AddonSidebar}}

+ + + + + + + + + + + + + + + + +
TypeString
ObligatoireNon
Exemple + 
+"offline_enabled": true
+
+ +

{{Non-standard_Header}}

+ +

Si l'application ou l'extension doit fonctionner hors ligne. Lorsque Chrome détecte qu'il est hors ligne, les applications avec ce champ réglé sur true seront mises en surbrillance dans la page Nouvel onglet.

+ +

A partir de Chrome 35, les applications (ChromeOS uniquement à partir de 2018) sont supposées activées hors ligne et la valeur par défaut de "offline_enabled" est true sauf si la permission "webview" est demandée.Dans ce cas, la connectivité réseau est supposée nécessaire et "offline_enabled" par défaut est false.

+ +

La valeur "offline_enabled" est également utilisée pour déterminer si un contrôle de connectivité réseau sera effectué lors du lancement d'une application en mode Chrome OS kiosk. Une vérification de la connectivité réseau sera effectuée lorsque les applications ne sont pas activées hors ligne, et le lancement de l'application sera mis en attente jusqu'à ce que l'appareil obtienne la connectivité à Internet.

+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.offline_enabled")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/omnibox/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/omnibox/index.html new file mode 100644 index 0000000000..2a3c69f917 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/omnibox/index.html @@ -0,0 +1,52 @@ +--- +title: omnibox +slug: Mozilla/Add-ons/WebExtensions/manifest.json/omnibox +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/omnibox +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObjet
ObligatoireNon
Exemple + 
+"omnibox": {
+  "keyword": "mdn"
+}
+
+ +

Utilisez la clé omnibox pour définir un mot-clé omnibox pour votre extension.

+ +

Lorsque l'utilisateur tape ce mot-clé dans la barre d'adresse du navigateur, suivi d'un espace, les caractères suivants seront envoyés à l'extension à l'aide de l'API omnibox. L'extension pourra ensuite remplir la liste de suggestions de la liste déroulante de la barre d'adresse avec ses propres suggestions.

+ +

Si deux ou plusieurs extensions définissent le même mot-clé, l'extension qui a été installée la dernière permet de contrôler le mot-clé. Toute extension précédemment installée qui définit le même mot-clé ne pourra plus utiliser l'API omnibox.

+ +

 

+ +

Exemple

+ +
"omnibox": {
+  "keyword": "mdn"
+}
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.omnibox")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/optional_permissions/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/optional_permissions/index.html new file mode 100644 index 0000000000..68c8d1fcc6 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/optional_permissions/index.html @@ -0,0 +1,106 @@ +--- +title: optional_permissions +slug: Mozilla/Add-ons/WebExtensions/manifest.json/optional_permissions +tags: + - Add-ons + - WebExtensions + - manifest.json + - optional_permissions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/optional_permissions +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeTableau
ObligatoireNon
Exemple + 
+
+"optional_permissions": [
+  "*://developer.mozilla.org/*",
+  "webRequest"
+]
+
+ +

Utilisez la clé optional_permissions pour lister les permissions que vous souhaitez demander pour l'exécution, une fois que votre extension a été installée.

+ +

La clé de permissions énumère les permissions dont votre extension a besoin  si elle doit être installée. En revanche , optional_permissions liste les permissions dont votre extension n'a pas besoin au moment de l'installation, mais qu'il peut être nécessaire de demander pour l'exécution à un moment donné après son installation. Pour demander une permission, utilisez l'API  {{webextapiref("permissions")}} . La demande de permission peut présenter probablement à l'utilisateur une boîte de dialogue lui demandant d'accorder la permission à votre extension.

+ +

Pour des conseils sur la conception de votre demande d'autorisations d'exécution, afin de maximiser la probabilité que les utilisateurs les accordent, consultez la section, voir Demander les permissions à éxécuter.

+ +

La clé peut contenir deux types d'autorisations: les permissions d'hôte et les permissions d'API

+ +

Permissions d'hôte

+ +

Ce sont les mêmes que les permissions d'hôte que vous pouvez spécifier dans la clé permissions.

+ +

Permissions d'API

+ +

Vous pouvez inclure l'un des éléments suivants ici, mais pas dans tous les navigateurs : consultez la table de compatibilité pour obtenir des détails spécifiques au navigateur :

+ +
+ +
+ +

Notez qu'il s'agit d'un sous-ensemble des permissions API permises dans les permissions.

+ +

Dans cet ensemble, les permissions suivantes sont accordées en silence, sans invite de l'utilisateur : activeTab, cookies, idle, webRequest, webRequestBlocking.

+ +

Exemple

+ +
 "optional_permissions": ["*://developer.mozilla.org/*"]
+ +

Activez l'extension pour demander un accès privilégié aux pages sous developer.mozilla.org.

+ +
  "optional_permissions": ["tabs"]
+ +

Activez l'extension pour demander l'accès aux éléments privilégiés de l'API des onglets.

+ +
  "optional_permissions": ["*://developer.mozilla.org/*", "tabs"]
+ +

Activez l'extension pour demander les deux permissions ci-dessus.

+ +

Comptabilité du navigateur

+ + + +

{{Compat("webextensions.manifest.optional_permissions")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/options_page/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/options_page/index.html new file mode 100644 index 0000000000..75f6ad9730 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/options_page/index.html @@ -0,0 +1,62 @@ +--- +title: options_page +slug: Mozilla/Add-ons/WebExtensions/manifest.json/options_page +tags: + - Add-ons + - Deprecated + - Extensions + - Manifest + - Options + - WebExtensions + - options_page +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/options_page +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeString
MandatoryNo
Example + 
+"options_page": "options/options.html"
+
+ +
{{Deprecated_Header}} +
Cette clé du manifest a été dépréciée. Utilisez options_uià la place.
+
+ +

Utilisez la clé d'options_page pour définir une page d'options pour votre extension.

+ +

La page des options contient les paramètres de l'extension. L'utilisateur peut y accéder depuis le gestionnaire d'add-ons du navigateur, et vous pouvez l'ouvrir depuis votre extension en utilisant {{WebExtAPIRef("runtime.openOptionsPage()")}}.

+ +

Contrairement aux pages d'options spécifiées à l'aide de la nouvelle clé options_ui, les pages d'options spécifiées à l'aide de la clé options_page obsolète ne reçoivent pas les styles de navigateur et s'ouvrent toujours dans un onglet normal du navigateur.

+ +

Exemple

+ +
"options_page": "options/options.html"
+
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.options_page")}}

+ +

Voir aussi

+ + diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/options_ui/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/options_ui/index.html new file mode 100644 index 0000000000..6fbcc56888 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/options_ui/index.html @@ -0,0 +1,118 @@ +--- +title: options_ui +slug: Mozilla/Add-ons/WebExtensions/manifest.json/options_ui +tags: + - Add-ons + - Extensions + - Manifest + - Options + - WebExtensions + - options_ui +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/options_ui +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObjet
ObligatoireNon
Exemple + 
+"options_ui": {
+  "page": "options/options.html"
+}
+
+ +

Utilisez la clé options_ui pour définir une page d'options pour votre extension.

+ +

La page d'options contient des paramètres pour l'extension. L'utilisateur peut y accéder à partir du gestionnaire des extensions du navigateur, et vous pouvez l'ouvrir à partir de votre extension à l'aide de {{WebExtAPIRef("runtime.openOptionsPage()")}}.

+ +

Vous spécifiez options_ui comme un chemin vers un fichier HTML intégré à votre extension. Le fichier HTML peut inclure des fichiers CSS et JavaScript, tout comme une page Web normale. Contrairement à une page normale, le JavaScript peut utiliser toutes les APIs WebExtension pour lesquelles l'extension possède des permissions. Cependant, il fonctionne dans un "scope" différent de celui de vos scripts d'arrière plan.

+ +

Si vous souhaitez partager des données ou des fonctions, entre JavaScript sur votre page d'options et vos scripts d'arrière-plan, vous pouvez le faire directement en obtenant une référence à la fenêtre de vos scripts d'arrière-plan avec {{WebExtAPIRef("extension.getBackgroundPage()")}}, ou une référence à {{domxref("Window")}} de l'une des pages s'exécutant dans votre extension avec {{WebExtAPIRef("extension.getViews()")}}. Ou, vous pouvez faire communiquer le JavaScript de votre page d'options et vos scripts en arrière-plan à l'aide de {{WebExtAPIRef("runtime.sendMessage()")}}, {{WebExtAPIRef("runtime.onMessage")}}, ou {{WebExtAPIRef("runtime.connect()")}}.

+ +

Ces derniers (ou les équivalents {{WebExtAPIRef("runtime.Port")}}  peuvent également être utilisés pour partager des options entre vos scripts d'arrière-plan et vos scripts de contenu.

+ +

En général, vous souhaiterez stocker les options modifiées sur les pages d'options à l'aide de {{WebExtAPIRef("storage", "storage API", "", "true")}}  soit dans {{WebExtAPIRef("storage.sync()")}} (si vous souhaitez que les paramètres soient synchronisés sur toutes les instances du navigateur auxquelles l'utilisateur est connecté), ou {{WebExtAPIRef("storage.local()")}} (si les paramètres sont locaux, dans la machine/le profil actuel). Si vous le faites et que votre (vos) scripts d'arrière plan (ou script(s) de contenus)  doit connaître le changement, votre (vos) script(s) d'arrière plan pourra choisir d'ajouter un auditeur à {{WebExtAPIRef("storage.onChanged")}}.

+ +

Syntaxe

+ +

La clé options_ui est un objet avec le contenu suivant :

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
browser_style
+ {{optional_inline}}		Booléen +

Facultatif, par défaut : true .

+ +

Utilisez cette option pour inclure une feuille de style dans votre page qui la rendra compatible avec l'interface utilisateur du navigateur et avec d'autres extensions qui utilisent la propriété browser_style . Bien qu'il contienne par défaut true , il est recommandé d'inclure cette propriété.

+ +

Dans Firefox, la feuille de style peut être vue sur chrome://browser/content/extension.css, ou chrome://browser/content/extension-mac.css sur macOS. Lorsque vous fixez les dimensions, sachez que cette feuille de style fixe actuellement box-sizing: border-box (voir box-sizing).

+ +

Le guide de style Firefox décrit les classes que vous pouvez appliquer aux éléments de la fenêtre contextuelle afin d'obtenir des styles particuliers.

+
open_in_tab
+ {{optional_inline}}		Booléen +

par défaut : false.

+ +

Si c'est true , la page options s'ouvrira dans un onglet normal du navigateur, plutôt que d'être intégrée au gestionnaire des extensions du navigateur.

+
pageChaîne de caractères +

Obligatoire

+ +

Le chemin d'accès au fichier HTML contenant la spécification de votre page d'options.

+ +

Le chemin est relatif à l'emplacement du manifest.json lui-même.

+
+ +

Exemple

+ +
  "options_ui": {
+    "page": "options/options.html"
+  }
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.options_ui")}}

+ +

Voir aussi

+ + diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/page_action/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/page_action/index.html new file mode 100644 index 0000000000..86360e2758 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/page_action/index.html @@ -0,0 +1,200 @@ +--- +title: page_action +slug: Mozilla/Add-ons/WebExtensions/manifest.json/page_action +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/page_action +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObjet
ObligatoireNon
Exemple + 
+"page_action": {
+  "browser_style": true,
+  "default_icon": {
+    "19": "button/geo-19.png",
+    "38": "button/geo-38.png"
+  },
+  "default_title": "Whereami?",
+  "default_popup": "popup/geo.html"
+}
+
+ +

Une action de page est une icône que votre extension ajoute dans la barre d'URL du navigateur.

+ +

Votre extension peut éventuellement fournir une fenêtre contextuelle associée dont le contenu est spécifié en utilisant HTML, CSS et JavaScript.

+ +

Si vous fournissez une fenêtre contextuelle, celle-ci est ouverte lorsque l'utilisateur clique sur l'icône, et l'exécution de votre JavaScript dans la fenêtre contextuelle peut gérer l'interaction de l'utilisateur avec elle. Si vous ne fournissez pas de fenêtre contextuelle, un clic événement est envoyé à votre extension aux scripts d'arrière plan quand l'utilisateur clique sur l'icône.

+ +

Vous pouvez également créer et activer des actions de page par programme en utilisant l'API pageAction.

+ +

Les actions de page sont comme les actions de navigateur, mais elles sont associées à des pages Web particulières et non au navigateur dans son ensemble. Si une action est seulement pertinente sur certaines pages, vous devez utiliser une action de page et l'afficher uniquement sur les pages pertinentes. Si une action est pertinente pour toutes les pages ou pour le navigateur lui-même, utilisez une action de navigateur.

+ +

Alors que les actions du navigateur sont affichées par défaut, les actions de page sont cachées par défaut. Elles peuvent être affichées pour un onglet particulier en appelant pageAction.show(), en passant dans l'ID de l'onglet. Vous pouvez également modifier ce comportement par défaut en utilisant la propriété show_matches.

+ +

Syntaxe

+ +

La clé page_action est un objet qui peut avoir l'une des trois propriétés, toutes optionnelles:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
browser_styleBooléen +

Facultatif, par defaut : false.

+ +

Utilisez-le pour inclure une feuille de style dans votre popup qui le rendra cohérent avec l'interface utilisateur du navigateur et avec d'autres extensions qui utilisent la propriété browser_style. Bien que cette touche par défaut soit false, il est recommandé de l'inclure et de la mettre à true afin de rendre vos fenêtres contextuelles cohérentes avec l'apparence du reste de l'interface utilisateur du navigateur.

+ +

Dans Firefox, la feuille de style peut être vue sur chrome://browser/content/extension.css, ou chrome://browser/content/extension-mac.css sur OS X.

+ +

Le guide de style Firefox décrit les classes que vous pouvez appliquer aux éléments de la fenêtre contextuelle afin d'obtenir des styles particuliers.

+ +

L'extension exemple latest-download utilise browser_style dans sa fenêtre contextuelle.

+
default_iconObjet ou Chaîne de caractères +

Utilisez cette option pour spécifier une icône pour l'action.

+ +

Il est recommandé de fournir deux icônes ici, une 19x19 pixels et une 38x38 pixels, et de les spécifier dans un objet avec les noms de propriété "19" et "38", comme ceci:

+ + 
+    "default_icon": {
+      "19": "geo-19.png",
+      "38": "geo-38.png"
+    }
+ +

Si vous faites cela, le navigateur choisira l'icône de la bonne taille selon la densité des pixels de l'écran.

+ +

Vous pouvez simplement fournir une chaîne ici :

+ + 
+"default_icon": "geo.png"
+ +

Si vous faites cela, l'icône sera mise à l'échelle pour correspondre à la barre d'outils et peut sembler floue.

+
default_popupChaîne de caractères +

Le chemin d'accès à un fichier HTML contenant la spécification de la fenêtre contextuelle.

+ +

Le fichier HTML peut inclure des fichiers CSS et JavaScript utilisant des éléments <link> et <script>, tout comme une page Web normale. Cependant, n'utilisez pas <script> avec du code intégré, car vous obtiendrez une erreur de politique de violation de contenu. Au lieu de cela, <script> doit utiliser l'attribut src pour charger un fichier script séparé.

+ +

Contrairement à une page Web normale, JavaScript en cours d'exécution dans la fenêtre contextuelle peut accéder à toutes les APIs WebExtension (à condition, bien sûr, que l'extension ait les permissions appropriées).

+ +

Ceci est une propriété localisable.

+
default_titleChaîne de caractères +

Info-bulle pour l'icône, affichée lorsque l'utilisateur passe sa souris dessus.

+ +

Ceci est une propriété localisable.

+
hide_matchesTableau de Match Pattern sauf  <all_urls> +

Masquer l'action de page par défaut pour les pages dont les URLs correspondent des modèles de correspondance données.

+ +

Notez que les actions de page sont toujours cachées par défaut à moins que show_matches ne soit donné. Par conséquent, il est logique d'inclure cette propriété uniquement si show_matches est également donné, et dans ce casil remplacera les patterns dans show_matches. Par exemple, considérez une valeur comme :

+ + 
+"page_action": {
+  "show_matches": ["https://*.mozilla.org/*"],
+  "hide_matches": ["https://developer.mozilla.org/*"]
+}
+ +

Ceci montre l'action de page par défaut pour toutes les URL HTTPS sous le domaine "mozilla.org", à l'exception des pages sous "developer.mozilla.org".

+
show_matchesTableau de Match Pattern +

Affiche l'action de page par défaut pour les pages dont les URLs correspondent à l'un des modèles donnés.

+ +

Voir aussi hide_matches.

+
pinnedBoolean +

Facultatif, par défaut à true.

+ +

Contrôle si l'action de la page doit apparaître dans la barre d'emplacement par défaut lorsque l'utilisateur installe l'extension.

+
+ +

Exemple

+ +
"page_action": {
+  "default_icon": {
+    "19": "button/geo-19.png",
+    "38": "button/geo-38.png"
+  }
+}
+ +

Une action de page avec juste une icône spécifiée en 2 tailles différentes. Les scripts d'arrière-plan de l'extension peuvent recevoir des événements de clic lorsque l'utilisateur clique sur l'icône en utilisant un code comme celui-ci :

+ +
 browser.pageAction.onClicked.addListener(handleClick);
+ +
"page_action": {
+  "default_icon": {
+    "19": "button/geo-19.png",
+    "38": "button/geo-38.png"
+  },
+  "default_title": "Où suis-je ?",
+  "default_popup": "popup/geo.html"
+}
+ +

Une action de page avec une icône, un titre et une fenêtre contextuelle. Cette dernière s'affiche lorsque l'utilisateur clique sur l'icône.

+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.page_action")}}

+ +

Voir aussi

+ + diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/permissions/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/permissions/index.html new file mode 100644 index 0000000000..88190cc8b2 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/permissions/index.html @@ -0,0 +1,198 @@ +--- +title: permissions +slug: Mozilla/Add-ons/WebExtensions/manifest.json/permissions +tags: + - Add-ons + - Extensions + - Permissions + - Reference + - WebExtensions + - manifest.json +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/permissions +--- +

{{AddonSidebar}}

+ + + + + + + + + + + + + + + + +
TypeTableau
ObligatoireNon
Exemple + 
+"permissions": [
+  "*://developer.mozilla.org/*",
+  "webRequest"
+]
+
+ +

Utilisez la clé permissions pour demander des pouvoirs spéciaux pour votre extension. Cette clé est un ensemble de chaînes, et chaque chaîne est une demande d'autorisation.

+ +

Si vous demandez des autorisations avec cette clé, le navigateur peut informer l'utilisateur, au moment de l'installation, que l'extension demande certains privilèges, et lui demande de confirmer qu'il est d'accord. Le navigateur peut également permettre à l'utilisateur d'inspecter les privilèges d'une extension après l'installation.

+ +

Comme la demande d'octroi de privilèges peut avoir un impact sur la volonté des utilisateurs d'installer votre extension, la demande de privilèges mérite une attention particulière. Par exemple, vous voulez éviter de demander des permissions inutiles et vous voudrez peut-être fournir des informations sur la raison pour laquelle vous demandez des permissions dans la description du magasin de votre extension. Vous trouverez plus d'informations sur les questions que vous devez prendre en compte dans l'article Demander les bonnes permissions.

+ +

La clé peut contenir trois types d'autorisations:

+ + + +

Les permissions d'hôte

+ +

Les permissions d'hôte sont spécifiées comme modèles de correspondance, et chaque modèle identifie un groupe d'URL pour lequel l'extension demande des privilèges supplémentaires. Par exemple, une autorisation d'hôte pourrait être "*://developer.mozilla.org/*".

+ +

Les privilèges supplémentaires incluent :

+ + + +

Dans Firefox, à partir de la version 56, les extensions reçoivent automatiquement les permissions d'hôte pour leur propre origine, qui se présentent sous la forme :

+ +
moz-extension://60a20a9b-1ad4-af49-9b6c-c64c98c37920/
+ +

Où 60a20a9b-1ad4-af49-9b6c-c64c98c37920 est l'ID interne de l'extension. L'extension peut obtenir cette URL par programmation en appelant extension.getURL() :

+ +
browser.extension.getURL("");
+// moz-extension://60a20a9b-1ad4-af49-9b6c-c64c98c37920/
+
+ +

Les permissions API

+ +

Les autorisations API sont spécifiées comme des mots-clés, et chaque mot clé nomme une API WebExtension que l'extension souhaite utiliser.

+ +

Les mots clés suivants sont actuellement disponibles:

+ + + +

Dans la plupart des cas, la permission accorde uniquement l'accès à l'API, avec les exceptions suivantes :

+ + + +

Permission activeTab

+ +

Cette autorisation est spécifiée comme " activeTab " (onglet actif). Si une extension possède la permission activeTab , lorsque l'utilisateur interagit avec l'extension, celle-ci reçoit des privilèges supplémentaires uniquement pour l'onglet actif.

+ +

"L'interaction utilisateur" comprend :

+ + + +

Les privilèges supplémentaires sont les suivants :

+ + + +

L'objectif de cette permission est de permettre aux extensions de réaliser une utilisation courante, sans avoir à leur accorder de permissions très puissantes. Beaucoup d'extensions veulent "faire quelque chose à la page courante quand l'utilisateur le demande". Par exemple, considérez une extension qui veut exécuter un script dans la page courante quand l'utilisateur clique sur une action de navigateur. Si la permission activeTab n'existait pas, l'extension devrait demander une permission d'hôte <all_urls>. Mais cela donnerait à l'extension plus de puissance que nécessaire : elle pourrait désormais exécuter des scripts dans n'importe quel onglet, à tout moment, plutôt que simplement dans l'onglet actif et juste en réponse à une action de l'utilisateur.

+ +

Notez que vous ne pouvez accéder qu'à l'onglet ou aux données qui s'y trouvaient au moment de l'interaction de l'utilisateur (par exemple le clic). Lorsque l'onglet actif s'éloigne, par exemple en raison d'un chargement terminé ou d'un autre événement, l'autorisation ne vous donne plus accès à l'onglet.

+ +

Habituellement, l'onglet qui est accordé à activeTab est juste l'onglet actuellement actif, sauf dans un cas. L'API menus  permet à une extension de créer un élément de menu qui s'affiche lorsque le contexte utilisateur clique sur un onglet (c'est-à-dire sur l'élément de l'onglet qui permet à l'utilisateur de passer d'un onglet à un autre). Si l'utilisateur clique sur un tel élément, la permission activeTab est accordée pour l'onglet sur lequel l'utilisateur a cliqué, même s'il ne s'agit pas de l'onglet actuellement actif (A partir de Firefox 63, {{bug(1446956)}}).

+ +

Accès au presse-papiers

+ +

Il existe deux permissions qui permettent aux extensions d'interagir avec le Presse-papiers :

+ + + +

Voir Intérargir avec le presse-papiers pour tous les détails de ce sujet.***

+ +

Stockage illimité

+ +

La permission unlimitedStorage :

+ + + +

Exemple

+ +
 "permissions": ["*://developer.mozilla.org/*"]
+ +

Demande d'accès privilégié aux pages sous developer.mozilla.org.

+ +
  "permissions": ["tabs"]
+ +

Demande d'accès aux éléments privilégiés de l'API tabs.

+ +
"permissions": ["*://developer.mozilla.org/*", "tabs"
+ +

Demande des deux permissions ci-dessus.

+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.permissions")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/protocol_handlers/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/protocol_handlers/index.html new file mode 100644 index 0000000000..d8dfb178af --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/protocol_handlers/index.html @@ -0,0 +1,85 @@ +--- +title: protocol_handlers +slug: Mozilla/Add-ons/WebExtensions/manifest.json/protocol_handlers +tags: + - Add-ons + - Extensions + - WebExtensions + - manifest.json +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/protocol_handlers +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeTableau
ObligatoireNon
Exemple + 
+"protocol_handlers": [
+  {
+    "protocol": "ircs",
+    "name": "IRC Mozilla Extension",
+    "uriTemplate": "https://irccloud.mozilla.com/#!/%s"
+  }
+]
+
+ +

Utilisez cette clé pour enregistrer un ou plusieurs gestionnaires de protocole basés sur le Web.

+ +

Un gestionnaire de protocole est une application qui sait comment gérer certains types de liens : par exemple, un client de messagerie est un gestionnaire de protocole pour les liens "mailto:".  Lorsque l'utilisateur clique sur un lien "mailto:", le navigateur ouvre l'application sélectionnée comme le gestionnaire pour le protocole "mailto:" (ou offre un choix de gestionnaires, en fonction de leurs paramètres).

+ +

Avec cette clé, vous pouvez enregistrer un site Web en tant que gestionnaire pour un protocole particulier. La syntaxe et la sémantique de cette clé ressemblent beaucoup à la fonction Navigator.registerProtocolHandler(), excepté que avec registerProtocolHandler() un site Web ne peut s'inscrire lui-même comme un gestionnaire.

+ +

Chaque gestionnaire de protocole possède trois propriétés, toutes obligatoires :

+ +
+
protocol
+
Une chaîne définissant le protocole. Cela doit être soit: +
    +
  • L'une des suivantes : "bitcoin", "dat", "dweb", "geo", "gopher", "im", "ipfs", "ipns", "irc", "ircs", "magnet", "mailto", "mms", "news", "nntp", "sip", "sms", "smsto", "ssb", "ssh", "tel", "urn", "webcal", "wtai", "xmpp".
    • +
  • Une chaîne composée d'un nom personnalisé préfixé avec "web+" ou "ext+". Par exemple : "web+foo" ou  "ext+foo". Le nom personnalisé doit comporter uniquement des caractères ASCII minuscules. Il est recommandé que les extensions utilisent la forme "ext+".
    • +
+
+
name
+
Une chaîne représentant le nom du gestionnaire de protocole. Il sera affiché à l'utilisateur lorsqu'il sera interrogé s'il souhaite que ce gestionnaire ouvre le lien.
+
uriTemplate
+
Une chaîne représentant l'URL du gestionnaire. Cette chaîne doit inclure "%s" comme espace réservé : il sera remplacé par l'URL échappée du document à traiter. Cette URL peut être une vraie URL, ou il peut s'agir d'un numéro de téléphone, d'une adresse de courrier électronique, etc. C'est une propriété localisable.
+
+ +

Exemple

+ +
"protocol_handlers": [
+  {
+    "protocol": "magnet",
+    "name": "Magnet Extension",
+    "uriTemplate": "https://example.com/#!/%s"
+  }
+]
+ +

Les gestionnaires peuvent également être des pages d'extension.

+ +
"protocol_handlers": [
+  {
+    "protocol": "magnet",
+    "name": "Magnet Extension",
+    "uriTemplate": "/example.xhtml#!/%s"
+  }
+]
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.protocol_handlers")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/short_name/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/short_name/index.html new file mode 100644 index 0000000000..32c76d0111 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/short_name/index.html @@ -0,0 +1,44 @@ +--- +title: short_name +slug: Mozilla/Add-ons/WebExtensions/manifest.json/short_name +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/short_name +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeChaîne
ObligatoireNon
Exemple + 
+"short_name": "MonExtension"
+
+ +

Nom abrégé de l'extension. S'il est donné, il sera utilisé dans des contextes où le champ name est trop long. Il est recommandé que le nom court ne dépasse pas 12 caractères. Si le champ du nom court n'est pas inclus dans manifest.json, le nom sera utilisé à la place et peut être tronqué. 

+ +

C'est une propriété localisable.

+ +

Exemple

+ +
"short_name": "MonExtension"
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.short_name")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/sidebar_action/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/sidebar_action/index.html new file mode 100644 index 0000000000..4e9585baf3 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/sidebar_action/index.html @@ -0,0 +1,151 @@ +--- +title: sidebar_action +slug: Mozilla/Add-ons/WebExtensions/manifest.json/sidebar_action +tags: + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/sidebar_action +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObjet
ObligatoireNon
Exemple + 
+"sidebar_action": {
+  "default_icon": {
+    "16": "button/geo-16.png",
+    "32": "button/geo-32.png"
+  },
+  "default_title": "My sidebar",
+  "default_panel": "sidebar/sidebar.html",
+  "open_at_install":true
+}
+
+ +

Une barre latérale est un volet qui s'affiche à gauche de la fenêtre du navigateur, à côté de la page Web. Le navigateur fournit une interface qui permet à l'utilisateur de voir les barres latérales actuellement disponibles et de sélectionner celle à afficher.

+ +

La clé sidebar_action vous permet de définir les propriétés par défaut de la barre latérale. Vous pouvez modifier ces propriétés lors de l'exécution à l'aide de l'API {{WebExtAPIRef("sidebarAction")}}.

+ +

Syntaxe

+ +

La clé sidebar_action est un objet qui peut avoir l'une des propriétés listées ci-dessous. La seule propriété obligatoire est default_panel.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NomTypeDescription
browser_styleBooléen +

Facultatif, par défaut : true .

+ +

Utilisez cette option pour inclure une feuille de style dans votre fenêtre contextuelle qui permettra la correspondance avec l'interface utilisateur du navigateur et les autres extensions qui utilisent la propriété browser_style.

+ +

Dans Firefox, la feuille de style peut être vue sur  chrome://browser/content/extension.css, ou chrome://browser/content/extension-mac.css sur OS X. Lors de la définition des dimensions, savez que cette feiulle de style est actuellement définit box-sizing: border-box (see box-sizing).

+ +

Le guide de style de Firefox décrit les classes que vous pouvez appliquer aux éléments de la barre latérale afin d'obtenir des styles particuliers.

+
default_iconObjet ou Chaîne de caractères +

Utilisez cette option pour spécifier une ou plusieurs icônes pour la barre latérale. L'icône est affichée dans l'interface utilisateur du navigateur pour l'ouverture et la fermeture des barres latérales.

+ +

Les icônes sont spécifiées comme des URL relatives au fichier manifest.json lui-même.

+ +

Vous pouvez spécifier un seul fichier d'icône en fournissant une chaîne ici :

+ + 
+"default_icon": "path/to/geo.svg"
+ +

Pour spécifier plusieurs icônes dans différentes tailles, spécifiez ici un objet. Le nom de chaque propriété est la hauteur de l'icône en pixels convertie en un nombre entier. La valeur est l'URL. Par exemple:

+ + 
+    "default_icon": {
+      "16": "path/to/geo-16.png",
+      "32": "path/to/geo-32.png"
+    }
+ +

Voir Choix de la taille d'icones pour plus de conseils sur ce sujet.

+ +

Cette propriété est optionnelle : si elle est omise, la barre latérale n'obtient pas d'icône.

+
default_panelChaîne de caractères +

Le chemin d'accès à un fichier HTML qui spécifie le contenu de la barre latérale.

+ +

Le fichier HTML peut inclure des fichiers CSS et JavaScript à l'aide des éléments <link> et <script>, tout comme une page Web normale.

+ +

 Contrairement à une page Web normale, JavaScript en cours d'exécution dans le panneau peut accéder à toutes les APIs des WebExtension (à condition, bien sûr, que l'extension ait les permissions appropriées).

+ +

Cette propriété est obligatoire.

+ +

C'est une propriété localisable.

+
default_titleString +

Titre de la barre latérale. Ceci est utilisé dans l'interface utilisateur du navigateur pour la liste et l'ouverture des barres latérales, et s'affiche en haut de la barre latérale lorsqu'elle est ouverte.

+ +

Cette propriété est facultative : si elle est omise, le titre de la barre latérale est le nom de l'extension.

+ +

C'est une propriété localisable.

+
open_at_installBooleanFacultatif, par défaut à true. Détermine si la barre latérale doit s'ouvrir lors de l'installation. Le comportement par defaut est d'ouvrir la barre latérale lorsque l'installation est terminée.
+ +

Exemple

+ +
"sidebar_action": {
+  "default_icon": "sidebar.svg",
+  "default_title": "Ma barre latérale !",
+  "default_panel": "sidebar.html",
+  "browser_style": true
+}
+ +

Pour un exemple simple d'une extension qui utilise une barre latérale, regarder  annotate-page.

+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.sidebar_action")}}

+ +

Voir aussi

+ + diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/storage/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/storage/index.html new file mode 100644 index 0000000000..1003836dc1 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/storage/index.html @@ -0,0 +1,69 @@ +--- +title: storage +slug: Mozilla/Add-ons/WebExtensions/manifest.json/storage +tags: + - Add-ons + - Extensions + - Manifest + - Reference + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/storage +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObject
ObligatoireNon
Exemple + 
+"storage": {
+  "managed_schema": "schema.json"
+}
+
+ +

Utilisez la clé storage pour spécifier le nom du fichier de schéma qui définit la structure des données dans le stockage géré.

+ +

Les données gérées déclarent les politiques d'entreprise soutenues par l'application. Les politiques sont analogues aux options mais sont configurées par un administrateur système au lieu de l'utilisateur, ce qui permet à l'application d'être configurée pour tous les utilisateurs d'une organisation.

+ +

Après avoir déclaré les politiques, elles sont lues à partir de l'API  {{WebExtAPIRef("storage.managed")}}. Cependant, si une valeur de politique n'est pas conforme au schéma, elle n'est pas publiée par l'API storage.managed. Il appartient à l'application d'appliquer les politiques configurées par l'administrateur.

+ +
+

Firefox ne définit pas de schéma pour le stockage géré, soir {{WebExtAPIRef("storage.managed")}} pour plus de détails.

+
+ +

La clé de storage est un objet qui possède les propriétés requises suivantes:

+ + + + + + + + +
managed_schema +

Un String spécifiant le chemin complet du fichier dans l'extension qui définit le schéma de gestion du stockage..

+
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.storage", 10)}}

+ +
+

Remerciements

+ +

Cette page comprend les détails de la page du site web des développeurs de Chrome Manifeste pour les zones de stockage incluses ici sous la licence Creative Commons Attribution 3.0 United States License.

+
diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/theme/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/theme/index.html new file mode 100644 index 0000000000..d9f4187f08 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/theme/index.html @@ -0,0 +1,1374 @@ +--- +title: theme +slug: Mozilla/Add-ons/WebExtensions/manifest.json/theme +tags: + - Add-ons + - Browser + - Customization + - Customize + - Design + - Look and Feel + - Themes + - colors + - theme manifest +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/theme +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObject
MandatoryNo
Example + 
+"theme": {
+  "images": {
+    "theme_frame": "images/sun.jpg"
+  },
+  "colors": {
+    "frame": "#CF723F",
+    "tab_background_text": "#000"
+  }
+}
+
+ +

Utilisez la clé du thème pour définir un thème statique à appliquer à Firefox.

+ +
+

Note: Si vous voulez inclure un thème avec une extension, veuillez voir l'API  {{WebExtAPIRef("theme")}}.

+
+ +
+

Note: Depuis mai 2019, les thèmes doivent être signés pour être installés ({{bug(1545109)}}). Voir Signature et distribution votre extension pour plus de détails.

+
+ +
+

Prise en charge des thèmes dans Firefox pour Android: Une nouvelle version de Firefox pour Android, basée sur GeckoView, est en cours de développement. Une pré-version ne support pas les thèmes.

+
+ +

Formats des images

+ +

Les formats d'image suivants sont pris en charge dans toutes les propriétés de l'image du thème :

+ + + +

Syntaxe

+ +

La clé du thème est un objet qui prend les propriétés suivantes:

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
NomTypeDescription
imagesObjet +

Facultatif à partir de Firefox 60. Obligatoire avant Firefox 60.

+ +

Un objet JSON dont les propriétés représentent les images à afficher dans différentes parties du navigateur. Voir les images pour plus de détails sur les propriétés que cet objet peut contenir.

+
colorsObjet +

Obligatoire.

+ +

Un objet JSON dont les propriétés représentent les couleurs de différentes parties du navigateur. Voir couleurs pour plus de détails sur les propriétés que cet objet peut contenir.

+
propertiesObjet +

Optionnel

+ +

This object has two properties that affect how the "additional_backgrounds" images are displayed. See properties for details on the properties that this object can contain.

+ +
    +
  • "additional_backgrounds_alignment": un tableau énumérant les valeurs définissant l'alignement des éléments correspondants du tableau  "additional_backgrounds":.
    + Les options d'alignement comprennent  : "bottom" (bas), "center" (centre), "left" (gauche), "right" (droite), "top" (haut), "center bottom"(centre bas), "center center" (centre milieu), "center top" (centre haut), "left bottom" (gauche bas), "left center" (gauche milieu), "left top" (gauche haut), "right bottom" (droite bas), "right center" (droite milieu), et "right top" (droite haut). Si elle n'est pas spécifiée, par défaut, "right top".
    + Facultatif
    • +
  • "additional_backgrounds_tiling": un tableau énumérant les valeurs de répétition des éléments correspondants du tableau "additional_backgrounds":, avec le support de "no-repeat" (pas de répétition), "repeat" (répétition), "repeat-x" et "repeat-y". Si elle n'est pas spécifiée, par défaut, "no-repeat".
    + Facultatif
    • +
+
+ +

images

+ +

Toutes les URL sont relatives au fichier manifest.json et ne peuvent pas référencer une URL externe.

+ +

Les images doivent avoir une hauteur de 200 pixels pour garantir qu'elles remplissent toujours l'espace d'en-tête verticalement.

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
+

headerURL {{Deprecated_Inline}}

+ 		String +
+

headerURL a été supprimé dans Firefox 70. Vous commencerez à recevoir des avertissements dans Firefox 65 et plus tard si vous chargez un thème qui utilise cette propriété. Utilisez theme_frame à la place.

+
+ +

L'URL d'une image de premier plan doit être ajoutée à la zone d'en-tête et ancrée dans le coin supérieur droit de la zone d'en-tête.

+ +

En option à partir de Firefox 60. Un de theme_frame ou headerURL devait être spécifié avant Firefox 60. Notez également que dans Firefox 60 et suivants, tout {{cssxref("text-shadow")}} appliqué au texte d'en-tête est supprimé si aucun headerURL n'est spécifié (voir {{bug(1404688)}}).

+ +

Dans Firefox pour Android, headerURL ou theme_frame doit être spécifié.

+ +
    +
+
theme_frameString +

L'URL d'une image de premier plan doit être ajoutée à la zone d'en-tête et ancrée dans le coin supérieur droit de la zone d'en-tête.

+ +
+

L'ancre de l'image en haut à gauche de l'en-tête pour Chrome et si l'image ne remplit pas la zone de l'en-tête, l'image sera en mosaïque.

+
+ +

Optionnel à partir de Firefox 60. Un de theme_frame ou headerURL devait être spécifié avant Firefox 60.

+ +

Dans Firefox pour Android, headerURL ou theme_frame doit être spécifié.

+
additional_backgroundsArray de String +
+

La propriété additional_backgrounds est experimentale.  Il est actuellement accepté dans les versions finale de Firefox, mais son comportement est sujet à changement.

+
+ +

Un tableau d'URLs pour les images de fond supplémentaires à ajouter à la zone d'en-tête et à afficher derrière l'image "theme_frame" :  Ces images superposent la première image du tableau en haut, la dernière image du tableau en bas.

+ +

Optionel.

+ +

Par défaut, toutes les images sont ancrées dans le coin supérieur droit de la zone d'en-tête, mais leur alignement et leur comportement répété peuvent être contrôlés par les propriétés des "properties".

+
+ +

Couleurs

+ +

Ces propriétés définissent les couleurs utilisées pour les différentes parties du navigateur. Ils sont tous facultatifs (mais notez que "accentcolor" et "textcolor"  étaient obligatoires dans Firefox avant la version 63). L'effet de ces propriétés sur l'interface utilisateur de Firefox est présenté ici:

+ + + + + + + +
+

Overview of the color properties and how they apply to Firefox UI components

+
+ +
+

Lorsqu'un composant est affecté par plusieurs propriétés de couleur, les propriétés sont listées par ordre de priorité.

+
+ +

Toutes ces propriétés peuvent être spécifiées sous la forme d'une chaîne contenant un code de couleur CSS, ou un tableau RVB tel que "tab_background_text": [ 107 , 99 , 23 ], ou en héxadécimal, tel que "tab_background_text": #6b6317.

+ +
+

Dans Chrome, les couleurs ne peuvent être spécifiées que sous forme de tableau RVB.

+ +

Dans Firefox pour Android, les couleurs peuvent être spécifiées en utilisant:

+ + + +

Les couleurs pour les thèmes Firefox pour Android ne peuvent pas être spécifiées à l'aide des noms de couleurs.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameDescription
accentcolor {{Deprecated_Inline}} +
+

accentcolor a été supprimé dans Firefox 70. Vous commencerez à recevoir des avertissements dans Firefox 65 et plus tard si vous chargez un thème qui utilise cette propriété. Utilisez  frame à la place.

+
+ +

La couleur de l'arrière-plan de la zone d'en-tête, affichée dans l'en-tête quand il n'est pas couvert ou reste visible à travers les images spécifiées dans "headerURL" et "additional_backgrounds".

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "accentcolor": "red",
+     "tab_background_text": "white"
+  }
+}
+
+ +

+
bookmark_text +

La couleur du texte et des icônes dans le signet et les barres de recherche. De plus, si tab_text n'est pas défini, il définit la couleur du texte de l'onglet actif et si les icons ne sont pas définies, la couleur des icônes de la barre d'outils. Fourni en tant qu'alias compatible Chrome pour l'outils toolbar_text.

+ +
+

Assurez-vous que toute couleur utilisée contraste bien avec celles utilisées dans frame et frame_inactive ou toolbar si vous utilisez cette propriété.

+ +

Là où les icons ne sont pas définis, assurez-vous également d'un bon contraste avec button_background_active et button_background_hover.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "tab_background_text": "white",
+    "toolbar": "black",
+    "bookmark_text": "red"
+  }
+}
+
+ +

Example use of the bookmark_text color property

+
button_background_active +

La couleur de l'arrière-plan des boutons de la barre d'outils.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "button_background_active": "red"
+  }
+}
+
+ +

+
button_background_hover +

La couleur de l'arrière-plan des boutons de la barre d'outils au survol.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "button_background_hover": "red"
+  }
+}
+
+ +

+
icons +

La couleur des icônes de la barre d'outils, à l'exclusion de celles de la barre d'outils de recherche.

+ +
+

Assurez-vous que la couleur utilisée contraste bien avec celles utilisées dans frame,  frame_inactive, button_background_active, et  button_background_hover.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "icons": "red"
+  }
+}
+
+ +

+
icons_attention +

La couleur des icônes de la barre d'outils dans l'état d'attention comme l'icône de signet étoilé ou l'icône de téléchargement terminé.

+ +
+

Assurez-vous que la couleur utilisée contraste bien avec celles utilisées dans frame,  frame_inactive, button_background_active, et  button_background_hover.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "icons_attention": "red"
+  }
+}
+
+ +

+
frame +

La couleur de l'arrière-plan de la zone d'en-tête, affichée dans la partie de l'en-tête non couverte ou visible à travers les images spécifiées dans "theme_frame" et "additional_backgrounds".

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "red",
+     "tab_background_text": "white"
+  }
+}
+
+ +

+
frame_inactive +

La couleur de l'arrière-plan de la zone d'en-tête quand la fenêtre du navigateur est inactive, affichée dans la partie de l'en-tête non couverte ou visible à travers les images spécifiées dans "theme_frame" et "additional_backgrounds".

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "red",
+     "frame_inactive": "gray",
+     "tab_text": "white"
+  }
+}
+
+ +

Example use of the frame_inactive color property

+
ntp_background +

La nouvelle couleur d'arrière-plan de la page à onglet.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "ntp_background": "red",
+     "ntp_text": "white"
+  }
+}
+
+ +

+
ntp_text +

La couleur du texte de la page nouvel onglet.

+ +
+

Assurez-vous que la couleur utilisée contraste bien avec celle utilisée dans  ntp_background.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "ntp_background": "red",
+     "ntp_text": "white"
+  }
+}
+
+ +

+
popup +

La couleur d'arrière-plan des popups (telles que la liste déroulante de la barre d'adresse et les menus avec une flèche)

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "popup": "red"
+  }
+}
+
+ +

+
popup_border +

La couleur de la bordure des popups.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "popup": "black",
+     "popup_text": "white",
+     "popup_border": "red"
+  }
+}
+
+ +

+
popup_highlight +

La couleur d'arrière-plan des éléments mis en surbrillance à l'aide du clavier dans les fenêtre contextuelles (tel que l’élément sélectionné dans le menu déroulant de la barre d'URL).

+ +
+

Il est recommandé de définir popup_highlight_text pour remplacer la couleur de texte par défaut du navigateur sur différentes plateformes.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "popup_highlight": "red",
+     "popup_highlight_text": "white",
+  }
+}
+
+ +

+
popup_highlight_text +

La couleur du texte des éléments mis en surbrillance dans les fenêtres contextuelles.

+ +
+

S'assurer que la couleur utilisée contraste bien avec celle utilisée dans popup_highlight.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "popup_highlight": "black",
+     "popup_highlight_text": "red"
+  }
+}
+
+ +

+
popup_text +

La couleur du texte des popups.

+ +
+

S'assurer que la couleur utilisée contraste bien avec celle utilisée dans popup.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "popup": "black",
+     "popup_text": "red"
+  }
+}
+
+ +

+
sidebar +

La couleur de fond des barres latérales intégrées.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "sidebar": "red",
+     "sidebar_highlight": "white",
+     "sidebar_highlight_text": "green",
+     "sidebar_text": "white"
+  }
+}
+
+ +

+
sidebar_border +

La couleur de la bordure et du séparateur de la barre latérale du navigateur.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "sidebar_border": "red"
+  }
+}
+
+ +

+
sidebar_highlight +

La couleur d'arrière-plan des lignes en surbrillance dans les barres latérales intégrées.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "sidebar_highlight": "red",
+     "sidebar_highlight_text": "white"
+  }
+}
+
+ +

+
sidebar_highlight_text +

La couleur du texte des lignes en surbrillance dans les barres latérales intégrées.

+ +
+

S'assurer que la couleur utilisée contraste bien avec celle utilisée dans sidebar_highlight.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "sidebar_highlight": "pink",
+    "sidebar_highlight_text": "red",
+  }
+}
+
+ +

+
sidebar_text +

La couleur du texte des barres latérales intégrées.

+ +
+

S'assurer que la couleur utilisée contraste bien avec celle utilisée dans sidebar.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "sidebar": "red",
+     "sidebar_highlight": "white",
+     "sidebar_highlight_text": "green",
+     "sidebar_text": "white"
+  }
+}
+
+ +

+
tab_background_separator +

La couleur du séparateur vertical des onglets d'arrière-plan.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "tab_background_separator": "red"
+  }
+}
+
+ +

A closeup of browser tabs to highlight the separator.

+
tab_background_text +

La couleur du texte affiché dans les onglets des pages inactives. Si tab_text ou bookmark_text n'est pas spécifié, s'applique au texte de l'onglet actif.

+ +
+

Assurez-vous que la couleur utilisée contraste bien avec celles utilisées dans  tab_selected ou frame et  frame_inactive.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "toolbar": "white",
+    "tab_background_text": "red"
+  }
+}
+
+ +

+
tab_line +

La couleur de la ligne de l'onglet sélectionnée.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_bckground_text": "white",
+     "tab_line": "red"
+  }
+}
+
+ +

+
tab_loading +

La couleur de l'indicateur de chargement de l'onglet et de l'effet de vague.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "tab_loading": "red"
+  }
+}
+
+ +

+
tab_selected +

La couleur de fond de l'onglet sélectionné. Lorsqu'elle n'est pas utilisée, la couleur de l'onglet sélectionné est définie par frame et frame_inactive.

+ +
Voir exemple + + 
+"theme": {
+  "images": {
+  "theme_frame": "weta.png"
+},
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "tab_selected": "red"
+  }
+}
+
+ +

+
tab_text +

Depuis Firefox 59, il représente la couleur du texte de l'onglet sélectionné. Si tab_line n'est pas spécifié, il définit également la couleur de la ligne de tabulation sélectionnée.

+ +
+

Assurez-vous que la couleur utilisée contraste bien avec celles utilisées dans  tab_selected ou frame et  frame_inactive.

+
+ +

De Firefox 55 à 58, il est incorrectement implémenté comme alias pour "textcolor"

+ +
Voir exemple + + 
+"theme": {
+  "images": {
+  "theme_frame": "weta.png"
+},
+  "colors": {
+     "frame": "black",
+     "tab_background_text": "white",
+     "tab_selected": "white",
+     "tab_text": "red"
+  }
+}
+
+ +

+
textcolor {{Deprecated_Inline}} +
+

textcolor a été supprimé dans Firefox 70. Vous commencerez à recevoir des avertissements dans Firefox 65 et plus tard si vous chargez un thème qui utilise cette propriété. Utilisez tab_text à la place.

+
+ +

La couleur du texte affiché dans la zone d'en-tête.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "toolbar": "white",
+    "textcolor": "red"
+  }
+}
+
+ +

+
toolbar +

La couleur de fond de la barre de navigation, de la barre de signets et de l'onglet sélectionné.

+ +

Ceci définit également la couleur de fond de la barre "Rechercher".

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "toolbar": "red",
+    "tab_background_text": "white"
+  }
+}
+
+ +

+
toolbar_bottom_separator +

La couleur de la ligne séparant le bas de la barre d'outils de la région en dessous.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "tab_background_text": "white",
+    "toolbar_bottom_separator": "red"
+  }
+}
+
+ +

+
toolbar_field +

La couleur d'arrière-plan des champs de la barre d'outils, comme la barre URL.

+ +

Ceci définit également la couleur de fond du champ Rechercher dans la page.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "tab_background_text": "white",
+    "toolbar_field": "red"
+  }
+}
+
+ +

+
toolbar_field_border +

La couleur de la bordure des champs de la barre d'outils.

+ +

Ceci définit également la couleur de fond du champ Rechercher dans la page.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "toolbar": "black",
+    "tab_background_text": "white",
+    "toolbar_field": "black",
+    "toolbar_field_text": "white",
+    "toolbar_field_border": "red"
+  }
+}
+
+ +

+
toolbar_field_border_focus +

La couleur de bordure pour les champs de la barre d'outils qui ont le focus.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "toolbar": "black",
+    "tab_background_text": "white",
+    "toolbar_field": "black",
+    "toolbar_field_text": "white",
+    "toolbar_field_border_focus": "red"
+  }
+}
+
+ +

+
toolbar_field_focus +

La couleur de fond pour les champs de la barre d'outils qui ont le focus, tels que la barre d'URL.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "toolbar": "black",
+    "tab_background_text": "white",
+    "toolbar_field": "black",
+    "toolbar_field_text": "white",
+    "toolbar_field_focus": "red"
+  }
+}
+
+ +

+
toolbar_field_highlightLa couleur d'arrière-plan utilisée pour indiquer la sélection actuelle du texte dans la barre URL (et la barre de recherche, si elle est configurée pour être séparée). +
See example + 
+"theme": {
+  "colors": {
+    "toolbar_field": "rgba(255, 255, 255, 0.91)",
+    "toolbar_field_text": "rgb(0, 100, 0)",
+    "toolbar_field_highlight": "rgb(180, 240, 180, 0.9)",
+    "toolbar_field_highlight_text": "rgb(0, 80, 0)"
+  }
+}
+
+ +

Example showing customized text and highlight colors in the URL bar

+ +

Ici, le champ toolbar_field_highlight spécifie que la couleur de surbrillance est un vert clair, alors que le texte est réglé sur un vert foncé à vert moyen en utilisant le texte  toolbar_field_highlight_text.

+
toolbar_field_highlight_text +

La couleur utilisée pour dessiner le texte actuellement sélectionné dans la barre d'URL (et la barre de recherche, si elle est configurée comme boîte séparée).

+ +
+

S'assurer que la couleur utilisée contraste bien avec celles utilisées dans  toolbar_field_highlight.

+
+ +
See example + + 
+"theme": {
+  "colors": {
+    "toolbar_field": "rgba(255, 255, 255, 0.91)",
+    "toolbar_field_text": "rgb(0, 100, 0)",
+    "toolbar_field_highlight": "rgb(180, 240, 180, 0.9)",
+    "toolbar_field_highlight_text": "rgb(0, 80, 0)"
+  }
+}
+
+ +

Example showing customized text and highlight colors in the URL bar

+ +

Ici, le champ toolbar_field_highlight_text permet de régler la couleur du texte sur un vert foncé moyen foncé, tandis que la couleur de surbrillance est un vert clair.

+
toolbar_field_separator +

La couleur des séparateurs à l'intérieur de la barre d'URL. Dans Firefox 58, cela a été implémenté en tant que toolbar_vertical_separator.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "toolbar": "black",
+    "tab_background_text": "white",
+    "toolbar_field_separator": "red"
+  }
+}
+
+ +

+ +

Dans cette capture d'écran, "toolbar_vertical_separator" est la ligne verticale blanche dans la barre URL qui sépare l'icône du mode lecture des autres icônes.

+
toolbar_field_text +

La couleur du texte dans les champs de la barre d'outils, comme la barre URL. Ceci définit également la couleur du texte dans le champ Rechercher dans la page.

+ +
+

Assurez-vous que la couleur utilisée contraste bien avec celles utilisées dans  toolbar_field.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "toolbar": "black",
+    "tab_background_text": "white",
+    "toolbar_field": "black",
+    "toolbar_field_text": "red"
+  }
+}
+
+ +

+
toolbar_field_text_focus +

La couleur du texte dans les champs de la barre d'outils qui ont le focus, tels que la barre d'URL.

+ +
+

Assurez-vous que la couleur utilisée contraste bien avec celles utilisées dans  toolbar_field_focus.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "toolbar": "black",
+    "tab_background_text": "white",
+    "toolbar_field": "black",
+    "toolbar_field_text": "white",
+    "toolbar_field_text_focus": "red"
+  }
+}
+
+ +

+
toolbar_text +

La couleur du texte de la barre d'outils. Ceci définit également la couleur du texte dans la barre "Rechercher".

+ +
+

Pour la compatibilité avec Chrome, utilisez l'alias bookmark_text.

+
+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "tab_background_text": "white",
+    "toolbar": "black",
+    "toolbar_text": "red"
+  }
+}
+
+ +

+
toolbar_top_separator +

La couleur de la ligne séparant le bas de la barre d'outils de la région en dessous.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "tab_background_text": "white",
+    "toolbar": "black",
+    "toolbar_top_separator": "red"
+  }
+}
+
+ +

+
toolbar_vertical_separator +

La couleur du séparateur à côté de l'icône du menu d'application. Dans Firefox 58, il correspond à la couleur des séparateurs dans la barre d'URL.

+ +
Voir exemple + + 
+"theme": {
+  "colors": {
+    "frame": "black",
+    "tab_background_text": "white",
+    "toolbar": "black",
+    "toolbar_vertical_separator": "red"
+  }
+}
+
+ +

+
+ +

Aliases

+ +

En outre, cette clé accepte diverses propriétés qui sont des alias pour l'une des propriétés ci-dessus. Ceux-ci sont fournis pour la compatibilité avec Chrome. Si un alias est donné et que la version non-alias est également donnée, alors la valeur sera tirée de la version non-alias.

+ +
+

A partir de Firefox 70, les propriétés suivantes sont supprimées : accentcolor et textcolor. Utilisez à la place frame et tab_background_text. L'utilisation de ces valeurs dans des thèmes chargés dans Firefox 65 ou une version ultérieure augmentera les avertissements.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + +
NomAlias pour
bookmark_texttoolbar_text {{Deprecated_Inline}}
frameaccentcolor {{Deprecated_Inline}}
frame_inactiveaccentcolor {{Deprecated_Inline}}
tab_background_texttextcolor {{Deprecated_Inline}}
+ +

properties

+ + + + + + + + + + + + + + + + + + + + + +
NameTypeDescription
additional_backgrounds_alignment +

Array of String

+ 		+

Optionel.

+ +

Un tableau de valeurs d'énumération définissant l'alignement de l'élément "additional_backgrounds": élément de tableau.
+ Les options d'alignement comprennent:

+ +
    +
  • "bottom"
    • +
  • "center"
    • +
  • "left"
    • +
  • "right"
    • +
  • "top"
    • +
  • "center bottom"
    • +
  • "center center"
    • +
  • "center top"
    • +
  • "left bottom"
    • +
  • "left center"
    • +
  • "left top"
    • +
  • "right bottom"
    • +
  • "right center"
    • +
  • "right top".
    • +
+ +

Si non spécifié, par default "right top".

+
additional_backgrounds_tiling +

Array of String

+ 		+

Optional.

+ +

Un tableau de valeurs d'énumérations définissant, comme l'élément de tableau  "additional_backgrounds": correspondant de répétition. Les options comprennent :

+ +
    +
  • "no-repeat"
    • +
  • "repeat"
    • +
  • "repeat-x"
    • +
  • "repeat-y"
    • +
+ +

Si non spécifié, par default "no-repeat".

+
+ +

Exemples

+ +

Un thème de base doit définir une image à ajouter à l'en-tête, la couleur d'accent à utiliser dans l'en-tête et la couleur du texte utilisée dans l'en-tête:

+ +
 "theme": {
+   "images": {
+     "theme_frame": "images/sun.jpg"
+   },
+   "colors": {
+     "frame": "#CF723F",
+     "tab_background_text": "#000"
+   }
+ }
+ +

Plusieurs images peuvent être utilisées pour remplir l'en-tête, en utilisant une image d'en-tête vierge/transparente pour donner le contrôle de l'emplacement à chaque image visible:

+ +
 "theme": {
+   "images": {
+     "headerURL": "images/blank.png",
+     "additional_backgrounds": [ "images/left.png" , "images/middle.png", "images/right.png"]
+   },
+   "properties": {
+     "additional_backgrounds_alignment": [ "left top" , "top", "right top"]
+   },
+   "colors": {
+     "frame": "blue",
+     "tab_background_text": "#ffffff"
+   }
+ }
+ +

Vous pouvez également remplir l'en-tête avec une image répétée, ou des images, dans ce cas, une seule image ancrée dans le milieu du haut de l'en-tête et répétée sur le reste de l'en-tête:

+ +
 "theme": {
+   "images": {
+     "additional_backgrounds": [ "images/logo.png"]
+   },
+   "properties": {
+     "additional_backgrounds_alignment": [ "top" ],
+     "additional_backgrounds_tiling": [ "repeat"  ]
+   },
+   "colors": {
+     "frame": "green",
+     "tab_background_text": "#000"
+   }
+ }
+ +

L'exemple suivant utilise la plupart des différentes valeurs de "theme.colors":

+ +
  "theme": {
+    "images": {
+      "theme_frame": "weta.png"
+    },
+
+    "colors": {
+       "accentcolor": "darkgreen",
+       "tab_background_text": "white",
+       "toolbar": "blue",
+       "bookmark_text": "cyan",
+       "toolbar_field": "orange",
+       "toolbar_field_border": "white",
+       "toolbar_field_text": "green",
+       "toolbar_top_separator": "red",
+       "toolbar_bottom_separator": "white",
+       "toolbar_vertical_separator": "white"
+    }
+  }
+ +

Il vous donnera un navigateur qui ressemble à ceci :

+ +

+ +

Dans cette capture d'écran, "toolbar_vertical_separator" est la ligne verticale blanche dans la barre d'URL divisant l'icône du mode Lecteur des autres icônes.

+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.theme")}}

+ +

Couleurs

+ +

{{Compat("webextensions.manifest.theme.colors", 10)}}

+ +

Images

+ +

{{Compat("webextensions.manifest.theme.images", 10)}}

+ +

Propriétés

+ +

{{Compat("webextensions.manifest.theme.properties", 10)}}

+ +

Compatibilité de Chrome

+ +

Dans Chrome:

+ + + +
"theme": {
+  "colors": {
+     "frame": [255, 0, 0],
+     "tab_background_text": [0, 255, 0],
+     "bookmark_text": [0, 0, 255]
+  }
+}
+ +

A partir de Firefox 59, la forme tableau et la forme couleur CSS sont acceptées pour toutes les propriétés. Avant cela, colors/frame et colors/tab_background_text nécessitaient la forme tableau, alors que d'autres propriétés nécessitaient la forme couleur CSS.

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/theme_experimentation/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/theme_experimentation/index.html new file mode 100644 index 0000000000..f33a6478c4 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/theme_experimentation/index.html @@ -0,0 +1,194 @@ +--- +title: theme expérimentation +slug: Mozilla/Add-ons/WebExtensions/manifest.json/theme_experimentation +tags: + - Add-ons + - Browser + - Customisation + - Customise + - Design + - Look and Feel + - Themes + - colors + - navigatuer + - theme manifest +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/theme_experiment +--- +
{{AddonSidebar}}
+ + + + + + + + + + + + + + + + +
TypeObject
ObligatoireNon
Exemple + 
+"theme_experiment": {
+  "stylesheet": "style.css",
+  "colors": {
+    "popup_affordance": "--arrowpanel-dimmed"
+  },
+  "images": {
+    "theme_toolbar": "--toolbar-bgimage"
+  },
+  "properties": {
+    "toolbar_image_alignment":
+    "--toolbar-bgalignment"
+  }
+}
+
+ +
+

Cette clé permet de définir les propriétés de la clé expérimentale de theme pour l'interface Firefox. Ces expériences sont un précurseur pour proposer de nouvelles fonctionnalités thématiques à inclure dans Firefox. L'expérimentation se fait par:

+
+ +
+ +
+ +
+

Pour découvrir les sélecteurs CSS des éléments de l'interface utilisateur Firefox ou des variables CSS internes de Firefox, utilise la boite à outils du navigateur.

+
+ +
+
+

Cette clé est uniquement disponible pour une utilisation dans les canaux Firefox Developer Edition et Firefox Nightly et nécessite l'activation de la préférence extensions.legacy.enabled.

+
+
+ +
+
+

Cette fonctionnalité est expérimentale et peut être sujette à modification.

+
+
+ +

Syntaxe

+ +

La clé theme_experiment est un objet qui prend les propriétés suivantes :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NomTypeDescription
stylesheetString +

Facultatif

+ +

Nom d'une feuille de style fournissant le mappage des sélecteurs CSS des éléments de l'interface Firefox aux variables CSS.

+
imagesObject +

Facultatif

+ +

Mappings des variables CSS (telles que définies dans Firefox ou par la feuille de style définie dans la stylesheet) aux noms de propriétés images à utiliser dans la clé theme.

+
colorsObject +

Facultatif

+ +

Mappings des variables CSS (telles que définies dans Firefox ou par la feuille de style définie dans la stylesheet) aux noms de propriétés colors à utiliser dans la clé theme.

+
propertiesObject +

Facultatif

+ +

Mappings des variables CSS (telles que définies dans Firefox ou par la feuille de style définie dans la stylesheet) aux noms de propriétés properties à utiliser dans la clé theme.

+
+ +

Exemples

+ +
+

Ces exemples utilisent une feuille de style appelée style.css pour permettre de définir une couleur pour le bouton de recharge du navigateur dans la clé theme.

+
+ +
+

La feuille de style définit :

+
+ +
+
#reload-button {
+  fill: var(--reload-button-color);
+}
+
+
+ +
+

où #reload-button est le sélecteur CSS interne de Firefox pour le bouton reload et  --reload-button-color est un nom arbitraire..

+
+ +
+

Dans le fichier manifest.json, --reload-button-color est alors mappé au nom à utiliser dans la propriété theme colors :

+
+ +
+
"theme_experiment": {
+  "stylesheet": "style.css",
+  "colors": {
+    "reload_button": "--reload-button-color"
+  }
+}
+
+
+ +
+

L'argument reload_button est alors utilisé de la même manière que n'importe quelle autre propriété de theme .

+
+ +
+
"theme": {
+  "colors": {
+    "reload_button": "orange"
+  }
+}
+
+
+ +
+

Ceci a pour effet de rendre l'icône de recharge orange.

+
+ +
Outcome of a theme experiment, showing the reload button colored orange.
+ +
+ +
+

Cette propriété peut également être utilisée dans browser.theme.update(). images et  properties travaillent de la même manière que colors.

+
+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.theme_experiment")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/user_scripts/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/user_scripts/index.html new file mode 100644 index 0000000000..49bb43316c --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/user_scripts/index.html @@ -0,0 +1,48 @@ +--- +title: user_scripts +slug: Mozilla/Add-ons/WebExtensions/manifest.json/user_scripts +tags: + - Add-ons + - Extensions + - WebExtensions + - manifest.json + - user_scripts key +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/user_scripts +--- +

{{AddonSidebar}}

+ + + + + + + + + + + + + + + + +
TypeArray
ObligatoireNon
Exemple + 
+  "user_scripts": {
+    "api_script": "apiscript.js",
+  }
+
+
+ +

Charge le navigateur de charger le script utilisateur nommé dans la propriété "api_script" .

+ +

La propriété "api_script" nomme le script utilisateur qui sera associé à cette extension.

+ +

Une fois chargé, le script sera appelé après l'exécution du gestionnaire d'événement affecté à la propriété {{WebExtAPIRef("userScripts.onBeforeScript")}}. Ceci permet au gestionnaire d'exporter un ensemble de méthodes API personnalisées qui seront mises à la disposition des scripts de contenu représentés par {{WebExtAPIRef("contentScripts")}}.

+ +

Voir aussi

+ + diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/version/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/version/index.html new file mode 100644 index 0000000000..a29151649f --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/version/index.html @@ -0,0 +1,63 @@ +--- +title: version +slug: Mozilla/Add-ons/WebExtensions/manifest.json/version +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/version +--- +

{{AddonSidebar}}

+ + + + + + + + + + + + + + + + +
TypeChaîne
ObligatoireOui
Exemple + 
+"version": "0.1"
+
+ +

Version de l'extension, sous forme de nombres et de caractères ASCII séparés par des points. Pour connaître les détails du format de version, consultez la page Format de la version.

+ +

Vous pouvez inspecter le code de linter des modules complémentaires pour voir comment les versions d'extension pour Firefox sont validées.

+ +

Notez que la syntaxe définie pour la version de Chrome est plus restrictive que celle utilisée par Firefox :

+ + + +

Pour obtenir votre version d'extension dans votre code JavaScript, utilisez :

+ +
console.log(browser.runtime.getManifest().version);
+ +

Exemple

+ +

Si le manifest contient :

+ +
"version": "0.1"
+ +

Pour obtenir votre version d'extension dans votre code JavaScript, utilisez :

+ +
console.log(browser.runtime.getManifest().version);
+// expected output: "0.1"
+
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("webextensions.manifest.version")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/version_name/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/version_name/index.html new file mode 100644 index 0000000000..19017d8aaa --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/version_name/index.html @@ -0,0 +1,40 @@ +--- +title: version_name +slug: Mozilla/Add-ons/WebExtensions/manifest.json/version_name +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/version_name +--- +

{{AddonSidebar}}

+ + + + + + + + + + + + + + + + +
TypeString
ObligatoireNon
Exemple + 
+"version_name": "0.1 beta"
+
+ +

En plus du champ version, qui est utilisé à des fins de mise à jour, version_name peut être défini sur une chaîne de version descriptive et sera utilisé à des fins d'affichage s'il est présent.

+ +

Si aucun version_name n'est présent, le champ de version sera également utilisé à des fins d'affichage.

+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.version_name")}}

diff --git a/files/fr/mozilla/add-ons/webextensions/manifest.json/web_accessible_resources/index.html b/files/fr/mozilla/add-ons/webextensions/manifest.json/web_accessible_resources/index.html new file mode 100644 index 0000000000..54c713dac6 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/manifest.json/web_accessible_resources/index.html @@ -0,0 +1,98 @@ +--- +title: web_accessible_resources +slug: Mozilla/Add-ons/WebExtensions/manifest.json/web_accessible_resources +tags: + - Add-ons + - Extensions + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/web_accessible_resources +--- +

{{AddonSidebar}}

+ + + + + + + + + + + + + + + + +
TypeTableau
ObligatoireNon
Exemple + 
+"web_accessible_resources": [
+  "images/my-image.png"
+]
+
+ +

Description

+ +

Parfois, vous souhaitez associer certaines ressources - par exemple, images, HTML, CSS ou JavaScript - avec votre extension pour les mettre à la disposition des pages Web.

+ +

Par exemple, l'extensions d'exemple "beastify" remplace une page web par une image d'une bête sélectionnée par l'utilisateur. Les images de la bête sont emballées avec l'extension. Pour rendre visible l'image sélectionnée, l'extension ajoute  <img> des éléments dont l'attribut src pointe sur l'image de la bête. Pour que la page Web puisse charger les images, elles doivent être rendues accessibles sur le Web.

+ +

Avec la clé web_accessible_resources liste toutes les ressources packagées que vous souhaitez mettre à la disposition des pages Web. Vous les spécifiez comme chemins relatifs dans le fichier manifest.json.

+ +

Notez que les scripts de contenu n'ont pas besoin d'être listés comme ressources accessibles sur le Web.

+ +

Si une extension veut utiliser {{WebExtAPIRef("webRequest")}}} pour rediriger une URL publique (par exemple, HTTPS) vers une page qui est packagée dans l'extension, alors l'extension doit lister la page dans la clé web_accessible_resources.

+ +

Utiliser web_accessible_resources

+ +

Par exemple, supposons que votre extension inclut un fichier image sur images images/my-image.png, comme ceci :

+ +
my-extension-files/
+    manifest.json
+    my-background-script.js
+    images/
+        my-image.png
+ +

Pour permettre à une page Web d'utiliser un élément <img> dont l'attribut src pointe sur cette image, vous pouvez spécifier "web_accessible_resources" comme suit :

+ +
"web_accessible_resources": ["images/my-image.png"]
+ +

Le fichier sera alors disponible en utilisant une URL comme :

+ +
moz-extension://<extension-UUID>/images/my-image.png"
+ +

<extension-UUID> n'est pas l'identifiant de votre extension. Il est généré de manière aléatoire pour chaque instance de navigateur. Ceci empêche les sites Web de prendre les empreintes digitales d'un navigateur en examinant les extensions qu'il a installées.

+ +
+

Dans Chrome, l'ID d'une extension est fixe. Quand une ressource est listée dans  web_accessible_resources, elle est accessible comme chrome-extension://<your-extension-id>/<path/to/resource>.  

+
+ +

L'approche recommandée pour obtenir l'URL de la ressource est d'utiliser runtime.getURL en passant le chemin relatif à manifest.json, par exemple :

+ +
browser.runtime.getURL("images/my-image.png");
+// something like:
+// moz-extension://944cfddf-7a95-3c47-bd9a-663b3ce8d699/images/my-image.png
+ +

Cette approche vous donne l'URL correcte quel que soit le navigateur sur lequel votre extension est lancée.

+ +

Caractères génériques

+ +

web_accessible_resources peuvent contenir des caractères génériques. Par exemple, l'entrée suivante fonctionnera également pour inclure la ressource à  "images/my-image.png":

+ +
  "web_accessible_resources": ["images/*.png"]
+ +

Sécurité

+ +

Notez que si vous créez une page accessible sur le Web, n'importe quel site Web peut alors lier ou rediriger vers cette page. La page doit ensuite traiter toute entrée (données POST, par exemple) comme si elle provenait d'une source non fiable, tout comme une page Web normale.

+ +

Exemple

+ +
"web_accessible_resources": ["images/my-image.png"]
+ +

Crée un fichier dans "images/my-image.png" accessible sur le web.

+ +

Compatibilité du navigateur

+ + + +

{{Compat("webextensions.manifest.web_accessible_resources")}}

-- cgit v1.2.3-54-g00ecf