Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

page_action

Typ Object
Erforderlich Nein
Manifest-Version 2 oder höher
Beispiel
json
"page_action": {
  "default_icon": {
    "19": "button/geo-19.png",
    "38": "button/geo-38.png"
  },
  "default_title": "Whereami?",
  "default_popup": "popup/geo.html"
}

Eine Page-Action ist ein Symbol, das Ihre Erweiterung in der URL-Leiste des Browsers hinzufügt.

Ihre Erweiterung kann optional auch ein zugehöriges Popup bereitstellen, dessen Inhalt mit HTML, CSS und JavaScript spezifiziert wird.

Sie müssen diesen Schlüssel angeben, um eine Page-Action in Ihre Erweiterung einzubinden. Wenn angegeben, können Sie den Button programmgesteuert mithilfe der pageAction API manipulieren.

Wenn Sie ein Popup bereitstellen, wird das Popup geöffnet, wenn der Benutzer auf das Symbol klickt, und Ihr JavaScript, das im Popup ausgeführt wird, kann mit der Benutzerinteraktion umgehen. Wenn Sie kein Popup bereitstellen, wird ein Klickereignis an die Hintergrundskripte Ihrer Erweiterung gesendet, wenn der Benutzer auf das Symbol klickt.

Page-Actions sind ähnlich wie Browser-Actions, außer dass sie mit bestimmten Webseiten und nicht mit dem gesamten Browser verbunden sind. Wenn eine Aktion nur auf bestimmten Seiten relevant ist, sollten Sie eine Page-Action verwenden und sie nur auf relevanten Seiten anzeigen. Wenn eine Aktion für alle Seiten oder für den Browser selbst relevant ist, verwenden Sie eine Browser-Action.

Während Browser-Actions standardmäßig angezeigt werden, sind Page-Actions standardmäßig ausgeblendet. Sie können für einen bestimmten Tab durch den Aufruf von pageAction.show() angezeigt werden, indem die Tab-id übergeben wird. Sie können dieses Standardverhalten auch über die show_matches Eigenschaft ändern.

Syntax

Der page_action Schlüssel ist ein Objekt, das beliebige der drei optionalen Eigenschaften haben kann:

browser_style Optional Veraltet

Boolean. Standardmäßig false.

Warnung: Setzen Sie browser_style nicht auf true: Es wird ab Manifest V3, beginnend mit Firefox 118, nicht unterstützt. Siehe Manifest V3 Migration für browser_style.

In Firefox kann das Stylesheet unter chrome://browser/content/extension.css oder chrome://browser/content/extension-mac.css auf macOS eingesehen werden. Die latest-download Beispiel-Erweiterung verwendet browser_style in ihrem Popup.

default_icon Optional

Object oder String. Verwenden Sie dies, um ein Symbol für die Aktion anzugeben.

Es wird empfohlen, hier zwei Symbole bereitzustellen (19×19 Pixel und 38×38 Pixel) und sie in einem Objekt mit den Eigenschaften "19" und "38" anzugeben, wie folgt:

json
"default_icon": {
  "19": "geo-19.png",
  "38": "geo-38.png"
}

Wenn Sie dies tun, wählt der Browser die richtige Symbolgröße für die Pixeldichte des Bildschirms.

Sie können auch einfach einen String bereitstellen:

json
"default_icon": "geo.png"

Wenn Sie dies tun, wird das Symbol skaliert, um in die Symbolleiste zu passen, und kann verschwommen erscheinen.

Sie können ein SVG-Symbol verwenden. Sie können auch das Symbol an helle und dunkle Themes anpassen, indem Sie eine Medienabfrage auf prefers-color-scheme verwenden. Zum Beispiel:

css
#outside {
  fill: black;
}
#inside {
  fill: red;
}
@media (prefers-color-scheme: dark) {
  #outside {
    fill: white;
  }
  #inside {
    fill: black;
  }
}

