esit/enlighter

Diese Erweiterung für das Open Source CMS Contao bindet das Script Enlighter.js ein und ermöglicht es, Quelltext übersichtlich darzustellen. Im Gegensätz zum eingebauten highlight.js, bietet Enlighter.js Zeilennummern, Zeilenhervorhebung, das Kopieren des Quelltextes, verschiedene Themes und viele m

2.0.3 2023-03-28 06:20 UTC

Requires

• php: ~8.0
• contao/core-bundle: ~4.9|^5.1

LGPL-3.0-or-later

• Patrick Froch

README

Beschreibung

Diese Erweiterung für das Open Source CMS Contao bindet das Script Enlighter.js ein und ermöglicht es, Quelltext übersichtlich darzustellen. Im Gegensatz zum eingebauten highlight.js, bietet Enlighter.js u. a. Zeilennummern, Zeilenhervorhebung, das Kopieren des Quelltextes, verschiedene Themes und viele mehr. Das Highlightning wird global für alle Code-Tags auf der entsprechenden Seite eingestellt. Details sind unter Einrichtung weiter unten zu finden.

Autor

e@sy Solutions IT: Patrick Froch [e-mail]

Lizenz

Die Software wird unter LGPL veröffentlicht. Details sind in der Datei LICENSE zu finden.

Voraussetzungen

• php: ~8.0
• contao/core-bundle: ~4.9|^5.1

Installation

Einfach im Contao Manager nach esit/enlighter suchen und installieren.

Einrichtung

1. Modul anlegen

Damit das Syntaxhighlightning funktioniert muss unter Themes > Module ein Modul vom Typ "Enlighter.js" angelegt werden. Hier können die Einstellungen für das Syntaxhighlightning festgelegt werden.

Im Einzelnen sind dies:

• Theme
• Einrückung
• Das Hervorheben der Zeile beim Überfahren mit der Maus.
• Die Anzeige der Zeilennummern
• Ob zu lange Zeilen umgebrochen werden sollen, oder ob horizontal gescrollt werden soll.

2. Modul einbinden

Nun muss das Modul im gewünschten Seitenlayout eingebunden werden. Da das Modul keine Ausgabe erzeugt, ist es prinzpiell egal, wo ein eingebunden wird. Es werden ausschließlich Skripte eingebunden, die an den entsprechenden Stellen (CSS im Head und JS im Footer) eingebunden werden.

Im entsprechenden Seitenlaylout darf das von Contao mitgelieferte highlight.js nicht aktiviert sein!

Das Highlightning wird global für alle Code-Tags auf der entsprechenden Seite eingestellt. Will man es nur auf bestimmten Seiten, muss man mit mehreren Seitenlayouts arbeiten. Will man einzelne Blöcke nicht auszeichnen, reicht es keine Sprache anzugeben. Diese Blöcke werden dann ignoriert.

3. Code eingeben

Das Highlightning funktioniert mit dem Inhaltselement "Code", Codeblöcken in Markdowntexten, sowie allen anderen Code-Tags auf der Seite, die als CSS-Klasse eine der unterstützen Sprachen enthalten. Dies ist auch der Grund, warum beim Inhaltselement "Code" die Sprache für das Syntaxhighlightning ausgewählt werden muss.