Code in der Codeansicht bearbeiten

Die Codeansicht ist der Anzeigemodus, in dem Sie den Code mit dem integrierten Code-Editor von Google Web Designer aufrufen und bearbeiten können. Neben HTML-Dateien lassen sich auch CSS-, JavaScript- und XML-Dateien bearbeiten.

Nachdem Sie Web Designer-Quelldateien für Anzeigen und HTML-Seiten geöffnet haben, können Sie zwischen der Codeansicht und der Designansicht wechseln. Die Änderungen, die Sie in der Codeansicht vornehmen, werden in der Designansicht angezeigt. So können Sie sofort testen, wie sich Änderungen in Ihrem Code auf Ihre Designs auswirken.

Zur Codeansicht wechseln:

Klicken Sie rechts oben im Fenster auf die Schaltfläche Codeansicht .

Die Steuerfelder der Designansicht und einige Menübefehle sind in der Codeansicht nicht verfügbar.

Einstellungen für Codeansicht

Sie können die Formatierungs- und Editor-Optionen für die Codeansicht in Ihren Einstellungen anpassen, einschließlich der folgenden Einstellungen:

  • Farbdesign
  • Tastenbelegung
  • Zeilenumbruch
  • Einzugsgröße
  • Automatisches Einrücken
  • Automatische Vervollständigung
  • Leerzeichen für Tabulatoren verwenden
  • Minimap-Sichtbarkeit

Eine vollständige Liste der Optionen finden Sie auf der Seite zum Festlegen von Einstellungen.

Code schreiben

Die folgenden Funktionen erleichtern das Schreiben und Bearbeiten von Code. Außerdem erfahren Sie in diesem Abschnitt, wie Sie in der Codeansicht innerhalb Ihres Dokuments oder zwischen Dateien navigieren.

Zoom

Mit den Steuerelementen für den Zoom (- und +) rechts auf der Fußzeile können Sie die Codetextgröße ändern. Die festgelegte Zoomstufe wird von Google Web Designer standardmäßig gespeichert.

Codeblöcke minimieren

Verwenden Sie die Pfeile am linken Rand, um Codeblöcke zu minimieren und zu maximieren.

Einzug

Neue Zeilen werden in Google Web Designer bei der Eingabe automatisch eingerückt. Wenn ein Codeblock nicht richtig eingerückt ist, z. B. wenn Sie Code aus einer anderen Datei kopiert und eingefügt haben, können Sie den Code auswählen und die Tabulatortaste drücken, um ihn einzurücken.

Automatische Codevervollständigung

Google Web Designer zeigt während der Eingabe standardmäßig Vorschläge an. Wenn Sie diese Einstellung deaktiviert haben, können Sie Strg + Leertaste drücken, um die automatische Vervollständigung auszulösen.

Sprachmodus

Bei Google Web Designer basiert die Syntaxfärbung und die automatischen Vervollständigung von Code auf der Dateierweiterung. Um den Standardsprachmodus zu überschreiben, klicken Sie in der Fußzeile auf die aktuelle Sprache und wählen Sie im Pop-up-Menü die neue Sprache aus.

GreenSock-JavaScript-Bibliotheken

Sie können beliebte Animationstools von GreenSock direkt über einen Menübefehl hinzufügen, sofern Ihre Umgebung auf Display & Video 360 festgelegt oder Ihr Projekt eine HTML-Seite ist.

GreenSock-Bibliothek einfügen:

  1. Achten Sie darauf, dass Sie sich in der Codeansicht befinden.
  2. Wählen Sie im Menü Datei die Option JS-Bibliothek hinzufügen > GreenSock aus.
  3. Wählen Sie eine Bibliothek in der Liste aus.

Wiederholen Sie diesen Vorgang, um mehrere Bibliotheken hinzuzufügen.

Unterschiede zum veröffentlichten Code

Die Codeansicht spiegelt nicht unbedingt wider, wie der Code aussieht, wenn Sie das Dokument veröffentlichen. Der Code, den Sie beim Erstellen des Dokuments sehen, kann komprimiert sein, um Platz zu sparen. Mancher Code wird in der Codeansicht möglicherweise überhaupt nicht angezeigt, ist aber in der veröffentlichten Datei enthalten.

War das hilfreich?
Wie können wir die Seite verbessern?

Benötigen Sie weitere Hilfe?

Anmelden, um weitere Supportoptionen zu erhalten und das Problem schnell zu beheben

Suche
Suche löschen
Suche schließen
Google-Apps
Hauptmenü
Suchen in der Hilfe
true
5050422
false