Lehrreich

Anzeigen von Code in Wordpress


Wenn man ein Wordpress Blog zum Thema Computer hat – so wie wir – kommt es mal vor, dass man bestimmten HTML-Code in einem Artikel anzeigen möchte, ohne dass er ausgeführt wird.

Meistens hinterlegt man diesen einfach mit einer bestimmten Formatierung um ihn von dem restlichen Text abzuheben. Dies geschieht mit dem Tag „code“.

<code></code>

Dabei steht man nur vor dem Problem, dass der Inhalt in diesem Code-Tag weiterhin ausgeführt wird. Ein eingefügtes Bild würde also weiterhin angezeigt werden.

Um dies zu verhindern, gibt es einen sehr einfachen Trick. Ihr müsst die Sonderzeichen der HTML-Tags einfach auch als Sonderzeichen behandeln. Soll heißen, ihr gebt die Sonderzeichen in ISO 8859-1 Codierung ein.

Um jetzt beispielsweise den Quelltext eines Bildlinks zu posten, müsst ihr also in dem Quelltext eures Artikels folgendes stehen haben:
<code>&lt;a href="https://basic-tutorials.de"&gt;&lt;img title="Basic Tutorials" alt="Basic Tutorials – Hardware, Software & Gaming" src="https://www.exanted.com/wp-content/uploads/2021/06/Anzeigen-von-Code-in-Wordpress.jpg" width="468" height="60" /&gt;</code>

Ich habe in dem Fall nur die Zeichen „<“ und „>“ durch den ISO 8859-1 Code ersetzt. Dies sollte ausreichen um zu verhindern, dass der Code ausgeführt wird.

Wenn man die Sonderzeichen nicht angibt, würde folgendes herauskommen:

Hier zum Abschluss jedoch noch mal die wichtigsten Codes zum Anzeigen des Quelltextes in eurem Artikel:

< = &lt;
> = &gt;
/ = &#47;
] = &#93;
[ = &#91;
“ = &#34;
‚ = &#39;

Weitere Codes findet ihr im Selfhtml-Verzeichnis.

 

Ich hoffe dies hilft euch beim Posten von Tutorials zum Thema HTML, CSS etc. Solltet ihr Fragen haben, scheut euch nicht sie zu stellen!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Ähnliche Artikel

Schaltfläche "Zurück zum Anfang"