, ''<nav>, <ul>, etc. |
| CSS-Klassen | class=„my-class“ |
| Inline-Styles | style=„color: red;“ |
| JavaScript | onclick=„…“ (mit Vorsicht) |
| Font Awesome | <i class=„fa fa-home“></i> |
| wki18n Tags | Startseite |
| Inline-Übersetzungen | de:Text|en:Text |
Konfiguration
Admin-Einstellungen
Über Admin → Konfiguration → wksnippet:
| Einstellung | Typ | Standard | Beschreibung |
allowPhp | An/Aus | Aus | PHP-Code in Snippets erlauben (Sicherheitsrisiko!) |
Admin-Interface
Über Admin → Snippets können Snippets direkt verwaltet werden:
| Funktion | Beschreibung |
| Snippet-Liste | Alle verfügbaren Snippets mit Vorschau anzeigen |
| Snippet bearbeiten | HTML-Inhalt im geteilten Editor ändern: links der Quelltext mit HTML-Hervorhebung, rechts die gerenderte, bearbeitbare Vorschau — Baustein htmlSplitEditor() aus wkfluentui (Vertrag). Ansicht umschaltbar (Quelle | Geteilt | Vorschau) und je Benutzer gemerkt. Ohne JavaScript bleibt es eine gewöhnliche Textarea. |
| Neues Snippet | Neuen Snippet-Key erstellen |
| Snippet löschen | Snippet-Datei entfernen (mit Bestätigung) |
In der Vorschau erscheint jeder Platzhalter ({{wk:lang>…}},
{{wk:image>…}}) als unteilbarer Chip mit dem vollen Token im
Tooltip — er wird byteweise unverändert gespeichert. <style>- und
<script>-Blöcke eines Snippets wirken nur innerhalb der Vorschau
(Sandbox-iframe ohne Skriptausführung), nicht auf die Admin-Seite.
Eine Bearbeitung in der Vorschau schreibt den Quelltext neu formatiert
zurück; ein einzelnes Strg+Z im Quelltextfeld nimmt das zurück. Wer nur
links arbeitet, ändert an der Formatierung der Datei nichts.
Beispiel-Snippet (main_menu.html)
Datei: lib/plugins/wksnippet/snippets/main_menu.html
<nav class="main-menu">
<ul class="menu-list">
<li class="menu-item"><a href="?id=start">Startseite</a></li>
<li class="menu-item"><a href="?id=docs">Projekt-Dokumentation</a></li>
<li class="menu-item"><a href="?id=contact">Kontakt</a></li>
</ul>
</nav>
Beispiel-Snippet (go_back.html)
Datei: lib/plugins/wksnippet/snippets/go_back.html
<div class="go-back">
<i class="fa fa-arrow-left"></i>
<a href="javascript:history.back()">Zurück</a>
</div>
Beispiele
Anforderung: Zentrales Navigationsmenü für alle Seiten.
Snippet-Datei: lib/plugins/wksnippet/snippets/main_menu.html
<nav class="main-menu">
<ul>
<li><a href="?id=start">Startseite</a></li>
<li><a href="?id=de:docs:start">Projekt-Dokumentation</a></li>
</ul>
</nav>
Verwendung in sidebar.txt:
~~NOCACHE~~
{{wk:snippet>main_menu}}
Ergebnis:
Menü erscheint auf allen Seiten
Übersetzungen werden automatisch angewendet
Änderungen über Admin-Interface oder direkt in der Datei
Beispiel 2: Zurück-Link mit Icon
Anforderung: Einheitlicher Zurück-Link in Unter-Namespaces.
Snippet-Datei: lib/plugins/wksnippet/snippets/go_back.html
<div class="go-back" style="margin-bottom: 1em;">
<i class="fa fa-arrow-left" style="margin-right: 0.5em;"></i>
<a href="javascript:history.back()">de:Zurück|en:Back|sl:Nazaj</a>
</div>
Verwendung in sidebar1.txt:
~~NOCACHE~~
{{wk:snippet>go_back}}
{{wk:acmenu}}
Beispiel 3: Kontaktbox
Anforderung: Wiederverwendbare Kontaktinformationen.
Snippet-Datei: lib/plugins/wksnippet/snippets/contact_box.html
<div class="contact-box">
<h4>de:Kontakt|en:Contact|sl:Kontakt</h4>
<p>
<i class="fa fa-envelope"></i> info@example.com<br>
<i class="fa fa-phone"></i> +49 123 456789
</p>
</div>
Verwendung:
{{wk:snippet>contact_box}}
Anforderung: Footer mit dynamischem Jahr und lokalisierten Links.
Snippet-Datei: lib/plugins/wksnippet/snippets/footer.html
<footer class="site-footer">
<div class="footer-content">
<p>© 2026 conf:title</p>
<nav class="footer-links">
<a href="?id=impressum">menu_imprint</a> |
<a href="?id=datenschutz">menu_privacy</a> |
<a href="?id=sitemap">menu_sitemap</a>
</nav>
</div>
</footer>
Funktionsweise
Verarbeitungs-Pipeline
1. Syntax-Erkennung
└── Findet alle {{wk:snippet>...}} Tags
2. Snippet-Lookup
└── Sucht Snippet-Datei: snippets/{key}.html
└── Lädt den HTML-Inhalt aus der Datei
3. wki18n-Verarbeitung
└── Ersetzt ... Tags im Snippet
└── Wendet aktuelle Sprache an
4. HTML-Ausgabe
└── Fügt verarbeiteten HTML-Code in Seite ein
└── Keine zusätzliche Escaping (Raw HTML)
Verarbeitungsreihenfolge
| Priorität | Plugin | Sort-Wert |
| 1 | wki18n | 305 |
| 2 | wksnippet | 310 |
| 3 | wkimage | 319 |
wki18n wird vor wksnippet verarbeitet, damit Übersetzungen in Snippets funktionieren.
Integration
Mit wki18n
Snippets unterstützen alle wki18n-Syntaxen:
Datei: lib/plugins/wksnippet/snippets/multilingual_block.html
<div class="info">
greeting
de:Hallo|en:Hello|sl:Zdravo
{{wk:lang:en>english_only_text}}
</div>
Typische Sidebar-Struktur:
~~NOCACHE~~
{{wk:snippet>go_back}}
{{wk:acmenu}}
Mit wkimage
Snippets können auch Bilder enthalten:
Datei: lib/plugins/wksnippet/snippets/logo_block.html
<div class="logo">
{{wk:image>wiki:logo.png|width=100%|maxwidth=200}}
</div>
Sicherheit
Vorteile gegenüber htmlok
| Aspekt | htmlok | wksnippet |
| HTML-Eingabe | Frei in jeder Seite | Nur über Admin |
| Sicherheitsrisiko | Hoch (XSS, Injection) | Niedrig (kontrolliert) |
| Audit | Schwierig (verstreut) | Einfach (zentral) |
| Benutzer-Rechte | Jeder mit Bearbeitung | Nur Administratoren |
Best Practices
JavaScript minimal halten - Nur wenn unbedingt nötig
Externe Links mit target=„_blank“ - Sicherheit mit rel=„noopener“
Keine sensiblen Daten - Keine
API-Keys, Passwörter in Snippets
Eindeutige Namen - Snippet-Namen aussagekräftig wählen
Fehlerbehandlung
Verhalten bei Fehlern
| Szenario | Verhalten |
| Snippet nicht gefunden | Gibt [snippet_name not found] aus |
| Leeres Snippet | Gibt nichts aus |
| Ungültiges Format | Ignoriert ungültige Zeilen |
| wki18n-Fehler | Gibt Key zurück (Fallback) |
Debugging
Bei Problemen prüfen:
Ist der Snippet-Name korrekt geschrieben?
Existiert die Datei lib/plugins/wksnippet/snippets/{key}.html?
Hat die Datei die Erweiterung .html?
Ist
Funktionieren die wki18n-Tags einzeln?
Empfehlungen
| Szenario | Empfehlung |
| Statische Snippets | Cache aktiviert lassen |
| Dynamische Snippets (Sprache) | |
| Große Snippets | In kleinere aufteilen |
| Viele Snippets | Nicht mehr als 50 definieren |
Caching
Seiten mit sprachabhängigen Snippets sollten
Versionshinweise
| Version | Datum | Änderungen |
| 2.1.0 | 2026-01-26 | Admin-Interface, Datei-basierte Speicherung (HTML-Dateien) |
| 2.0.0 | 2026-01-06 | Umbenennung von wvdschunk zu wksnippet |
| 1.0.0 | 2025-01-06 | Erstveröffentlichung |
Siehe auch
Technische Referenz
Klasse: syntax_plugin_wksnippet
Datei: lib/plugins/wksnippet/syntax.php
| Methode | Beschreibung |
getType() | Gibt substitution zurück |
getSort() | Gibt 310 zurück (nach wki18n) |
connectTo($mode) | Registriert Pattern \{\{wk:snippet>[^}]+\}\} |
handle($match, …) | Extrahiert Snippet-Namen |
render($mode, …) | Gibt HTML-Inhalt aus |
Klasse: helper_plugin_wksnippet
Datei: lib/plugins/wksnippet/helper.php
| Methode | Parameter | Rückgabe | Beschreibung |
getSnippets() | - | array | Lädt alle Snippets aus dem snippets-Verzeichnis |
get() | $name | string | Gibt Snippet-Inhalt zurück |
Klasse: admin_plugin_wksnippet
Datei: lib/plugins/wksnippet/admin.php
| Methode | Beschreibung |
html() | Rendert Admin-Interface |
handle() | |
