WSC CKEditor Button BBCode
Mit WSC CKEditor Button BBCode lassen sich in der WoltLab Suite Core 6.2 komfortabel und ohne manuelle BBCode-Eingabe optisch passende Buttons direkt im CKEditor erstellen.
Dafür ergänzt das Plugin die Editor-Werkzeugleiste um ein eigenes Gamepad-Symbol. Ein Klick darauf öffnet einen übersichtlichen Dialog, in dem der gewünschte Button vollständig konfiguriert werden kann. Anschließend wird automatisch der passende BBCode in den Beitrag oder Inhalt eingefügt.
Die Darstellung orientiert sich bewusst an den vorhandenen WoltLab-Komponenten. Dadurch fügen sich die erzeugten Buttons optisch sauber in die jeweilige Installation und den verwendeten Stil ein.
Zu den wichtigsten Funktionen gehören:
- Auswahl zwischen Standard-Button und Primary-Button
- optionale Beschriftung
- optionaler Tooltip
- optionale interne oder externe Verlinkung
- Auswahl eines normalen Font-Awesome-Icons
- Unterstützung von Font-Awesome-Brands
- getrennte Auswahlbereiche für Icons und Marken
- Suchfunktion innerhalb der Icon-Auswahl
- automatische Verwendung der tatsächlich in der WoltLab-Installation vorhandenen Font-Awesome-Icons und Brands
- Buttons auch nur mit Icon möglich
- bei Icon-only-Buttons wird aus Gründen der Barrierefreiheit ein Tooltip verlangt
- direkte Validierung fehlerhafter oder unvollständiger Eingaben im Dialog
- Prüfung von Links auf gültige und sichere interne beziehungsweise externe URLs
- Ausgabe im nativen WoltLab-Button-Stil
- Unterstützung im Frontend und in CKEditor-Instanzen des ACP
- deutsche und englische Sprachunterstützung
Das Plugin verwendet einen eigenen BBCode:
[wscbutton='primary','https://www.example.com/','brand:github','GitHub']GitHub[/wscbutton]
Die Benutzer müssen diesen Aufbau jedoch nicht kennen oder manuell eingeben. Der gesamte BBCode wird über den Dialog erzeugt.
Ein besonderer Fokus liegt auf einer sauberen Integration in die WoltLab Suite. Für Editor, Dialoge, Font Awesome, Linkverarbeitung und Rendering werden die von WoltLab bereitgestellten Mechanismen verwendet.
Auch die Sicherheit wird nicht nur auf der Clientseite geprüft. Sämtliche BBCode-Werte werden beim Rendern erneut serverseitig validiert. Dabei werden unter anderem Button-Typen, URLs, Icon-Namen, Brands und Textlängen geprüft. Unsichere URL-Schemata oder manipulierte Icon-Werte werden nicht ungeprüft ausgegeben.
Kompatibilität
- WoltLab Suite Core 6.2.x
- PHP 8.1 oder neuer
Typische Einsatzmöglichkeiten
Ideal eignet sich das Plugin beispielsweise für:
- Download-Buttons
- Links zu Produktseiten
- Dokumentationen
- Support- und Kontaktseiten
- externe Projektseiten
- GitHub-, Discord- oder Social-Media-Links
- Call-to-Action-Elemente in Artikeln und Beiträgen
Damit lassen sich häufig benötigte Links deutlich ansprechender darstellen, ohne dafür HTML verwenden oder eigene CSS-Konstruktionen erstellen zu müssen.
Das Plugin gibt es kostenlos hier: https://www.wsc-support.de/sho…c-ckeditor-button-bbcode/