'Dins de la nostra vida actual, tenim més ganes d'utilitzar les aplicacions de xarxes socials i el motor de cerca de Google per als nostres propòsits d'entreteniment i cerca, és a dir, investigar algun tema educatiu a través del motor de cerca 'Google' i també obtenir coneixements generals. Per utilitzar el cercador de Google per cercar alguna cosa, hem de tenir algun navegador ja instal·lat als nostres telèfons mòbils, ordinadors portàtils o ordinadors personals. Un dels navegadors més utilitzats i eficients del segle actual és el navegador 'Google Chrome', que va oferir moltes bones funcionalitats juntament amb la utilitat de l'extensió. L''Extensió' és el connector que es troba a qualsevol navegador per restringir o permetre llocs web i diferents funcions. Aquestes extensions no solen venir incorporades; heu d'afegir cada extensió al vostre navegador per separat sempre que sigui necessari. Si sou una mica expert en tecnologia, potser coneixeu l'ús dels fitxers JSON de manifest per crear i afegir una extensió en uns quants passos. Per tant, aquest article tractarà tots aquests passos per crear una nova extensió al navegador Google Chrome.
Abans de fer una ullada al mètode per crear una extensió, heu d'assegurar-vos que el vostre navegador Google Chrome ja s'ha iniciat i que el motor de cerca 'Google' no conté cap fons. Podeu veure que la imatge adjunta a continuació no té fons per al motor de cerca 'Google.com', és a dir, només fons blanc.
Afegeix una carpeta d'extensió
Obriu la vostra eina Visual Studio Code ràpidament des de les aplicacions del vostre sistema Windows. Pot trigar fins a 1 minut a obrir correctament el codi Visual Studio i habilitar-lo per al nostre ús. Després que s'hagi iniciat correctament i estigui llest per al seu ús, hi hem afegit la carpeta ja generada 'Extensió' mitjançant la llista de menú 'Fitxer' a la barra de tasques superior que es mostra a continuació. Després de crear la carpeta 'Extensió', hem afegit una altra carpeta anomenada 'imatge' que conté les imatges que s'utilitzaran com a icona per a l'extensió al navegador. Juntament amb això, hem afegit un fitxer 'manifest.json' i un fitxer javascript anomenat 'script.js' per crear una nova extensió i afegir-la al navegador. Comencem des del fitxer manifest.json fent-hi doble clic per començar a treballar en JSON per crear i utilitzar una extensió per canviar el fons de 'Google'.
Crea un fitxer de manifest
Dins del fitxer manifest.json, hauríeu d'afegir el codi 'JSON' que es mostra a continuació. Aquest codi és l'script de configuració real per crear i afegir una extensió al nostre navegador Google Chrome. Aquest codi JSON s'ha iniciat amb la inicialització de la versió del manifest variable com a '2' i el nom d'una extensió a crear, és a dir, 'Canvia el fons'. Després d'això, hem afegit la descripció breu de la nostra extensió dins de la variable 'descripció'.
Juntament amb això, hem afegit la versió d'una extensió com a '1.0'. Després de crear totes les configuracions bàsiques per a l''extensió', hem d'afegir el camí a la icona de la imatge per utilitzar-la com a icona per a les extensions. La variable 'navegador' s'ha definit per establir la icona d'extensió per a la barra de tasques superior del navegador Google Chrome, és a dir, on es mostren totes les extensions després d'habilitar-les per a un ús futur per a llocs determinats o tots. Després d'això, hem afegit el camí a tres fitxers d'imatge de diferents mides perquè el navegador pugui utilitzar fitxers diferents cada vegada.
Juntament amb això, s'ha utilitzat la variable 'page_action' per mostrar quina imatge es mostrarà després de fer clic a la icona 'extensions' de la barra de tasques superior de Google Chrome. La variable 'Default_icon' s'ha utilitzat dins d'ella, juntament amb els seus tres valors de camí diferents per a les imatges que s'utilitzen com a icones en cada recàrrega. S'utilitzen tres fitxers d'imatge diferents per a aquest propòsit. L'última variable content_scripts té un total de 2 variables noves, és a dir, coincidències i CSS. La variable 'coincidències' conté el camí al lloc web que cal modificar després de crear l'ús d'aquesta nova extensió. Juntament amb això, la variable 'CSS' conté el nom d'un fitxer CSS que s'utilitzarà per a l'estil de Google.com després de sol·licitar l'extensió, és a dir, l'estil de Google.com després de cada recàrrega en habilitar l'extensió. Ara que aquest codi està complet i llest per utilitzar-lo, només cal que el deseu ràpidament i aneu cap al fitxer 'main.css'.
Dins del fitxer CSS main.css, hem anat afegint estils per a la nostra extensió de fitxer de manifest que es crearà. L'estil s'aplicaria mitjançant l'etiqueta html 'body', és a dir, que s'aplicaria a l'àrea completa 'body' del fitxer de manifest. Hem estat configurant el nou fons per a Google.com utilitzant l''URL' d'un fitxer d'imatge del motor de cerca. Ara, deseu el vostre codi abans de res.
Després de completar els codis requerits, és a dir, el fitxer manifest.json i main.css, hem d'obrir la utilitat Extensions al navegador Google Chrome mitjançant l'URL chrome://extensions” a la nova pestanya. S'obre l'àrea de serveis d'Extensions. Des del seu mode de desenvolupador, heu de carregar la carpeta 'Extensió' descomprimida del vostre sistema local per convertir-la en una extensió mitjançant el botó 'carrega sense empaquetar' que es mostra a la imatge següent. L'extensió s'ha afegit de manera eficaç al navegador Chrome, tal com es mostra. Elimineu els errors perquè funcioni completament.
Des de la icona 'extensió', trieu l'extensió 'Canvia el fons' per mostrar-la a la barra de tasques, és a dir, l'extensió de la icona 'C'.
Després de tornar a carregar Google.com, el seu fons es va actualitzar amb aquesta extensió.
Conclusió
Partint de l'explicació de l'ús dels navegadors al sistema Windows, també hem parlat de la importància de les extensions en qualsevol navegador. Després de la breu explicació de les extensions, hem explicat el mètode per utilitzar el fitxer JSON de manifest per crear una extensió per al navegador Google Chrome i com utilitzar-lo per canviar el fons del motor de cerca 'Google.com'. Després de carregar l'extensió a Google Chrome, l'hem estat utilitzant a Google.com per canviar-ne el fons.