Weitere Informationen finden Sie im themed-icons Beispiel.

Hinweis: Auf SVG-Symbole in dunklen UI-Themen wird ein impliziter CSS-Filter angewendet. Dieser Filter wird in Firefox Desktop Version 152 (Firefox Bug 2016509) deaktiviert. Sie können SVG-Symbole mit deaktiviertem CSS-Filter testen, indem Sie eine boolesche about:config-Präferenz namens extensions.webextensions.pageActionIconDarkModeFilter.enabled erstellen und auf false setzen. Der Filter ist standardmäßig in Firefox Desktop Nightly ab 149 deaktiviert.

default_popup Optional

String. Der Pfad zu einer HTML-Datei, die die Spezifikation des Popups enthält. Die HTML-Datei kann CSS- und JavaScript-Dateien mittels <link> und <script> Elemente einbinden, genau wie eine normale Webseite.

Setzen Sie jedoch keine eingebetteten Codes in <script> ein, da Sie sonst einen Content Violation Policy-Fehler erhalten. Stattdessen muss <script> das src Attribut verwenden, um eine separate Skriptdatei zu laden.

Im Gegensatz zu einer normalen Webseite kann auf JavaScript, das im Popup ausgeführt wird, auf alle WebExtension APIs zugegriffen werden (vorausgesetzt, die Erweiterung hat die entsprechenden Berechtigungen). Dies ist eine lokalisierbare Eigenschaft.

default_title Optional

String. Tooltip für das Symbol, angezeigt, wenn der Benutzer den Mauszeiger darüber bewegt. Dies ist eine lokalisierbare Eigenschaft.

hide_matches Optional

Array von MatchPattern außer <all_urls>. Versteckt die Page-Action standardmäßig für Seiten, deren URLs mit einem der angegebenen Match-Patterns übereinstimmen.

Beachten Sie, dass Page-Actions standardmäßig immer versteckt sind, es sei denn, show_matches wird angegeben. Daher macht es nur Sinn, diese Eigenschaft einzuschließen, wenn auch show_matches angegeben wird, und sie wird die Muster in show_matches überschreiben.

Beispielsweise könnte ein Wert wie folgt aussehen:

json
"page_action": {
  "show_matches": ["https://*.mozilla.org/*"],
  "hide_matches": ["https://developer.mozilla.org/*"]
}

Dies zeigt die Page-Action standardmäßig für alle HTTPS-URLs unter der Domain "mozilla.org" an, außer für Seiten unter "developer.mozilla.org".

show_matches Optional

Array von MatchPattern. Zeigt die Page-Action standardmäßig für Seiten an, deren URLs mit einem der angegebenen Muster übereinstimmen. Siehe auch hide_matches.

pinned Optional Veraltet

Boolean. Optional. Standardwert ist true. Steuert, ob die Page-Action standardmäßig in der Adressleiste erscheinen sollte, wenn der Benutzer die Erweiterung installiert. Diese Eigenschaft wird seit Firefox 89 nicht mehr unterstützt.

Beispiel

json
"page_action": {
  "default_icon": {
    "19": "button/geo-19.png",
    "38": "button/geo-38.png"
  }
}

Eine Page-Action mit nur einem Symbol, das in 2 verschiedenen Größen angegeben ist. Die Hintergrundskripte der Erweiterung können Klickereignisse empfangen, wenn der Benutzer auf das Symbol klickt, mit einem Code wie diesem:

js
browser.pageAction.onClicked.addListener(handleClick);
json
"page_action": {
  "default_icon": {
    "19": "button/geo-19.png",
    "38": "button/geo-38.png"
  },
  "default_title": "Whereami?",
  "default_popup": "popup/geo.html"
}

Eine Page-Action mit einem Symbol, einem Titel und einem Popup. Das Popup wird angezeigt, wenn der Benutzer auf das Symbol klickt.

Browser-Kompatibilität

Siehe auch