'Dans notre vie actuelle, nous sommes plus désireux d'utiliser les applications de médias sociaux et le moteur de recherche Google à des fins de divertissement et de recherche, c'est-à-dire rechercher un sujet éducatif via le moteur de recherche 'Google' et acquérir également des connaissances générales. Pour utiliser le moteur de recherche Google pour rechercher quelque chose, nous devons avoir un navigateur déjà installé sur nos téléphones portables, ordinateurs portables ou ordinateurs personnels. L'un des navigateurs les plus utilisés et les plus efficaces du siècle d'aujourd'hui est le navigateur 'Google Chrome' qui a proposé de nombreuses bonnes fonctionnalités ainsi que l'utilité de l'extension. L''Extension' est le plugin trouvé dans n'importe quel navigateur pour restreindre ou autoriser les sites Web et différentes fonctions. Ces extensions ne sont généralement pas intégrées ; vous devez ajouter chaque extension à votre navigateur séparément chaque fois que nécessaire. Si vous êtes un peu expert en technologie, alors vous connaissez peut-être l'utilisation des fichiers manifest JSON pour créer et ajouter une extension en quelques étapes. Par conséquent, cet article couvrira toutes ces étapes pour créer une nouvelle extension sur le navigateur Google Chrome.
Avant de jeter un œil à la méthode pour créer une extension, vous devez vous assurer que votre navigateur Google Chrome est déjà lancé et que le moteur de recherche « Google » ne contient aucun arrière-plan. Vous pouvez voir que l'image ci-jointe n'a pas d'arrière-plan pour le moteur de recherche 'Google.com', c'est-à-dire un arrière-plan blanc uniquement.
Ajouter un dossier d'extension
Ouvrez rapidement votre outil Visual Studio Code à partir des applications de votre système Windows. Cela peut prendre jusqu'à 1 minute pour ouvrir correctement le code Visual Studio et l'activer pour notre utilisation. Une fois qu'il a été lancé correctement et qu'il est prêt à être utilisé, nous y avons ajouté le dossier 'Extension' déjà généré via la liste du menu 'Fichier' dans la barre des tâches supérieure illustrée ci-dessous. Après avoir créé le dossier 'Extension', nous y avons ajouté un autre dossier nommé 'image' qui contient les images à utiliser comme icône pour l'extension sur le navigateur. Parallèlement à cela, nous avons ajouté un fichier 'manifest.json' et un fichier javascript nommé 'script.js' pour créer une nouvelle extension et l'ajouter au navigateur. Commençons par le fichier manifest.json en double-cliquant dessus pour commencer à travailler en JSON pour créer et utiliser une extension pour changer l'arrière-plan de 'Google'.
Créer un fichier manifeste
Dans le fichier manifest.json, vous devez ajouter le code 'JSON' ci-dessous. Ce code est le script de configuration réel pour créer et ajouter une extension à notre navigateur Google Chrome. Ce code JSON a été lancé avec l'initialisation de la version du manifeste de la variable en tant que '2' et le nom d'une extension à créer, c'est-à-dire 'Changer l'arrière-plan'. Après cela, nous avons ajouté la courte description de notre extension dans la variable 'description'.
Parallèlement à cela, nous avons ajouté la version d'une extension en tant que '1.0'. Une fois toutes les configurations de base de l''extension' créées, nous devons ajouter le chemin vers l'icône d'image à utiliser comme icône pour les extensions. La variable 'navigateur' a été définie pour définir l'icône d'extension pour la barre des tâches supérieure du navigateur Google Chrome, c'est-à-dire où toutes les extensions sont affichées après les avoir activées pour une utilisation future pour des sites particuliers ou pour tous. Après cela, nous avons ajouté le chemin vers trois fichiers image de tailles différentes afin que le navigateur puisse utiliser des fichiers différents à chaque fois.
Parallèlement à cela, la variable 'page_action' a été utilisée pour afficher l'image à afficher après avoir cliqué sur l'icône 'extensions' dans la barre des tâches supérieure de Google Chrome. La variable 'Default_icon' y a été utilisée, ainsi que ses trois valeurs de chemin différentes pour les images à utiliser comme icônes à chaque rechargement. Trois fichiers image différents sont utilisés à cette fin. La dernière variable content_scripts prend un total de 2 nouvelles variables, c'est-à-dire, matches et CSS. La variable 'matches' contient le chemin vers le site Web à modifier après la création de l'utilisation de cette nouvelle extension. Parallèlement à cela, la variable 'CSS' contient le nom d'un fichier CSS à utiliser pour le style de Google.com après avoir demandé l'extension, c'est-à-dire le style de Google.com après chaque rechargement lors de l'activation de l'extension. Maintenant que ce code est complet et prêt à l'emploi, il suffit de le sauvegarder rapidement et de se diriger vers le fichier « main.css ».
Dans le fichier CSS main.css, nous avons ajouté un style pour notre extension de fichier manifeste à créer. Le style serait appliqué à l'aide de la balise html 'body', c'est-à-dire à appliquer sur toute la zone 'body' du fichier manifeste. Nous avons défini le nouvel arrière-plan de Google.com en utilisant l''URL' d'un fichier image du moteur de recherche. Maintenant, enregistrez votre code avant toute chose.
Après avoir rempli les codes requis, c'est-à-dire le fichier manifest.json et main.css, nous devons ouvrir l'utilitaire Extensions sur le navigateur Google Chrome via l'URL chrome://extensions' dans le nouvel onglet. La zone de l'utilitaire Extensions s'ouvre. Depuis son mode développeur, vous devez charger le dossier 'Extension' décompressé de votre système local pour en faire une extension via le bouton 'charger décompressé' affiché dans l'image ci-dessous. L'extension a été efficacement ajoutée au navigateur Chrome, comme illustré. Supprimez les erreurs pour le faire fonctionner pleinement.
À partir de l'icône 'extension', choisissez l'extension 'Changer l'arrière-plan' pour l'afficher dans la barre des tâches, c'est-à-dire l'extension d'icône 'C'.
Après avoir rechargé Google.com, son arrière-plan a été mis à jour à l'aide de cette extension.
Conclusion
À partir de l'explication de l'utilisation des navigateurs dans le système Windows, nous avons également discuté de l'importance des extensions dans n'importe quel navigateur. Après la brève explication des extensions, nous avons expliqué la méthode pour utiliser le fichier manifeste JSON pour créer une extension pour le navigateur Google Chrome et comment l'utiliser pour changer d'arrière-plan pour le moteur de recherche 'Google.com'. Après avoir chargé l'extension sur Google Chrome, nous l'avons utilisée sur Google.com pour changer son arrière-plan.