Syntax-highlighting Code Block (with Server-side Rendering)

Beschreibung

Das Plugin erweitert den Code-Block im WordPress Core mit Syntax-Hervorhebung, das auf dem Server gerendert wird. Dadurch, dass die Syntax-Hervorhebung auf dem Server durchgeführt wird, gibt es keinen Grund, JavaScript dafür im Frontend bereitzustellen (z. B. Highlight.js oder Prism.js). Außerdem stellt das sicher, dass es kein Aufblitzen von Code ohne Hervorhebung (FOUC?) gibt. Die Reduzierung von Skripten im Frontend verbessert die Frontend-Leistung und es erlaubt die richtige Darstellung des Codes mit Syntax-Hervorhebung auf AMP-Seiten mit dem offiziellen AMP-Plugin (engl.) (siehe auch ampproject/amp-wp#972 (engl.)).

Der erweiterte Code-Block benutzt eine automatische Erkennung für die Sprache, die im Block benutzt wird, um die Syntax-Hervorhebung hinzuzufügen. Du kannst aber die Sprache im Block-Inspektor überschreiben. (Es gibt aktuell keine Syntax-Hervorhebung des Code-Blocks im Editor.) Das Plugin unterstützt alle 185 Programmiersprachen (engl.), die highlight.php (engl.) unterstützt (welches eine Portierung von highlight.js (engl.) ist).

Any one of 89 styles may be enqueued that highlight.php/highlight.js provide. To change the default style, you may do so by picking a theme via Customizer in the Colors section. To override the default style programmatically, use the syntax_highlighting_code_block_style to supply the one of the style names, for example github:

add_filter(
    'syntax_highlighting_code_block_style',
    function() {
        return 'github';
    }
);

When a filter is provided, the theme selector in Customizer is automatically disabled.

Dieses Plugin wird auf GitHub entwickelt (engl.). Siehe die Liste der aktuellen Probleme (engl.) des Plugins. Bitte zögere nicht, weitere Probleme oder Anfragen zu melden, auf die du stößt. Pull requests (engl.) sind willkommen, um beim Erweitern zu helfen.

Danksagungen

Dies ist ein Fork des Code-Syntax-Blocks (engl.) von Marcus Kazmierczak (engl.) (mkaz), welcher auch auf de.WordPress.org verfügbar ist. Copyright (c) 2018 Marcus Kazmierczak. Lizenziert unter GPL 2.0 oder später.

highlight.php (engl.) ist unter der BSD 3-Clause-Lizenz veröffentlicht. Copyright © 2006-2013, Ivan Sagalaev (maniac@softwaremaniacs.org), highlight.js (ursprünglicher Autor). Copyright © 2013, Geert Bergman (geert@scrivo.nl), highlight.php

Screenshots

  • Stelle Inhalte wie gewohnt im Code-Block bereit und überschreibe optional die automatisch erkannte Sprache.
  • Der Code-Block wird mit Syntax-Hervorhebung im Frontend ohne irgendein eingebundenes JavaScript dargestellt.

Blöcke

Dieses Plugin unterstützt 1 Block.

core/code
Syntax-highlighting Code Block (with Server-side Rendering)

Rezensionen

3. November 2019
Plug and play. The language auto detection is awesome and it works with Gutenberg. Thank you for the great plugin!
30. August 2019
The best plugin for highlighting code in the block editor Gutenberg. Its main advantage: no need to enqueue any JavaScript. The only drawback is the long plugin name. Great!
1. August 2019
Just installed this on my site and started writing up a new post. I can't get over how well it works. Thanks, Weston!
31. Juli 2019
Thanks for publishing this plugin, Weston! I just installed it on my website and it works great. No configuration needed. My coding tutorials look so much better now 🙂
Lies alle 5 Rezensionen

Mitwirkende & Entwickler

„Syntax-highlighting Code Block (with Server-side Rendering)“ ist Open-Source-Software. Folgende Menschen haben an diesem Plugin mitgewirkt:

Mitwirkende

„Syntax-highlighting Code Block (with Server-side Rendering)“ wurde in 3 Sprachen übersetzt. Danke an die Übersetzerinnen und Übersetzer für ihre Mitwirkung.

Übersetze „Syntax-highlighting Code Block (with Server-side Rendering)“ in deine Sprache.

Interessiert an der Entwicklung?

Durchstöbere den Code, sieh dir das SVN Repository an oder abonniere das Entwicklungsprotokoll per RSS.

Änderungsprotokoll

Bitte schaue auf die Release-Seite auf GitHub (engl.) für das Änderungsprotokoll des Plugins.