Ein Design ist eine spezielle Art von Erweiterung, mit der das Aussehen des Browsers geändert wird. Designs werden wie normale Erweiterungen gepackt, enthalten jedoch keinen JavaScript- oder HTML-Code.
Designs werden auf dieselbe Weise wie eine Erweiterung in den Chrome Web Store hochgeladen. Während des Uploads wirst du aufgefordert, eine Kategorie auszuwählen. Eine Liste der Designkategorien finden Sie in der Dokumentation zum Chrome Web Store unter Best Practices.
Im Chrome Web Store finden Sie eine Reihe von Designs, die Sie ausprobieren können.
Manifest
Hier sehen Sie eine Beispieldatei manifest.json
für ein Design:
{
"manifest_version": 3,
"version": "2.6",
"name": "camo theme",
"theme": {
"images" : {
"theme_frame" : "images/theme_frame_camo.png",
"theme_frame_overlay" : "images/theme_frame_stripe.png",
"theme_toolbar" : "images/theme_toolbar_camo.png",
"theme_ntp_background" : "images/theme_ntp_background_norepeat.png",
"theme_ntp_attribution" : "images/attribution.png"
},
"colors" : {
"frame" : [71, 105, 91],
"toolbar" : [207, 221, 192],
"ntp_text" : [20, 40, 0],
"ntp_link" : [36, 70, 0],
"ntp_section" : [207, 221, 192],
"button_background" : [255, 255, 255]
},
"tints" : {
"buttons" : [0.33, 0.5, 0.47]
},
"properties" : {
"ntp_background_alignment" : "bottom"
}
}
}
Farben
Farben werden im RGB-Format dargestellt. Die Strings, die Sie im Feld „colors“ verwenden können, finden Sie unter kOverwritableColorTable
.
bilder
Für Bildressourcen werden Pfade verwendet, die sich auf das Stammverzeichnis der Erweiterung beziehen. Alle Bilder, die durch die Strings in kPersistingImages
angegeben werden, können überschrieben werden. Alle Bilder müssen im PNG-Format gespeichert sein, damit sie nicht richtig gerendert werden.
Properties
In diesem Feld können Sie Eigenschaften wie Hintergrundausrichtung, Hintergrundwiederholung und ein alternatives Logo angeben. Informationen zu den Attributen und möglichen Werten finden Sie unter kDisplayProperties
.
Tönungen
Sie können Tönungen angeben, die auf Teile der UI wie Schaltflächen, Frame und Hintergrund angewendet werden sollen. Google Chrome unterstützt Tönungen und keine Bilder, da Bilder nicht plattformübergreifend funktionieren und beim Hinzufügen neuer Schaltflächen sehr mühsam sind. Die Strings, die Sie im Feld „Töne“ verwenden können, finden Sie unter kTintTable
.
Die Färbungen haben das HSL-Format (Hue-Saturation-Lightness) mit Gleitkommazahlen im Bereich 0 bis 1, 0:
- Farbton ist ein absoluter Wert, wobei 0 und 1 rot sind.
- Die Sättigung bezieht sich auf das aktuell bereitgestellten Bild. 0, 5 bedeutet keine Änderung, 0 ist vollständig entsättigt und 1 volle Sättigung.
- Die Helligkeit ist ebenfalls relativ, d. h. 0, 5 steht für keine Änderung, 0 bedeutet alle Pixel schwarz und 1 bedeutet alle Pixel weiß.
Alternativ können Sie -1.0
für jeden der HSL-Werte verwenden, um keine Änderung anzugeben.