Hvordan kode en Chrome Extension

Lage din egen Google Chrome-utvidelsen lar deg designe det å gjøre hva du vil i stedet for å være avhengig av funksjonaliteten og ser på andres utvidelser. Google Chrome-utvidelser er små programmer som endrer nettleseren. Extensions er kodet på en rekke språk, for eksempel HTML, CSS og Javascript. En ny utvidelse krever en JSON manifest fil, et ikon og eventuelle andre HTML-filer for å håndtere utvidelsen atferd. Du laster da den nye utvidelsen gjennom utvidelser "Utvikler Mode" -vinduet.

Bruksanvisning

1 Åpne et tekstredigeringsprogram som Windows Notisblokk.

2 Opprett et manifest fil for utvidelse ved å legge til følgende kode på toppen av et tomt tekstdokument:

{

"Navn": "Extension Test 1.0",

"Versjon": "1.0",

"Description": "Min Extension test."

"tillatelser": [

"tabs", "http://*/*"

],

"Browser_action": {

"default_icon": "icon1.png"

"Popup": "test.html"

}

}

Den "browser_action" delen kan du plassere et ikon på verktøylinjen Google Chrome sammen med en valgfri "verktøytips", "badge" og "popup".

3 Lagre tekstfilen med navnet "manifest.json."

4 Opprett en ny tom tekstfil i editor.

5 Legg CSS for å håndtere utseendet på pop-up vindu ved å skrive inn følgende kode på toppen av den nye tekstfilen:

<Style>

kropp {

flow-x: hidden;

min-width: 400px;

}

img {

vertical-align: middle;

margin: 4px;

border: 1px solid black;

høyde: 50 piksler;

bredde: 50 piksler;

}

</ Style>

Legg noen ekstra funksjonalitet ved hjelp av støttede APIer som CSS, Javascript, JSON eller HTML5 for å kontrollere oppførselen til pop-up vindu. Eksempelet vil komme opp et lite vindu når du klikker på ikonet på verktøylinjen.

6 Lagre filen som "test.html" og plassere den i samme mappe som "manifest.json" fil.

7 Lag et ikon for forlengelse i en grafikk editor eller laste ned en online. Endre navnet på ikonet for å "icon1.png" og lagre den i samme mappe som "test.html" og "manifest.json" filer. Dette er ikonet du vil se i Google Chrome.

8 Åpne Google Chrome, klikker du på verktøyikonet, klikk på "Verktøy" og klikk "Extensions".

9 Klikk på symbolet "+" ved siden av "Utviklermodus" tekst, hvis det ikke allerede er utvidet.

10 Klikk på «Last upakket utvidelse," velg mappen med filene over på den og klikk "OK." Ikonet vises ved siden av adresselinjen, og informasjon om utvidelsen vil vises på utvidelser siden. Utvidelsen er nå lagt inn.