Wie WordPress Code-Schnipsel eingefügt werden können
Wenn Sie jede Art von Web-Entwicklung-Blog, ausführen, ob es über HTML, JavaScript oder CSS--Cascading Style Sheet--ist, wirst du ein Beispiel des Codes angezeigt werden müssen. WordPress haben keine native Element zum Einbetten Code; Stattdessen können Sie entweder das < Code > HTML-Tag oder eine erweiterte Plug-in. Das < Code > Tag funktioniert nicht immer mit Web-basierten Code, während ein WordPress-Plugin konzipiert ist, damit Sie Code in einem einfach zu lesenden Format anzeigen können.
Das Code-Tag
Das < Code >-Tag in HTML soll Bit-Code auf Ihrer Seite abheben zu machen. Alle Formatierungen ist aus dem Text, was es stattdessen in eine unformatierte Courier-Schrift entfernt. Was es im Flair fehlt, macht es sich für Einfachheit: Sie setzen den Code zwischen den öffnenden und schließen < Code > Tags. Leider funktioniert dies nicht auf Code, die sonst auf der Seite richtig anzeigen würde. Beispielsweise arbeitet < Code > zeigen ein Beispiel für ein CSS Element da CSS innerhalb eines Stylesheet nicht im Text einer Seite wie HTML verwendet wird; der Code heißt nicht alles allein auf der Seite. Wenn Sie versuchen, < Code > verwenden, um dem HTML-Code für ein Bild zu zeigen, es funktioniert nicht, weil der Bildcode, Valides HTML ist; Stattdessen erhalten Sie ein Bild, wo Sie wollten Code. Als solche ist < Code > für nicht-Code, z. B. Unix-Befehle und dergleichen wirklich am besten.
Google-Syntax-Highlighter für WordPress
Google Syntax Highlighter ist eine gut eingerichtete Möglichkeit, Code in Ihre Seite einzubinden: nicht nur ist es anders die Syntax Farbe, es wechselt die Hintergrundfarbe jeder Zeile und gibt jedem eine Zeilennummer, sodass des Codes leicht zu lesen und zu verstehen. Um die Code-Highlighter auf Ihrer Seite anzuzeigen, aktivieren Sie die Registerkarte "HTML" in der oberen rechten Ecke des Post-Editor. Sobald Sie den HTML-Modus eingeben, können Sie nicht lassen; gehen wir zurück zum "Zusammensetzen", wird der TextArea-Komponente entfernt. Setzen Ihre Code-Snippet in < Textarea > etwa so:
< Textarea Name = "Code" Class = "html" >< Img src="image.jpg" Width = "150" Height = "150" Alt = "Beispielbild" / >< / Textarea >
Das Name-Attribut sagt WordPress, dass dieses Sample Code ist. Die Klasse gibt, welche Art von Code es ist, so dass die Box die richtige Syntax verwendet. Beispielsweise, wenn Sie den Code aus JavaScript anzeigen waren, konnte Sie Klasse verwenden = "Js" oder Class = "Javascript".
Plum-Code-Box
Plum-Code-Box-Plugin für WordPress ist ein wenig mehr Anfänger freundlich. Einmal installiert, fügt Plum Feld ein Modul der Post-Seite, direkt unterhalb des Eintrageditor. Wählen Sie aus der Drop-Down-Menü welche Art von Code, die Sie verwenden, dann geben Sie den Code im Feld bereitgestellten. In der rechten Ecke der Box, sehen Sie "Shortcode: [Codebox 1]". Dies bedeutet, dass Sie "[Codebox 1]" einfügen, wo an die Box auf Ihrer Seite angezeigt werden soll. Benötigen Sie mehrere Kartons, wählen Sie die entsprechende Nummer aus "Anzahl von Boxen." Wie bei Google Syntax Highlighter, gibt verschiedene Attribute und Werte innerhalb der Box verschiedene Farben.
WP-Code Markierung
Möglicherweise die einfachste der codebasierte Plug-ins, WP Code hervorheben müssen nur Sie geben Sie den HTML-Bearbeitungsmodus auf Ihren Blog-Post und flankieren den Codeausschnitt mit dem Tag "< Pre >". Es erfordert keine zusätzliche Formatierung und Auszeichnungen; Es erkennt den Code einfach und Farben es entsprechend.