ariadnadoccat.com

Entwickler und Programmierer verwenden seit langem Texteditoren als primäre Methode zur Eingabe von Computercode. Einige Entwicklungsumgebungen haben ihre eigenen integrierten Editoren, aber Entwickler bevorzugen normalerweise einen Editor und bleiben bei diesem Programm. Ein Grund dafür ist, dass ein guter Coding-Editor Syntax-Highlighting enthält, eine Funktion, die Quellcode formatiert und Schlüsselwörtern und Konstrukten innerhalb des Codes Schriftarten und Farben zuweist, um die Lesbarkeit zu erleichtern. Texteditoren wie Notepad ++, die in diesem Tech Junkie-Leitfaden behandelt werden, werden aus diesem Grund von Entwicklern bevorzugt. Die meisten Entwickler betrachten Google Docs trotz seiner großartigen Arbeitsgruppenfunktionen und der Cloud-Integration nicht als potenziellen Codierungseditor, da es keine integrierten Optionen zur Syntaxhervorhebung enthält.

Sie können jedoch dem Code in Google Doc-Dokumenten Syntax-Highlighting hinzufügen. Tatsächlich gibt es zumindest einige Add-Ons für Docs, mit denen Sie verschiedene Programmier- und Auszeichnungssprachen mit Syntax-Highlighting formatieren können. Es gibt auch zahlreiche Web-Apps, mit denen Sie Quellcode mit Hervorhebung in Google Docs einfügen können. In diesem Artikel zeige ich Ihnen, wie Sie Ihren Docs-Dokumenten eine Hervorhebung der Quellcode-Syntax hinzufügen.

Quellcode mit Code Pretty formatieren

Code Pretty ist ein Add-on für Google Docs, das dem ausgewählten Code automatisch Hervorhebungen hinzufügt. Code Pretty enthält nicht viele Einstellungen zum Anpassen der Syntaxformatierung, fügt Docs jedoch eine praktische Option zur Syntaxhervorhebung hinzu. Sie können CP zu Docs hinzufügen, indem Sie auf klicken NSee Schaltfläche auf dieser Seite. Drücken Sie dann die Erlauben Schaltfläche, um die Berechtigungen für das Add-On zu bestätigen.

Öffnen Sie als Nächstes Docs in Ihrem Browser. und klicken Sie auf die Registerkarte Add-ons, um das Menü zu öffnen. Dieses Menü enthält jetzt das Code Pretty-Add-on. Um Ihnen ein Beispiel dafür zu geben, wie dieses Add-On die Syntax hervorhebt, wählen Sie den folgenden JavaScript-Beispielcode aus und kopieren Sie ihn in ein Docs-Dokument, indem Sie Strg + C drücken.

Was kann JavaScript tun?

JavaScript kann HTML-Attribute ändern.

In diesem Fall ändert JavaScript das src-Attribut (source) eines Bildes.

Mach das Licht an

Mach das Licht aus

Fügen Sie dieses JavaScript-Beispiel in Docs ein, indem Sie Strg + V drücken. Wählen Sie dann den Code im Textverarbeitungsprogramm mit dem Cursor aus. Klicken Add-ons >Code Hübsch und wählen Sie die Formatauswahl Option aus dem Untermenü. Dadurch wird das JavaScript wie im Snapshot direkt unten gezeigt formatiert.

Wie bereits erwähnt, enthält CP nicht viele Einstellungen für das Syntax-Highlighting. Sie können jedoch die Schriftgröße des hervorgehobenen Codes anpassen, indem Sie auf klicken Add-ons >Code Hübsch und Einstellungen. Dadurch wird die direkt darunter angezeigte Seitenleiste geöffnet. Anschließend können Sie dort eine alternative Standardschriftgröße für den markierten Code auswählen.

Quellcode mit Codeblöcken formatieren

Code Blocks ist ein alternatives Add-On zu CP, das Sie zu Docs hinzufügen können. Dies ist eigentlich ein etwas besseres Add-On zum Hervorheben der Syntax, da es zahlreiche Hervorhebungsthemen enthält. Drücken Sie die Kostenlos Schaltfläche auf dieser Website-Seite, um Codeblöcke zu Docs hinzuzufügen.

Wenn Sie Codeblöcke installiert haben, öffnen Sie Docs und kopieren Sie den gleichen JavaScript-Code wie zuvor in das Textverarbeitungsprogramm. Klicken Add-ons >Codeblöcke und wählen Sie Start um die in der Aufnahme direkt darunter gezeigte Seitenleiste zu öffnen.

Wählen Sie mit dem Cursor nur den JavaScript-Text aus. Stellen Sie sicher, dass Sie keinen leeren Dokumentbereich über oder unter dem Code auswählen. Auswählen JavaScript aus dem ersten Dropdown-Menü. Dann können Sie auch ein Thema aus dem Thema Dropdown-Menü. Drücken Sie die Format Schaltfläche, um die Syntaxhervorhebung zum Code hinzuzufügen, wie unten gezeigt. Jetzt ist der JavaScript-Text mit seinen hervorgehobenen Markup-Tags viel klarer.

Markierten Quellcode kopieren und in Google Docs einfügen

Abgesehen von Code Blocks und Code Pretty Docs können Sie auch Syntax-Highlighter-Web-Apps verwenden, um Quellcode zu formatieren. Anschließend können Sie den markierten Quellcode aus einer Web-App kopieren und wieder in Ihr Docs-Dokument einfügen. Textmate ist eine Syntax-Highlighter-Web-App, die zahlreiche Programmier- und Auszeichnungssprachen formatiert.

Klicken Sie auf diesen Hyperlink, um Textmate zu öffnen. Kopieren Sie dann den in diesem Beitrag enthaltenen JavaScript-Text und fügen Sie ihn mit den Hotkeys Strg + C und Strg + V in das Quellcodefeld von Textmate ein. Auswählen JavaScript aus dem Dropdown-Menü Sprache. Wählen Sie ein Syntaxhervorhebungsthema aus dem Dropdown-Menü Thema aus. Drücken Sie die Markieren Schaltfläche, um eine Vorschau der Formatierung des Quellcodes zu erhalten, wie im Schnappschuss direkt darunter gezeigt.

Wählen Sie als Nächstes das markierte JavaScript in der Vorschau mit dem Cursor aus und drücken Sie Strg + C. Fügen Sie den markierten Code in Google Docs ein, indem Sie Strg + V drücken. Dadurch wird der markierte JavaScript-Quellcode wie direkt unten gezeigt zum Docs-Dokument hinzugefügt.

Sie benötigen also keinen Desktop-Texteditor, um Syntax-Highlighting zu Software und Website-Code hinzuzufügen. Stattdessen können Sie Syntaxcode in Docs-Dokumenten mit den Erweiterungen Code Pretty und Code Blocks hervorheben. Alternativ können Sie Ihren Code kopieren und in die Textmate-Web-App einfügen, um den Quellcode mit Hervorhebung in Google Docs einzufügen.

Haben Sie andere Möglichkeiten, Google Docs Syntaxformatierungen hinzuzufügen? Teilen Sie sie unten mit uns!