Ce tutoriel va vous apprendre à créer une très simple extension pour Chrome. Vous allez ajouter une icône qui, lorsqu’on clique dessus, affiche une page générée automatiquement. L’icône et la page ressembleront à ça :
1. Commençons par créer un dossier qui va contenir tous les fichiers de l’extension.
2. Créez dans ce dossier le fichier « manifest.json » . Ce fichier sera le manifeste… Quèsaco ?! C’est un fichier au format JSON qui fournit les informations importantes de votre extension.
3. Voici ce que vous allez mettre dans ce fichier :
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
{ "name": "Mon Extension", "version": "0.1", "description": "Premiere extension Chrome pour Icare Design!", "icons": { "16": "icon16.png", "48": "icon48.png", "128": "icon128.png" }, "browser_action": { "default_icon": "icon16.png", ": "index.html" }, "permissions": [ "history" ]} |
(vous pouvez vous rendre sur cette page pour en apprendre beaucoup plus sur le manifeste et son utilité.)
4. Créez 3 icônes au format PNG et aux dimensions suivantes : 16×16, 48×48 et 128×128. Puis placez-les dans le même dossier.
Bien entendu, il faut nommer ces fichiers du même nom que dans le manifeste.
5. Créez un fichier HTML (ici, index.html) et placez-le dans le dossier.
6. Voici ce que vous allez mettre dans ce fichier :
|
1
2
3
4
5
6
7
8
9
10
|
<style>body { min-width:180px; overflow-x:hidden;}</style><br/>HELLO WORLD ! |
1. Ouvrez le navigateur Google Chrome.
2. Cliquez sur 
et choisissez « Outils » puis « Extensions ».
3. Passez en mode développeur en cliquant sur 
.
4.Cliquez sur « Charger l’extension non empaquetée » et choisissez le dossier contenant tous nos fichiers.
L’icône de votre extension apparaît ! Il suffit de cliquer sur l’icône et un pop-up apparaît 