Il s'agit d'un catalogue des éléments d'interface utilisateur disponibles dans les extensions. Chaque entrée contient les éléments suivants:
- Une image de l'élément (le cas échéant).
- Description de l'utilisation
- Éléments d'interface associés (le cas échéant)
- Liens vers les instructions d'implémentation et des exemples de code
Ces éléments sont différents moyens d'appeler les fonctionnalités d'extension. Vous n'êtes pas obligé de tous les implémenter. En fait, certains cas d'utilisation n'en utilisent aucun. Par exemple, un lien plus court peut agir sur l'URL affichée à l'aide d'un raccourci clavier et placer le lien raccourci dans le presse-papiers par programmation.
Actions
Une action est ce qui se passe lorsqu'un utilisateur clique sur l'icône d'action associée à votre extension. Une action peut appeler une fonctionnalité d'extension à l'aide de l'API Action ou ouvrir un pop-up permettant aux utilisateurs d'appeler plusieurs fonctionnalités d'extension. Indiquez aux utilisateurs l'action de l'action à l'aide d'une info-bulle.
Pour apprendre à créer une action, consultez Implémenter une action ou examinez les exemples d'action.
Icônes d'action
Une extension nécessite au moins une icône pour la représenter. Les utilisateurs cliquent sur l'icône pour appeler une action, qu'elle appele une fonctionnalité d'extension à l'aide de l'API Action ou qu'elle ouvre un pop-up.
Vous pouvez également ajouter un libellé, ici appelé "badge", à l'icône pour indiquer, par exemple, l'état de l'extension ou que des actions sont requises par l'utilisateur.
Pour apprendre à créer une action, consultez Implémenter une action ou examinez les exemples d'action.
Badges
Les badges sont des textes mis en forme placés au-dessus de l'icône d'action pour indiquer, par exemple, l'état de l'extension ou que l'utilisateur doit effectuer des actions. Vous pouvez définir le texte du badge en appelant chrome.action.setBadgeText() et la couleur de la bannière en appelant chrome.action.setBadgeBackgroundColor().
Pour savoir comment créer une action, consultez Implémenter une action ou l'exemple Boire de l'eau.
Commandes
Les commandes sont des combinaisons de touches qui appellent une fonctionnalité d'extension. Définissez des combinaisons de touches dans le fichier manifest.json et répondez-y à l'aide de l'API Commands.
Pour apprendre à implémenter une commande, consultez la documentation de référence de l'API ou l'exemple chrome.commands.
Menu contextuel
Un menu contextuel s'affiche pour le clic alternatif (souvent appelé clic droit) d'une souris. Définissez des menus contextuels à l'aide de l'API Context Menus.
Pour découvrir comment implémenter un menu contextuel, consultez les exemples de menu contextuel.
Omnibox
Vous pouvez interagir avec les utilisateurs à l'aide de l'omnibox Chrome. Lorsqu'un utilisateur saisit des mots clés définis par une extension dans l'omnibox, votre extension contrôle ce qu'il voit dans l'omnibox. Définissez des mots clés dans le fichier manifest.json et répondez-y à l'aide de l'API Omnibox.
Pour découvrir comment remplacer l'omnibox, consultez l'article "Déclencher des actions depuis l'omnibox" ou l'exemple de référence rapide de l'API.
Pages de remplacement
Une extension peut remplacer l'une de ces pages Chrome intégrées :
- Historique
- Nouvel onglet
- Bookmarks
Pour savoir comment remplacer les pages Chrome, consultez la section Remplacer les pages Chrome ou l'exemple de remplacement.
Fenêtres pop-up
Une fenêtre pop-up est une action qui affiche une fenêtre permettant aux utilisateurs d'appeler plusieurs fonctionnalités d'extension. Les fenêtres pop-up peuvent être ouvertes si l'utilisateur clique sur l'icône d'action, via un raccourci clavier ou en appelant chrome.action.openPopup().
Pour apprendre à créer un pop-up, consultez Ajouter un pop-up. Vous pouvez également télécharger une étape illustrant l'un des exemples d'action.
Panneaux latéraux
Un panneau latéral permet aux utilisateurs d'appeler des fonctionnalités d'extension sur des pages Web (voir l'image). Un panneau latéral peut être associé à un seul onglet ou à une fenêtre entière. Vous pouvez contrôler un panneau latéral à l'aide de l'API Side Panel.
Pour apprendre à créer un panneau latéral, consultez les cas d'utilisation des panneaux latéraux ou examinez les exemples de panneaux latéraux.
Info-bulles
Une info-bulle permet d'afficher l'effet de l'action de votre extension lorsqu'un utilisateur pointe sur votre icône d'action. Par défaut, l'info-bulle affiche le nom de l'extension.
Pour savoir comment ajouter une info-bulle, utilisez le membre "default_title" de la clé "action" des fichiers manifestes.
Outils de développement
Vous pouvez ajouter des panneaux personnalisés (onglets appelés dans les outils de développement) aux outils de développement à l'aide de l'API DevTools Panels. D'autres API DevTools vous permettent de surveiller les fenêtres et le trafic réseau. Vous pouvez également personnaliser le panneau Enregistreur des outils de développement. Outils pour les développeurs Chrome le panneau Lighthouse a commencé sa vie sous la forme d'une extension des outils de développement.
Notifications
Envoyez des messages dans la barre d'état système d'un utilisateur à l'aide des extensions de l'API Notifications ou de l'API Notifications de la plate-forme Web.
Pour savoir comment utiliser les notifications, consultez Informer les utilisateurs.
Thèmes
Un thème est un type d'extension particulier qui modifie l'apparence du navigateur. Les thèmes sont empaquetés comme les extensions standards, mais ils ne contiennent pas de code JavaScript ni HTML.
Pour savoir comment créer un thème, consultez Que sont les thèmes ?
Autres façons d'interagir avec les utilisateurs
Cette section décrit d'autres façons dont votre extension peut interagir avec les utilisateurs. Bien qu'ils ne soient pas strictement nécessaires pour une extension de base, ils peuvent être des éléments importants de votre extension. Pour de nombreux utilisateurs, certaines de ces fonctionnalités sont absolument essentielles à l'utilisation de l'extension.
Accessibilité
Pour de nombreux utilisateurs, l'accessibilité est littéralement l'interface utilisateur, et ses fonctionnalités peuvent souvent être utiles à ceux qui n'ont pas besoin de l'accessibilité comme moyen principal d'interaction avec votre extension. Découvrez les principes de base pour rendre votre extension accessible.
Internationalisation
Adressez-vous aux utilisateurs dans leur propre langue. Découvrez comment internationaliser l'interface.