Comment créer une extension chromée

Comment créer une extension chromée

«Dans notre vie actuelle, nous sommes plus impatients d'utiliser les applications de médias sociaux et le moteur de recherche Google à nos fins de divertissement et de recherche, je.e., Recherchez 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 mobiles, 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 permettre des 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 vous avez besoin. Si vous êtes un petit expert en technologie, vous connaissez peut-être l'utilisation de fichiers JSON manifestes 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 attachée ci-dessous n'a aucune arrière-plan pour le moteur de recherche "Google.com », je.e., fond blanc uniquement."

Ajouter un dossier d'extension

Ouvrez rapidement votre outil de code Visual Studio à partir des applications de votre système Windows. Il peut prendre jusqu'à 1 minute pour ouvrir correctement le code Visual Studio et l'activer pour notre usage. Une fois qu'il a été lancé correctement et est prêt pour l'utilisation, nous avons ajouté le dossier déjà généré «Extension» via la liste de menu «Fichier» dans la barre de tâche supérieure ci-dessous. Après avoir créé le dossier «Extension», nous avons ajouté un autre dossier nommé «Image» qui contient les images à utiliser comme icône pour l'extension du navigateur. Parallèlement à cela, nous avons ajouté un "manifeste.Fichier JSON "et un fichier JavaScript nommé" Script.JS ”pour créer une nouvelle extension et l'ajouter au navigateur. Commençons par le manifeste.Fichier JSON en double-cliquant dessus pour commencer à travailler dans JSON pour créer et utiliser une extension pour modifier l'arrière-plan de "Google".

Créer un fichier manifeste

Au sein du manifeste.Fichier JSON, vous devriez ajouter le code «JSON» à croisement affiché. 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é démarré avec l'initialisation de la version manifeste de variable comme «2» et le nom d'une extension à créer, je.e., "Changement de fond". Après cela, nous avons ajouté la brève description de notre extension dans la variable «Description».

Parallèlement à cela, nous avons ajouté la version d'une extension comme «1.0 ”. Après que toutes les configurations de base de «l'extension» soient créées, nous devons ajouter le chemin à l'icône d'image à utiliser comme icône pour les extensions. Le «navigateur» variable a été défini pour définir l'icône d'extension pour la barre des tâches supérieure du navigateur Google Chrome, i.e., où toutes les extensions sont affichées après leur permettre une utilisation future pour des sites particuliers ou tous. Après cela, nous avons ajouté le chemin d'accès à trois fichiers d'image de différentes tailles afin que le navigateur puisse utiliser différents fichiers à 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" de la barre des tâches supérieure de Google Chrome. La variable «Default_icon» a été utilisée à l'intérieur, ainsi que ses trois valeurs de chemin différentes pour les images à utiliser comme icônes sur chaque rechargement. Trois fichiers d'image différents sont utilisés à cet effet. La dernière variable Content_Scripts prend un total de 2 nouvelles variables, i, i.e., matchs 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 postulé pour l'extension, je.e., Styling Google.com après chaque rechargement sur l'activation de l'extension. Maintenant que ce code est complet et prêt à l'emploi, enregistrez-le simplement rapidement et passez vers le «principal.Fichier CSS.

Dans le cadre principal.Fichier CSS CSS, nous avons ajouté du style pour que notre extension de fichier manifeste soit créée. Le style serait appliqué à l'aide de la balise HTML «Body», je.e., à appliquer sur la zone complète du «corps» du fichier manifeste. Nous avons définis la nouvelle expérience pour Google.com à l'aide de «l'URL» d'un fichier image du moteur de recherche. Maintenant, enregistrez votre code avant quoi que ce soit.

Après avoir terminé les codes requis, je.e., manifeste.JSON et Main.Fichier CSS, nous devons ouvrir l'utilitaire d'extensions sur le navigateur Google Chrome via l'URL Chrome: // Extensions »dans le nouvel onglet. La zone utilitaire d'extensions est ouverte. À partir de son mode développeur, vous devez charger le dossier «d'extension» non emballé de votre système local pour en faire une extension via le bouton «Chargement déballé» affiché dans l'image ci-dessous. L'extension a été ajoutée efficacement au navigateur Chrome, comme l'a exposé. Supprimer les erreurs pour le faire fonctionner complètement.

À partir de l'icône «Extension», choisissez l'extension «Changer Background» pour l'afficher dans la barre des tâches, je.e., L'extension d'icône «C».

Après avoir rechargé Google.com, son arrière-plan a été mis à jour en utilisant 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 de n'importe quel navigateur. Après la brève explication des extensions, nous avons expliqué la méthode pour utiliser le fichier JSON manifeste pour créer une extension pour le navigateur Google Chrome et comment l'utiliser pour changer d'arrière-plan pour le "Google.com ”moteur de recherche. Après avoir chargé l'extension sur Google Chrome, nous l'avons utilisé sur Google.com pour changer son arrière-plan.