Entwicklertools anpassen

Sofia Emelianova
Sofia Emelianova

Auf dieser Seite werden die Möglichkeiten beschrieben, wie Sie die Chrome-Entwicklertools anpassen können.

Einstellungen

Unter Einstellungen > Einstellungen finden Sie viele Optionen zur Anpassung der DevTools.

Weitere Informationen finden Sie unter Einstellungen öffnen und Einstellungen.

Dunkles Design

Sie können das dunkle Design in den Einstellungen oder im Befehlsmenü aktivieren.

Das dunkle Design.

  1. Öffnen Sie das Befehlsmenü.
  2. Geben Sie dark ein, wählen Sie den Befehl Zum dunklen Design wechseln aus und drücken Sie die Eingabetaste, um den Befehl auszuführen.

    Der Befehl für das dunkle Design.

  3. Alternativ können Sie das Design auch unter Einstellungen > Einstellungen > Darstellung > Designs festlegen.

Dynamisches Design

Die Entwicklertools können das Farbschema von Chrome automatisch übernehmen.

So legen Sie ein Design fest:

  1. Öffnen Sie einen neuen Tab und klicken Sie rechts unten auf Chrome anpassen.
  2. Wählen Sie unter Darstellung über Designs ändern ein Design oder eine Farbvorlage aus.

Die Entwicklertools entsprechen dem in „Darstellung“ ausgewählten Farbdesign.

Wenn Sie die dynamische Themenauswahl deaktivieren möchten, entfernen Sie das Häkchen bei  Einstellungen > Einstellungen > Darstellung > Chrome-Farbschema verwenden und laden Sie die DevTools neu.

Leiste

Der Schieberegler enthält viele versteckte Funktionen.

Drücken Sie die Esc-Taste, um die Leiste zu öffnen oder zu schließen.

Die Schublade.

Klicken Sie auf das Weitere Tools, um andere Tabs im Schieberegler zu öffnen.

Die Schaltfläche „Weitere Tools“ zum Öffnen weiterer Leisten-Tabs

Entwicklertools-Placement ändern

Standardmäßig sind die Entwicklertools rechts neben dem Darstellungsbereich angedockt. Sie können die DevTools auch unten oder links andocken oder in einem separaten Fenster anzeigen.

Sie haben zwei Möglichkeiten, die Platzierung der DevTools zu ändern:

  • Hauptmenü: Öffnen Sie Anpassung und Steuerung der Entwicklertools und klicken Sie auf:
    • In separatem Fenster anzeigen
    • Dock nach links
    • Unten andocken
    • Dock to right
  • Befehlsmenü:

    1. Öffnen Sie das Befehlsmenü.
    2. Geben Sie dock ein und wählen Sie eine der vorgeschlagenen Optionen aus: Unten, links, rechts andocken, andocken aufheben oder letzte Andockposition wiederherstellen.

Vorgeschlagene Andockoption im Befehlsmenü

Wenn Sie die Option Letzte Dock-Position wiederherstellen mit einer Tastenkombination aktivieren oder deaktivieren möchten, drücken Sie:

  • Unter Linux oder Windows: Strg + Umschalttaste + D
  • Unter macOS: Befehlstaste + Umschalt + D

Steuerfelder, Tabs und Bereiche neu anordnen

Wenn Sie die Reihenfolge ändern möchten, klicken Sie auf eine der folgenden Optionen und ziehen Sie sie nach links oder rechts:

  • Bereiche oben in den Entwicklertools
  • Bereiche im Bereich Elemente, z. B. Styles, Computed oder Layout.
  • Bereiche im Bereich Quellen, z. B. Seite, Arbeitsbereich und Überschreibungen
  • Drawer unten in den Entwicklertools.

Außerdem können Sie Bereiche und Tabs nach oben und unten in die Seitenleiste verschieben. Klicken Sie dazu mit der rechten Maustaste auf das Steuerfeld oder den Tab und wählen Sie im Drop-down-Menü An den Anfang verschieben oder Ans Ende verschieben aus.

Die benutzerdefinierte Tab-Reihenfolge bleibt über DevTools-Sitzungen hinweg erhalten.

Steuerfeldlayout

Standardmäßig wird das Steuerfeldlayout in den DevTools automatisch an die Fenstergröße angepasst. Sie können die automatische Neuanordnung deaktivieren. Rufen Sie die Einstellungen > Einstellungen > Darstellung auf und ändern Sie das Steuerfeld-Layout nach Ihren Wünschen.

Der Bereich „Stile“ im Steuerfeld Elemente wird beispielsweise bei kleiner Bildschirmgröße von der Seite nach unten verschoben. Wenn der Stilbereich immer an der Seite bleiben soll, ändern Sie das Layout des Bereichs in vertikal.

Steuerfeldlayout ändern

Sprache der DevTools-Benutzeroberfläche ändern

Sie finden sie in den Einstellungen > Einstellungen > Darstellung > Sprache.

Sie können die Sprache in den Einstellungen ändern.

Synchronisierungseinstellungen

Sie können Ihre DevTools-Einstellungen auf mehreren Geräten synchronisieren.

Aktivieren Sie zuerst die Chrome-Synchronisierung, um die Synchronisierung zu aktivieren. Nach der Aktivierung werden Ihre DevTools-Einstellungen standardmäßig synchronisiert.

Chrome-Profilsynchronisierung

Sie können die Synchronisierung der DevTools-Einstellungen separat aktivieren oder deaktivieren. Klicken Sie dazu auf das Dreistrich-Menü  Einstellungen > Synchronisieren > Synchronisierungseinstellungen aktivieren.

Synchronisierungseinstellungen für DevTools

In DevTools werden die meisten Einstellungen synchronisiert, mit Ausnahme derjenigen auf den Tabs Workspace, Experiments und Devices sowie einiger anderer allgemeiner Einstellungen. Der Status des Kästchens Synchronisierung der Einstellungen aktivieren wird ebenfalls zwischen Geräten synchronisiert.

Beispielsweise werden die folgenden Darstellungseinstellungen synchronisiert, damit Sie auf allen Geräten dieselben Einstellungen verwenden können und sie nicht noch einmal definieren müssen.

Darstellungseinstellungen

Die Einstellung für das Dock wird jedoch nicht synchronisiert, da Entwickler beim Debuggen an verschiedenen Standorten unterschiedliche Dock-Einstellungen haben.

Das Dock.

Tastenkombinationen anpassen

Siehe Einstellungen > Verknüpfungen.

Tests aktivieren

Weitere Informationen finden Sie unter Einstellungen > Tests.