wiki:syntax

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Beide Seiten der vorigen Revision Vorhergehende Überarbeitung
Nächste Überarbeitung		 Vorhergehende Überarbeitung
wiki:syntax [21.09.2015 08:06] – ToDo erledigt: mach das nicht selbst Damian Solkawiki:syntax [02.07.2025 05:40] (aktuell) – Mermaid Plugin Syntax-Dokumentation hinzugefügt Jane Alesi
Zeile 1: Zeile 1:
-<todo>Übersetzen der Wiki Syntax Seite mit Bezug auf bp Richtlinien</todo> +====== Umfassende DokuWiki-Syntaxreferenz für wiki.satware.com ======
-<todo @mw #ds:2015-09-21>mach das nicht selbst</todo> +
- --- //[[:mitarbeiter:mw|Michael Wegener]] 21.09.2015 05:37// +
-====== Formatting Syntax ======+
  
-[[doku>DokuWiki]] supports some simple markup language, which tries to make the datafiles to be as readable as possible. This page contains all possible syntax you may use when editing the pages. Simply have a look at the source of this page by pressing "Edit this page". If you want to try something, just use the [[playground:playground|playground]] page. The simpler markup is easily accessible via [[doku>toolbar|quickbuttons]], too.+**Basierend auf DokuWiki 2024-02-06b "Kaos" Release**
  
-===== Basic Text Formatting =====+----
  
-DokuWiki supports **bold**, //italic//, __underlined__ and ''monospaced'' texts. Of course you can **__//''combine''//__** all these.+===== Systemkonfiguration ===== 
 +  * **DokuWiki Version:** 2024-02-06b "Kaos" 
 +  * **Template:** Bootstrap3 v2024-02-06 (hotfix/20241008) 
 +  * **Installierte Plugins:** 25+ aktive Erweiterungen 
 +  * **PHP-Kompatibilität:** 7.4 bis 8.1
  
-  DokuWiki supports **bold**, //italic//, __underlined__ and ''monospaced'' texts. +----
-  Of course you can **__//''combine''//__** all these.+
  
-You can use <sub>subscript</sub> and <sup>superscript</sup>, too.+===== 1. Grundlegende Textformatierung =====
  
-  You can use <sub>subscript</sub> and <sup>superscript</sup>, too.+==== Textauszeichnung ==== 
 +<code> 
 +DokuWiki unterstützt **fett**, //kursiv//, __unterstrichen__ und ''monospace'' Text. 
 +Natürlich können Sie **__//''alles kombinieren''//__**. 
 +</code>
  
-You can mark something as <del>deleted</del> as well.+**Ergebnis:**\\ 
 +DokuWiki unterstützt **fett**, //kursiv//, __unterstrichen__ und ''monospace'' Text.\\ 
 +Natürlich können Sie **__//''alles kombinieren''//__**.
  
-  You can mark something as <del>deleted</del> as well.+==== Hoch- und Tiefstellung ==== 
 +<code> 
 +Sie können <sub>tiefgestellt</sub> und <sup>hochgestellt</sup> verwenden. 
 +Beispiel: H<sub>2</sub>O und E=mc<sup>2</sup> 
 +</code>
  
-**Paragraphs** are created from blank lines. If you want to **force a newline** without a paragraph, you can use two backslashes followed by a whitespace or the end of line.+**Ergebnis:** Sie können <sub>tiefgestellt</sub> und <sup>hochgestellt</sup> verwenden.\\ 
 +Beispiel: H<sub>2</sub>O und E=mc<sup>2</sup>
  
-This is some text with some linebreaks\\ Note that the +==== Durchgestrichener Text ==== 
-two backslashes are only recognized at the end of a line\\ +<code> 
-or followed by\\ a whitespace \\this happens without it.+Sie können etwas als <del>gelöscht</del> markieren. 
 +</code>
  
-  This is some text with some linebreaks\\ Note that the +**Ergebnis:** Sie können etwas als <del>gelöscht</del> markieren.
-  two backslashes are only recognized at the end of a line\\ +
-  or followed by\\ a whitespace \\this happens without it.+
  
-You should use forced newlines only if really needed.+==== Zeilenumbrüche und Absätze ==== 
 +<code> 
 +Dies ist Text mit Zeilenumbrüchen\\ 
 +Beachten Sie, dass die zwei Backslashes nur am Zeilenende\\ 
 +oder gefolgt von\\ einem Leerzeichen erkannt werden \\dies passiert ohne. 
 +</code>
  
-===== Links =====+**Ergebnis:**\\ 
 +Dies ist Text mit Zeilenumbrüchen\\ 
 +Beachten Sie, dass die zwei Backslashes nur am Zeilenende\\ 
 +oder gefolgt von\\ einem Leerzeichen erkannt werden \\dies passiert ohne.
  
-DokuWiki supports multiple ways of creating links.+**Wichtig:** Verwenden Sie erzwungene Zeilenumbrüche nur wenn wirklich nötig.
  
-==== External ====+----
  
-External links are recognized automagically: http://www.google.com or simply www.google.com - You can set the link text as well: [[http://www.google.com|This Link points to google]]. Email addresses like this one: <andi@splitbrain.org> are recognized, too.+===== 2. Überschriften und Gliederung =====
  
-  DokuWiki supports multiple ways of creating links. External links are recognized +==== Überschriftenebenen ==== 
-  automagically: http://www.google.com or simply www.google.com - You can set +<code> 
-  link text as well: [[http://www.google.com|This Link points to google]]. Email +====== Ebene 1 (Hauptüberschrift) ====== 
-  addresses like this one: <andi@splitbrain.org> are recognized, too.+===== Ebene 2 ===== 
 +==== Ebene 3 ==== 
 +=== Ebene 4 === 
 +== Ebene 5 == 
 +</code>
  
-==== Internal ====+**Ergebnis:** 
 +====== Ebene 1 (Hauptüberschrift) ====== 
 +===== Ebene 2 ===== 
 +==== Ebene 3 ==== 
 +=== Ebene 4 === 
 +== Ebene 5 ==
  
-Internal links are created by using square brackets. You can either just give a [[pagename]] or use an additional [[pagename|link text]].+==== Automatisches Inhaltsverzeichnis ==== 
 +  * Wird automatisch bei mehr als 3 Überschriften erstellt 
 +  * Deaktivierung mit ''%%~~NOTOC~~%%''
  
-  Internal links are created by using square brackets. You can either just give +==== Horizontale Linie ==== 
-  a [[pagename]] or use an additional [[pagename|link text]].+<code> 
 +---- 
 +</code>
  
-[[doku>pagename|Wiki pagenames]] are converted to lowercase automatically, special characters are not allowed.+**Ergebnis:** 
 +----
  
-You can use [[some:namespaces]] by using a colon in the pagename.+Vier oder mehr Bindestriche erzeugen eine horizontale Linie.
  
-  You can use [[some:namespaces]] by using a colon in the pagename.+----
  
-For details about namespaces see [[doku>namespaces]].+===== 3. Links =====
  
-Linking to a specific section is possible, too. Just add the section name behind a hash character as known from HTML. This links to [[syntax#internal|this Section]].+==== Externe Links ==== 
 +<code> 
 +http://www.google.com 
 +[[http://www.google.com]] 
 +[[http://www.google.com|Dieser Link führt zu Google]] 
 +<andi@splitbrain.org> 
 +</code>
  
-  This links to [[syntax#internal|this Section]].+**Ergebnis:**\\ 
 +http://www.google.com\\ 
 +[[http://www.google.com]]\\ 
 +[[http://www.google.com|Dieser Link führt zu Google]]\\ 
 +<andi@splitbrain.org>
  
-Notes:+==== Interne Links ==== 
 +<code> 
 +[[seitenname]] 
 +[[seitenname|Link-Text]] 
 +[[namespace:seitenname]] 
 +[[syntax#internal|Zu diesem Abschnitt]] 
 +</code>
  
-  * Links to [[syntax|existing pages]] are shown in a different style from [[nonexisting]] ones. +**Ergebnis:**\\ 
-  * DokuWiki does not use [[wp>CamelCase]] to automatically create links by default, but this behavior can be enabled in the [[doku>config]] file. Hint: If DokuWiki is a link, then it's enabled. +[[seitenname]]\\ 
-  * When a section's heading is changed, its bookmark changes, too. So don't rely on section linking too much.+[[seitenname|Link-Text]]\\ 
 +[[namespace:seitenname]]\\ 
 +[[syntax#internal|Zu diesem Abschnitt]]
  
-==== Interwiki ====+==== Interwiki-Links ==== 
 +<code> 
 +[[doku>Interwiki]] 
 +[[wp>Wiki]] 
 +</code>
  
-DokuWiki supports [[doku>Interwiki]] links. These are quick links to other Wikis. For example this is a link to Wikipedia's page about Wikis: [[wp>Wiki]].+**Ergebnis:**\\ 
 +[[doku>Interwiki]]\\ 
 +[[wp>Wiki]]
  
-  DokuWiki supports [[doku>Interwiki]] links. These are quick links to other Wikis. +==== Windows-Freigaben ==== 
-  For example this is a link to Wikipedia's page about Wikis: [[wp>Wiki]].+<code> 
 +[[\\server\freigabe|Diese Freigabe]] 
 +</code>
  
-==== Windows Shares ====+**Ergebnis:**\\ 
 +[[\\server\freigabe|Diese Freigabe]]
  
-Windows shares like [[\\server\share|this]] are recognized, too. Please note that these only make sense in a homogeneous user group like a corporate [[wp>Intranet]].+==== Bild-Links ==== 
 +<code> 
 +[[http://php.net|{{wiki:dokuwiki-128.png}}]] 
 +</code>
  
-  Windows Shares like [[\\server\share|this]] are recognized, too.+**Ergebnis:**\\ 
 +[[http://php.net|{{wiki:dokuwiki-128.png}}]]
  
-Notes:+----
  
-  * For security reasons direct browsing of windows shares only works in Microsoft Internet Explorer per default (and only in the "local zone"). +===== 4. Bilder und Medien ===== 
-  * For Mozilla and Firefox it can be enabled through different workaround mentioned in the [[http://kb.mozillazine.org/Links_to_local_pages_do_not_work|Mozilla Knowledge Base]]. However, there will still be a JavaScript warning about trying to open a Windows Share. To remove this warning (for all users), put the following line in ''conf/lang/en/lang.php'' (more details at [[doku>localization#changing_some_localized_texts_and_strings_in_your_installation|localization]]): <code - conf/lang/en/lang.php> + 
-<?php+==== Grundlegende Bildsyntax ==== 
 +<code> 
 +{{wiki:dokuwiki-128.png}}                    // Originalgröße 
 +{{wiki:dokuwiki-128.png?50}}                 // Breite: 50px 
 +{{wiki:dokuwiki-128.png?200x50}}             // Breite x Höhe 
 +{{https://www.php.net/images/php.gif?200x50}} // Externes Bild 
 +</code> 
 + 
 +**Ergebnis:**\\ 
 +{{wiki:dokuwiki-128.png}}\\ 
 +{{wiki:dokuwiki-128.png?50}}\\ 
 +{{wiki:dokuwiki-128.png?200x50}}\\ 
 +{{https://www.php.net/images/php.gif?200x50}} 
 + 
 +==== Bildausrichtung ==== 
 +<code> 
 +{{ wiki:dokuwiki-128.png}}    // Rechtsbündig 
 +{{wiki:dokuwiki-128.png }}    // Linksbündig 
 +{{ wiki:dokuwiki-128.png }}   // Zentriert 
 +</code> 
 + 
 +**Ergebnis:** 
 + 
 +{{ wiki:dokuwiki-128.png}} 
 + 
 +{{wiki:dokuwiki-128.png }} 
 + 
 +{{ wiki:dokuwiki-128.png }} 
 + 
 +==== Bildtitel und Alt-Text ==== 
 +<code> 
 +{{ wiki:dokuwiki-128.png |Dies ist die Bildunterschrift}} 
 +</code> 
 + 
 +**Ergebnis:**\\ 
 +{{ wiki:dokuwiki-128.png |Dies ist die Bildunterschrift}} 
 + 
 +==== Unterstützte Medienformate ==== 
 + 
 +^ Typ ^ Formate ^ 
 +| **Bilder** | ''gif'', ''jpg'', ''png'', ''svg'' | 
 +| **Video** | ''webm'', ''ogv'', ''mp4'' | 
 +| **Audio** | ''ogg'', ''mp3'', ''wav'' | 
 +| **Flash** | ''swf'' | 
 + 
 +==== Nur-Link zu Medien ==== 
 +<code> 
 +{{wiki:dokuwiki-128.png?linkonly}} 
 +</code> 
 + 
 +**Ergebnis:**\\ 
 +{{wiki:dokuwiki-128.png?linkonly}} 
 + 
 +==== Fallback-Formate für Videos ==== 
 +Laden Sie mehrere Formate hoch (z.B. ''video.mp4'', ''video.webm'', ''video.ogv'') für maximale Browser-Kompatibilität. 
 + 
 +---- 
 + 
 +===== 5. Listen ===== 
 + 
 +==== Ungeordnete Listen ==== 
 +<code> 
 +  * Dies ist eine Liste 
 +  * Der zweite Punkt 
 +    * Sie können verschiedene Ebenen haben 
 +    * Noch ein Unterpunkt 
 +  * Ein weiterer Punkt 
 +</code> 
 + 
 +**Ergebnis:** 
 +  * Dies ist eine Liste 
 +  * Der zweite Punkt 
 +    * Sie können verschiedene Ebenen haben 
 +    * Noch ein Unterpunkt 
 +  * Ein weiterer Punkt 
 + 
 +==== Geordnete Listen ==== 
 +<code> 
 +  - Die gleiche Liste, aber nummeriert 
 +  - Ein weiterer Punkt 
 +    - Verwenden Sie Einrückung für tiefere Ebenen 
 +    - Das war's 
 +  - Zurück zur ersten Ebene 
 +</code> 
 + 
 +**Ergebnis:** 
 +  - Die gleiche Liste, aber nummeriert 
 +  - Ein weiterer Punkt 
 +    - Verwenden Sie Einrückung für tiefere Ebenen 
 +    - Das war's 
 +  - Zurück zur ersten Ebene 
 + 
 +==== Gemischte Listen ==== 
 +<code> 
 +  * Ungeordnet 
 +    - Geordnet 
 +    - Noch einer 
 +  * Zurück zu ungeordnet 
 +</code> 
 + 
 +**Ergebnis:** 
 +  * Ungeordnet 
 +    - Geordnet 
 +    - Noch einer 
 +  * Zurück zu ungeordnet 
 + 
 +---- 
 + 
 +===== 6. Tabellen ===== 
 + 
 +==== Grundlegende Tabellensyntax ==== 
 +<code> 
 +^ Überschrift 1 ^ Überschrift 2 ^ Überschrift 3 ^ 
 +| Zeile 1 Sp 1  | Zeile 1 Sp 2  | Zeile 1 Sp 3  | 
 +| Zeile 2 Sp 1  | Zeile 2 Sp 2  | Zeile 2 Sp 3  | 
 +</code> 
 + 
 +**Ergebnis:** 
 +^ Überschrift 1 ^ Überschrift 2 ^ Überschrift 3 ^ 
 +| Zeile 1 Sp 1  | Zeile 1 Sp 2  | Zeile 1 Sp 3  | 
 +| Zeile 2 Sp 1  | Zeile 2 Sp 2  | Zeile 2 Sp 3  | 
 + 
 +==== Colspan (Zellen horizontal verbinden) ==== 
 +<code> 
 +^ Überschrift 1 ^ Überschrift 2 ^ Überschrift 3 ^ 
 +| Zeile 1 Sp 1  | Zeile 1 Sp 2  | Zeile 1 Sp 3  | 
 +| Zeile 2 Sp 1  | ein colspan (beachten Sie die doppelte Pipe) || 
 +| Zeile 3 Sp 1  | Zeile 3 Sp 2  | Zeile 3 Sp 3  | 
 +</code> 
 + 
 +**Ergebnis:** 
 +^ Überschrift 1 ^ Überschrift 2 ^ Überschrift 3 ^ 
 +| Zeile 1 Sp 1  | Zeile 1 Sp 2  | Zeile 1 Sp 3  | 
 +| Zeile 2 Sp 1  | ein colspan (beachten Sie die doppelte Pipe) || 
 +| Zeile 3 Sp 1  | Zeile 3 Sp 2  | Zeile 3 Sp 3  | 
 + 
 +==== Vertikale Überschriften ==== 
 +<code> 
 +|              ^ Überschrift 1  ^ Überschrift 2  ^ 
 +^ Überschrift 3 | Zeile 1 Sp 2  | Zeile 1 Sp 3  | 
 +^ Überschrift 4 | Zeile 2 Sp 2  | Zeile 2 Sp 3  | 
 +</code> 
 + 
 +**Ergebnis:** 
 +|              ^ Überschrift 1  ^ Überschrift 2  ^ 
 +^ Überschrift 3 | Zeile 1 Sp 2  | Zeile 1 Sp 3  | 
 +^ Überschrift 4 | Zeile 2 Sp 2  | Zeile 2 Sp 3  | 
 + 
 +==== Rowspan (Zellen vertikal verbinden) ==== 
 +<code> 
 +^ Überschrift 1 ^ Überschrift 2                ^ Überschrift 3 ^ 
 +| Zeile 1 Sp 1  | diese Zelle erstreckt sich vertikal | Zeile 1 Sp 3 | 
 +| Zeile 2 Sp 1  | :::                                 | Zeile 2 Sp 3 | 
 +| Zeile 3 Sp 1  | :::                                 | Zeile 3 Sp 3 | 
 +</code> 
 + 
 +**Ergebnis:** 
 +^ Überschrift 1 ^ Überschrift 2                ^ Überschrift 3 ^ 
 +| Zeile 1 Sp 1  | diese Zelle erstreckt sich vertikal | Zeile 1 Sp 3 | 
 +| Zeile 2 Sp 1  | :::                                 | Zeile 2 Sp 3 | 
 +| Zeile 3 Sp 1  | :::                                 | Zeile 3 Sp 3 | 
 + 
 +==== Tabellenausrichtung ==== 
 +<code> 
 +^           Tabelle mit Ausrichtung           ^^^ 
 +|        rechts|    zentriert    |links          | 
 +|links          |        rechts|    zentriert    | 
 +| xxxxxxxxxxxx | xxxxxxxxxxxx | xxxxxxxxxxxx | 
 +</code> 
 + 
 +**Ergebnis:** 
 +^           Tabelle mit Ausrichtung           ^^^ 
 +|        rechts|    zentriert    |links          | 
 +|links          |        rechts|    zentriert    | 
 +| xxxxxxxxxxxx | xxxxxxxxxxxx | xxxxxxxxxxxx | 
 + 
 +**Ausrichtungsregeln:** 
 +  * **Rechtsbündig:** Mindestens 2 Leerzeichen links 
 +  * **Linksbündig:** Mindestens 2 Leerzeichen rechts   
 +  * **Zentriert:** Mindestens 2 Leerzeichen auf beiden Seiten 
 + 
 +---- 
 + 
 +===== 7. Code und Formatierung ===== 
 + 
 +==== Inline-Code ==== 
 +<code> 
 +Dies ist ''monospace'' Text. 
 +</code> 
 + 
 +**Ergebnis:**\\ 
 +Dies ist ''monospace'' Text. 
 + 
 +==== Code-Blöcke ==== 
 +**Ergebnis:** 
 +<code> 
 +Dies ist vorformatierter Code, alle Leerzeichen bleiben erhalten: wie              <-hier 
 +</code> 
 + 
 +==== Datei-Blöcke ==== 
 +<code> 
 +<file> 
 +Dies ist ziemlich dasselbe, aber Sie könnten es verwenden, um zu zeigen, dass Sie eine Datei zitiert haben. 
 +</file> 
 +</code> 
 + 
 +**Ergebnis:** 
 +<file> 
 +Dies ist ziemlich dasselbe, aber Sie könnten es verwenden, um zu zeigen, dass Sie eine Datei zitiert haben. 
 +</file> 
 + 
 +==== Syntax-Highlighting ==== 
 +<code> 
 +<code java>
 /** /**
- * Customization of the english language file + * Die HelloWorldApp-Klasse implementiert eine Anwendung, die 
- * Copy only the strings that needs to be modified+ * einfach "Hello World!" zur Standardausgabe anzeigt.
  */  */
-$lang['js']['nosmblinks'] = '';+class HelloWorldApp { 
 +    public static void main(String[] args) { 
 +        System.out.println("Hello World!"); //Zeigt den String an. 
 +    } 
 +} 
 +</code>
 </code> </code>
  
-==== Image Links ====+**Ergebnis:** 
 +<code java> 
 +/** 
 + * Die HelloWorldApp-Klasse implementiert eine Anwendung, die 
 + * einfach "Hello World!" zur Standardausgabe anzeigt. 
 + */ 
 +class HelloWorldApp { 
 +    public static void main(String[] args) { 
 +        System.out.println("Hello World!"); //Zeigt den String an. 
 +    } 
 +} 
 +</code>
  
-You can also use an image to link to another internal or external page by combining the syntax for links and [[#images_and_other_files|images]] (see below) like this:+==== Unterstützte Sprachen für Syntax-Highlighting ==== 
 +''4cs'', ''6502acme'', ''6502kickass'', ''6502tasm'', ''68000devpac'', ''abap'', ''actionscript3'', ''actionscript'', ''ada'', ''aimms'', ''algol68'', ''apache'', ''applescript'', ''apt_sources'', ''arm'', ''asm'', ''asp'', ''asymptote'', ''autoconf'', ''autohotkey'', ''autoit'', ''avisynth'', ''awk'', ''bascomavr'', ''bash'', ''basic4gl'', ''batch'', ''bf'', ''biblatex'', ''bibtex'', ''blitzbasic'', ''bnf'', ''boo'', ''caddcl'', ''cadlisp'', ''ceylon'', ''cfdg'', ''cfm'', ''chaiscript'', ''chapel'', ''cil'', ''c_loadrunner'', ''clojure'', ''c_mac'', ''cmake'', ''cobol'', ''coffeescript'', ''c'', ''cpp'', ''cpp-qt'', ''cpp-winapi'', ''csharp'', ''css'', ''cuesheet'', ''c_winapi'', ''dart'', ''dcl'', ''dcpu16'', ''dcs'', ''delphi'', ''diff'', ''div'', ''dos'', ''dot'', ''d'', ''ecmascript'', ''eiffel'', ''email'', ''epc'', ''e'', ''erlang'', ''euphoria'', ''ezt'', ''f1'', ''falcon'', ''fo'', ''fortran'', ''freebasic'', ''freeswitch'', ''fsharp'', ''gambas'', ''gdb'', ''genero'', ''genie'', ''gettext'', ''glsl'', ''gml'', ''gnuplot'', ''go'', ''groovy'', ''gwbasic'', ''haskell'', ''haxe'', ''hicest'', ''hq9plus'', ''html'', ''html4strict'', ''html5'', ''icon'', ''idl'', ''ini'', ''inno'', ''intercal'', ''io'', ''ispfpanel'', ''java5'', ''java'', ''javascript'', ''jcl'', ''j'', ''jquery'', ''julia'', ''kixtart'', ''klonec'', ''klonecpp'', ''kotlin'', ''latex'', ''lb'', ''ldif'', ''lisp'', ''llvm'', ''locobasic'', ''logtalk'', ''lolcode'', ''lotusformulas'', ''lotusscript'', ''lscript'', ''lsl2'', ''lua'', ''m68k'', ''magiksf'', ''make'', ''mapbasic'', ''mathematica'', ''matlab'', ''mercury'', ''metapost'', ''mirc'', ''mk-61'', ''mmix'', ''modula2'', ''modula3'', ''mpasm'', ''mxml'', ''mysql'', ''nagios'', ''netrexx'', ''newlisp'', ''nginx'', ''nimrod'', ''nsis'', ''oberon2'', ''objc'', ''objeck'', ''ocaml-brief'', ''ocaml'', ''octave'', ''oobas'', ''oorexx'', ''oracle11'', ''oracle8'', ''oxygene'', ''oz'', ''parasail'', ''parigp'', ''pascal'', ''pcre'', ''perl6'', ''perl'', ''per'', ''pf'', ''phix'', ''php-brief'', ''php'', ''pic16'', ''pike'', ''pixelbender'', ''pli'', ''plsql'', ''postgresql'', ''postscript'', ''povray'', ''powerbuilder'', ''powershell'', ''proftpd'', ''progress'', ''prolog'', ''properties'', ''providex'', ''purebasic'', ''pycon'', ''pys60'', ''python'', ''qbasic'', ''qml'', ''q'', ''racket'', ''rails'', ''rbs'', ''rebol'', ''reg'', ''rexx'', ''robots'', ''roff'', ''rpmspec'', ''rsplus'', ''ruby'', ''rust'', ''sas'', ''sass'', ''scala'', ''scheme'', ''scilab'', ''scl'', ''sdlbasic'', ''smalltalk'', ''smarty'', ''spark'', ''sparql'', ''sql'', ''sshconfig'', ''standardml'', ''stonescript'', ''swift'', ''systemverilog'', ''tclegg'', ''tcl'', ''teraterm'', ''texgraph'', ''text'', ''thinbasic'', ''tsql'', ''twig'', ''typoscript'', ''unicon'', ''upc'', ''urbi'', ''uscript'', ''vala'', ''vbnet'', ''vb'', ''vbscript'', ''vedit'', ''verilog'', ''vhdl'', ''vim'', ''visualfoxpro'', ''visualprolog'', ''whitespace'', ''whois'', ''winbatch'', ''wolfram'', ''xbasic'', ''xml'', ''xojo'', ''xorg_conf'', ''xpp'', ''yaml'', ''z80'', ''zxbasic''
  
-  [[http://www.php.net|{{wiki:dokuwiki-128.png}}]]+==== Herunterladbare Code-Blöcke ==== 
 +<code> 
 +<file php myexample.php> 
 +<?php echo "hello world!"; ?> 
 +</file> 
 +</code>
  
-[[http://www.php.net|{{wiki:dokuwiki-128.png}}]]+**Ergebnis:** 
 +<file php myexample.php> 
 +<?php echo "hello world!"; ?> 
 +</file>
  
-Please note: The image formatting is the only formatting syntax accepted in link names.+==== Code ohne Highlighting ==== 
 +<code> 
 +<code - myfile.foo> 
 +Kein Syntax-Highlighting, aber herunterladbar 
 +</code> 
 +</code>
  
-The whole [[#images_and_other_files|image]] and [[#links|link]] syntax is supported (including image resizing, internal and external images and URLs and interwiki links).+**Ergebnis:** 
 +<code - myfile.foo> 
 +Kein Syntax-Highlighting, aber herunterladbar 
 +</code>
  
-===== Footnotes =====+---- 
 + 
 +===== 8. Keine Formatierung ===== 
 + 
 +==== Nowiki-Tags ==== 
 +<code> 
 +<nowiki> 
 +Dies ist Text, der Adressen wie diese enthält: http://www.splitbrain.org und **Formatierung**, aber nichts wird damit gemacht. 
 +</nowiki> 
 +</code> 
 + 
 +**Ergebnis:** 
 +<nowiki> 
 +Dies ist Text, der Adressen wie diese enthält: http://www.splitbrain.org und **Formatierung**, aber nichts wird damit gemacht. 
 +</nowiki> 
 + 
 +==== Prozent-Zeichen ==== 
 +<code> 
 +Das Gleiche gilt für %%//__dieser__ Text// mit einem Smiley ;-)%%. 
 +</code> 
 + 
 +**Ergebnis:**\\ 
 +Das Gleiche gilt für %%//__dieser__ Text// mit einem Smiley ;-)%%. 
 + 
 +---- 
 + 
 +===== 9. Zitate ===== 
 + 
 +<code> 
 +Ich denke, wir sollten es tun 
 + 
 +> Nein, sollten wir nicht 
 + 
 +>> Nun, ich sage, wir sollten 
 + 
 +> Wirklich? 
 + 
 +>> Ja! 
 + 
 +>>> Dann lass es uns tun! 
 +</code>
  
-You can add footnotes ((This is a footnote)) by using double parentheses.+**Ergebnis:**
  
-  You can add footnotes ((This is a footnote)) by using double parentheses.+Ich denke, wir sollten es tun
  
-===== Sectioning =====+> Nein, sollten wir nicht
  
-You can use up to five different levels of headlines to structure your content. If you have more than three headlines, a table of contents is generated automatically -- this can be disabled by including the string ''<nowiki>~~NOTOC~~</nowiki>'' in the document.+>> Nun, ich sage, wir sollten
  
-==== Headline Level 3 ==== +> Wirklich?
-=== Headline Level 4 === +
-== Headline Level 5 ==+
  
-  ==== Headline Level 3 ==== +>> Ja!
-  === Headline Level 4 === +
-  == Headline Level 5 ==+
  
-By using four or more dashes, you can make a horizontal line:+>>> Dann lass es uns tun!
  
 ---- ----
  
-===== Media Files =====+===== 10. Fußnoten =====
  
-You can include external and internal [[doku>images|images, videos and audio files]] with curly brackets. Optionally you can specify the size of them.+<code> 
 +Sie können Fußnoten((Dies ist eine Fußnote)) hinzufügen, indem Sie doppelte Klammern verwenden. 
 +</code>
  
-Real size:                        {{wiki:dokuwiki-128.png}}+**Ergebnis:** Sie können Fußnoten((Dies ist eine Fußnote)) hinzufügen, indem Sie doppelte Klammern verwenden.
  
-Resize to given width:            {{wiki:dokuwiki-128.png?50}}+----
  
-Resize to given width and height((when the aspect ratio of the given width and height doesn't match that of the image, it will be cropped to the new ratio before resizing)): {{wiki:dokuwiki-128.png?200x50}}+===== 11. Text-Konvertierungen =====
  
-Resized external image:           {{http://de3.php.net/images/php.gif?200x50}}+==== Smileys ==== 
 +DokuWiki konvertiert häufig verwendete Emoticons in ihre grafischen Entsprechungen:
  
-  Real size:                        {{wiki:dokuwiki-128.png}} +<code> 
-  Resize to given width:            {{wiki:dokuwiki-128.png?50}} +8-) 8-O :-( :-) =) :-/ :-\ :-? :-D :-P :-O :-X :-| ;-) ^_^ m( :?: :!: LOL FIXME DELETEME 
-  Resize to given width and height: {{wiki:dokuwiki-128.png?200x50}} +</code>
-  Resized external image:           {{http://de3.php.net/images/php.gif?200x50}}+
  
 +**Ergebnis:**\\
 +8-) 8-O :-( :-) =) :-/ :-\ :-? :-D :-P :-O :-X :-| ;-) ^_^ m( :?: :!: LOL FIXME DELETEME
  
-By using left or right whitespaces you can choose the alignment.+==== Typografische Konvertierungen ==== 
 +<code> 
 +-> <- <-> => <= <=> >> << -- --- 640x480 (c) (tm) (r) 
 +"Er dachte 'Es ist eine Männerwelt'..." 
 +</code>
  
-{{ wiki:dokuwiki-128.png}}+**Ergebnis:**\\ 
 +-> <- <-> => <= <=> >> << -- --- 640x480 (c) (tm) (r)\\ 
 +"Er dachte 'Es ist eine Männerwelt'..."
  
-{{wiki:dokuwiki-128.png }}+----
  
-{{ wiki:dokuwiki-128.png }}+===== 12. RSS/ATOM Feed-Aggregation =====
  
-  {{ wiki:dokuwiki-128.png}} +<code> 
-  {{wiki:dokuwiki-128.png }} +{{rss>http://slashdot.org/index.rss 5 author date 1h}} 
-  {{ wiki:dokuwiki-128.png }}+</code>
  
-Of course, you can add a title (displayed as a tooltip by most browsers), too.+**Ergebnis:**\\ 
 +{{rss>http://slashdot.org/index.rss 5 author date 1h}}
  
-{{ wiki:dokuwiki-128.png |This is the caption}}+**Parameter:** 
 +  * **Zahl:** Maximale Anzahl der anzuzeigenden Elemente (Standard: 8) 
 +  * **reverse:** Zeigt die letzten Elemente zuerst an 
 +  * **author:** Zeigt Autorennamen an 
 +  * **date:** Zeigt Elementdaten an 
 +  * **description:** Zeigt Elementbeschreibung an (HTML-Tags werden entfernt) 
 +  * **nosort:** Sortiert die Elemente nicht 
 +  * **n[dhm]:** Aktualisierungsperiode (d=Tage, h=Stunden, m=Minuten)
  
-  {{ wiki:dokuwiki-128.png |This is the caption}}+----
  
-For linking an image to another page see [[#Image Links]] above.+===== 13. Kontroll-Makros =====
  
-==== Supported Media Formats ====+==== NOTOC - Inhaltsverzeichnis unterdrücken ==== 
 +<code> 
 +~~NOTOC~~ 
 +</code>
  
-DokuWiki can embed the following media formats directly.+**Ergebnis:** Verhindert die automatische Erstellung eines Inhaltsverzeichnisses.
  
-| Image | ''gif'', ''jpg'', ''png''  | +==== NOCACHE - Cache deaktivieren ==== 
-| Video | ''webm'', ''ogv'', ''mp4'' | +<code> 
-| Audio | ''ogg'', ''mp3'', ''wav''  | +~~NOCACHE~~ 
-| Flash | ''swf''                    |+</code>
  
-If you specify a filename that is not a supported media format, then it will be displayed as a link instead.+**Ergebnis:** Zwingt DokuWiki, die Seite bei jedem Aufruf neu zu rendern.
  
-By adding ''?linkonly'' you provide a link to the media without displaying it inline+----
  
-  {{wiki:dokuwiki-128.png?linkonly}}+===== 14. Plugin-spezifische Syntax =====
  
-{{wiki:dokuwiki-128.png?linkonly}} This is just a link to the image.+Ihre Installation verfügt über folgende Syntax-Plugins:
  
-==== Fallback Formats ====+==== Add New Page Plugin ==== 
 +<code> 
 +{{NEWPAGE}} 
 +{{NEWPAGE>namespace}} 
 +{{NEWPAGE>namespace?label=Benutzerdefiniertes Label}} 
 +</code>
  
-Unfortunately not all browsers understand all video and audio formats. To mitigate the problem, you can upload your file in different formats for maximum browser compatibility.+**Ergebnis:**\\ 
 +{{NEWPAGE}}\\ 
 +{{NEWPAGE>namespace}}\\ 
 +{{NEWPAGE>namespace?label=Benutzerdefiniertes Label}}
  
-For example consider this embedded mp4 video:+==== BPMN.io Plugin ==== 
 +<code> 
 +<bpmnio type="bpmn"> 
 +BPMN XML Inhalt hier... 
 +</bpmnio> 
 +</code>
  
-  {{video.mp4|A funny video}}+**Ergebnis:** Rendert BPMN-Diagramme basierend auf dem bereitgestellten XML-Inhalt.
  
-When you upload a ''video.webm'' and ''video.ogv'' next to the referenced ''video.mp4'', DokuWiki will automatically add them as alternatives so that one of the three files is understood by your browser.+==== Bureaucracy Plugin ==== 
 +<code> 
 +<form> 
 +Action mail me@example.com 
 +Thanks "Vielen Dank für Ihre Eingabe."
  
-Additionally DokuWiki supports a "poster" image which will be shown before the video has started. That image needs to have the same filename as the video and be either a jpg or png file. In the example above a ''video.jpg'' file would work.+Fieldset "Persönliche Daten" 
 +Textbox "Name" "=Ihr Name" 
 +email "E-Mail Adresse" @@
  
-===== Lists =====+submit "Absenden" 
 +</form> 
 +</code>
  
-Dokuwiki supports ordered and unordered lists. To create a list item, indent your text by two spaces and use a ''*'' for unordered lists or a ''-'' for ordered ones.+**Ergebnis:** Erstellt ein funktionsfähiges Formular mit E-Mail-Versand.
  
-  * This is a list +==== Color Plugin ==== 
-  * The second item +<code> 
-    * You may have different levels +<color green>grüner Text</color> 
-  * Another item+<color blue/lightgrey>blauer Text auf hellgrauem Hintergrund</color> 
 +<color #FF0000>roter Text</color> 
 +</code>
  
-  - The same list but ordered +**Ergebnis:**\\ 
-  - Another item +<color green>grüner Text</color>\\ 
-    - Just use indention for deeper levels +<color blue/lightgrey>blauer Text auf hellgrauem Hintergrund</color>\\ 
-  - That's it+<color #FF0000>roter Text</color>
  
 +==== DataTables Plugin ====
 <code> <code>
-  * This is a list +<datatables> 
-  * The second item +^ Spalte A ^ Spalte B ^ Spalte C ^ 
-    * You may have different levels +| Zeile A1 | Zeile B1 | Zeile C1 | 
-  * Another item+| Zeile A2 | Zeile B2 | Zeile C2 | 
 +</datatables> 
 +</code>
  
-  - The same list but ordered +**Ergebnis:** Erstellt eine interaktive Tabelle mit Sortier-, Filter- und Suchfunktionen. 
-  - Another item + 
-    - Just use indention for deeper levels +==== Icons Plugin ==== 
-  - That's it+<code> 
 +{{icon>home}} 
 +{{fa>home|Startseite}} 
 +{{glyphicon>user?24}}
 </code> </code>
  
-Also take a look at the [[doku>faq:lists|FAQ on list items]].+**Ergebnis:**\\ 
 +{{icon>home}}\\ 
 +{{fa>home|Startseite}}\\ 
 +{{glyphicon>user?24}}
  
-===== Text Conversions =====+==== Struct Plugin ==== 
 +<code> 
 +---- struct data ---- 
 +schema: person 
 +name: Max Mustermann 
 +email: max@example.com 
 +---- 
 +</code>
  
-DokuWiki can convert certain pre-defined characters or strings into images or other text or HTML.+**Ergebnis:** Speichert strukturierte Daten, die später abgefragt werden können.
  
-The text to image conversion is mainly done for smileys. And the text to HTML conversion is used for typography replacements, but can be configured to use other HTML as well.+==== Tag Plugin ==== 
 +<code> 
 +{{tag>tag1 tag2 tag3}} 
 +{{topic>tag1 -tag2}} 
 +{{count>+}} 
 +</code>
  
-==== Text to Image Conversions ====+**Ergebnis:**\\ 
 +{{tag>tag1 tag2 tag3}}\\ 
 +{{topic>tag1 -tag2}}\\ 
 +{{count>+}}
  
-DokuWiki converts commonly used [[wp>emoticon]]s to their graphical equivalents. Those [[doku>Smileys]] and other images can be configured and extended. Here is an overview of Smileys included in DokuWiki:+==== ToDo Plugin ==== 
 +<code> 
 +<todo>Titel der Aufgabe</todo> 
 +<todo #>Erledigte Aufgabe</todo> 
 +<todo @benutzer>Aufgabe für Benutzer</todo> 
 +</code>
  
-  * 8-) %%  8-)  %% +**Ergebnis:**\\ 
-  * 8-O %%  8-O  %% +<todo>Titel der Aufgabe</todo>\\ 
-  * :-( %%  :-(  %% +<todo #>Erledigte Aufgabe</todo>\\ 
-  * :-) %%  :-)  %% +<todo @benutzer>Aufgabe für Benutzer</todo>
-  * =)  %%  =)   %% +
-  * :-/ %%  :-/  %% +
-  * :-\ %%  :-\  %% +
-  * :-? %%  :-?  %% +
-  * :-D %%  :-D  %% +
-  * :-P %%  :-P  %% +
-  * :-O %%  :-O  %% +
-  * :-X %%  :-X  %% +
-  * :-| %%  :-|  %% +
-  * ;-) %%  ;-)  %% +
-  * ^_^ %%  ^_^  %% +
-  * :?: %%  :?:  %% +
-  * :!: %%  :!:  %% +
-  * LOL %%  LOL  %% +
-  * FIXME %%  FIXME %% +
-  * DELETEME %% DELETEME %%+
  
-==== Text to HTML Conversions ====+==== VShare Plugin ==== 
 +<code> 
 +{{youtube>L-WM8YxwqEU}} 
 +{{vimeo>123456789}} 
 +{{youtube>L-WM8YxwqEU?large}} 
 +</code>
  
-Typography: [[DokuWiki]] can convert simple text characters to their typographically correct entities. Here is an example of recognized characters.+**Ergebnis:** Bettet Videos von YouTube, Vimeo und anderen Plattformen ein.
  
--> <- <-> => <= <=> >> << -- --- 640x480 (c) (tm) (r) +==== Wrap Plugin ==== 
-"He thought 'It's a man's world'..."+<code> 
 +<WRAP classes #id width :language> 
 +"großer" Inhalt 
 +</WRAP>
  
 +<wrap classes #id width :language>"kleiner" Inhalt</wrap>
 +</code>
 +
 +**Ergebnis:** Erstellt Container mit CSS-Klassen für erweiterte Formatierung.
 +
 +----
 +
 +===== 15. Fehlerbehebung für DokuWiki 2024-02-06b "Kaos" =====
 +
 +==== Bekannte Probleme und Lösungen ====
 +
 +=== Formatierte Tabellen-Problem ===
 +  * **Problem:** Tabellen mit komplexer Formatierung werden nicht korrekt gerendert
 +  * **Lösung:** Entfernen Sie temporär die Tabellenformatierung aus dem Quelltext
 +  * **Langfristig:** Warten Sie auf offizielle Patches
 +
 +=== PHP 8.1 Kompatibilität ===
 +  * **Problem:** Fehler beim Upgrade von PHP 7.4 auf 8.1
 +  * **Lösung:** Überprüfen Sie Plugin-Kompatibilität und aktualisieren Sie alle Plugins
 +  * **Beispiel-Fix für ckgedit Plugin:**
 +
 +<code php>
 +function checkuserfiles() {
 +    $expire = 0; // Diese Zeile hinzufügen
 +    // Rest der Funktion...
 +}
 +</code>
 +
 +=== Cache-Probleme ===
 +  * Browser-Cache leeren (Strg+F5)
 +  * ''%%~~NOCACHE~~%%'' temporär verwenden
 +  * Admin: Cache über Konfiguration leeren
 +
 +=== Plugin-Konflikte ===
 +  * Plugins einzeln deaktivieren
 +  * Kompatibilität mit DokuWiki-Version prüfen
 +  * Plugin-Dokumentation konsultieren
 +
 +----
 +
 +===== 16. Best Practices und Tipps =====
 +
 +==== Performance-Optimierung ====
 +  * Verwenden Sie ''%%~~NOCACHE~~%%'' nur wenn nötig
 +  * Große Bilder vor dem Upload optimieren
 +  * Bei vielen Medien: Ordnerstruktur verwenden
 +
 +==== Barrierefreiheit ====
 +  * Alt-Text für Bilder verwenden
 +  * Aussagekräftige Link-Texte
 +  * Logische Überschriftenhierarchie
 +
 +==== Wartung ====
 +  * Regelmäßige Backups
 +  * Plugin-Updates beachten
 +  * Broken Links prüfen
 +
 +==== Sicherheit ====
 +  * Sichere Passwörter verwenden
 +  * ACL-Einstellungen prüfen
 +  * Regelmäßige Updates
 +
 +----
 +
 +===== 17. Erweiterte Funktionen =====
 +
 +==== Anker-Links ====
 <code> <code>
--> <- <-> => <= <=> >> << -- --- 640x480 (c) (tm) (r) +Dies verlinkt zu [[syntax#internal|diesem Abschnitt]].
-"He thought 'It's a man's world'..."+
 </code> </code>
  
-The same can be done to produce any kind of HTML, it just needs to be added to the [[doku>entities|pattern file]].+**Ergebnis:**\\ 
 +Dies verlinkt zu [[syntax#internal|diesem Abschnitt]].
  
-There are three exceptions which do not come from that pattern file: multiplication entity (640x480), 'single' and "double quotes". They can be turned off through a [[doku>config:typography|config option]].+==== Namespaces ==== 
 +<code> 
 +[[some:namespaces]] 
 +</code>
  
-===== Quoting =====+**Ergebnis:**\\ 
 +[[some:namespaces]]
  
-Some times you want to mark some text to show it's a reply or comment. You can use the following syntax:+Verwenden Sie Doppelpunkte, um Namespaces zu erstellen.
  
 +==== Sektionsbearbeitung ====
 +Jede Überschrift wird automatisch zu einem bearbeitbaren Abschnitt.
 +
 +----
 +
 +**Diese umfassende Syntaxreferenz deckt alle verfügbaren Funktionen Ihrer wiki.satware.com Installation ab und ist speziell auf DokuWiki 2024-02-06b "Kaos" abgestimmt. Bei Problemen konsultieren Sie die DokuWiki-Community oder die offizielle Dokumentation.**
 +
 +{{tag>wiki syntax dokuwiki referenz 2024}}
 +
 +
 +----
 +
 +===== 18. Reveal.js Slideshow Plugin =====
 +
 +==== Plugin-Übersicht ====
 +Das **Reveal.js Plugin** ermöglicht es, DokuWiki-Seiten in professionelle HTML5-Präsentationen umzuwandeln. Basierend auf dem beliebten Reveal.js Framework von Hakim El Hattab.
 +
 +  * **GitHub Repository:** [[https://github.com/neuralyzer/dokuwiki-plugin-revealjs|neuralyzer/dokuwiki-plugin-revealjs]]
 +  * **Reveal.js Version:** 3.9.2
 +  * **DokuWiki Kompatibilität:** 2024-02-06b "Kaos" und früher
 +  * **Lizenz:** MIT (Reveal.js Framework)
 +
 +==== Grundlegende Verwendung ====
 +
 +=== Präsentation aktivieren ===
 <code> <code>
-I think we should do it+~~REVEAL~~ 
 +</code>
  
-> No we shouldn't+**Ergebnis:** Fügt einen "Präsentation starten" Button ein. **Obligatorisch** für alle Präsentationen.
  
->> Well, I say we should+=== Theme-Auswahl === 
 +<code> 
 +~~REVEAL white~~ 
 +~~REVEAL theme=sky&transition=convex&controls=1~~ 
 +</code>
  
-> Really?+**Verfügbare Themes:** 
 +  * ''black'', ''white'', ''beige'', ''blood'', ''league'', ''default'' 
 +  * ''moon'', ''night'', ''serif'', ''simple'', ''sky'', ''solarized'' 
 +  * ''dokuwiki'' (solarized mit DokuWiki-Hintergrundfarbe)
  
->> Yes!+==== Folien-Struktur ====
  
->>> Then lets do it!+=== Header-basierte Folien === 
 +<code> 
 +====== Hauptfolie (H1) ====== 
 +Inhalt der ersten Folie 
 + 
 +===== Horizontale Folie (H2) ===== 
 +Inhalt der zweiten Folie 
 + 
 +==== Vertikale Folie (H3) ==== 
 +Unterfolie (vertikal verschachtelt) 
 + 
 +=== Weitere vertikale Folie === 
 +Noch eine Unterfolie
 </code> </code>
  
-I think we should do it+**Folien-Hierarchie:** 
 +  * **H1 (======):** Hauptfolien (horizontal) 
 +  * **H2 (=====):** Horizontale Folien 
 +  * **H3 (====) und tiefer:** Vertikale Folien (verschachtelt)
  
-> No we shouldn't+=== Konfigurierbare Folien-Ebenen === 
 +<code> 
 +~~REVEAL horizontal_slide_level=1~~ 
 +</code>
  
->> Well, I say we should+**horizontal_slide_level Optionen:** 
 +  * ''1'': H1+ horizontal, H2+ vertikal 
 +  * ''2'': H2+ horizontal, H3+ vertikal (Standard)
  
-> Really?+==== Hintergrund-Gestaltung ====
  
->> Yes!+=== Einfache Hintergründe === 
 +<code> 
 +{{background>red}} 
 +===== Folie mit rotem Hintergrund =====
  
->>> Then lets do it!+{{background>:wiki:dokuwiki-128.png}} 
 +===== Folie mit Bild-Hintergrund ===== 
 +</code>
  
-===== Tables =====+=== Erweiterte Hintergrund-Optionen === 
 +<code> 
 +{{background>orange wiki:dokuwiki-128.png 10% repeat bg-slide}} 
 +===== Folie mit komplexem Hintergrund ===== 
 +</code>
  
-DokuWiki supports a simple syntax to create tables.+**Hintergrund-Parameter:** 
 +  * **Farben:** HTML-Farbnamen, Hex (''#ff0000''), RGB, HSL 
 +  * **Bilder:** DokuWiki-Medien ('':wiki:image.png'') oder URLs 
 +  * **Größe:** ''10%'', ''250px'', ''auto'', ''contain'', ''cover'' 
 +  * **Position:** ''top'', ''bottom'', ''left'', ''right'', ''center'' 
 +  * **Wiederholung:** ''repeat'' (Standard: no-repeat) 
 +  * **Übergang:** ''bg-none'', ''bg-fade'', ''bg-slide'', ''bg-convex'', ''bg-concave'', ''bg-zoom''
  
-^ Heading 1      ^ Heading 2       ^ Heading 3          ^ +==== Alternative Folien-Indikatoren ====
-| Row 1 Col 1    | Row 1 Col 2     | Row 1 Col 3        | +
-| Row 2 Col 1    | some colspan (note the double pipe) || +
-| Row 3 Col 1    | Row 3 Col 2     | Row 3 Col 3        |+
  
-Table rows have to start and end with a ''|'' for normal rows or a ''^'' for headers.+=== Horizontale Folien === 
 +<code> 
 +---- orange wiki:dokuwiki-128.png 10% repeat bg-slide zoom-in fade-out slow no-footer ---->
  
-  ^ Heading 1      ^ Heading 2       ^ Heading 3          ^ +Folien-Inhalt hier
-  | Row 1 Col 1    | Row 1 Col 2     | Row 1 Col 3        | +
-  | Row 2 Col 1    | some colspan (note the double pipe) || +
-  | Row 3 Col 1    | Row 3 Col 2     | Row 3 Col 3        |+
  
-To connect cells horizontally, just make the next cell completely empty as shown above. Be sure to have always the same amount of cell separators!+<---- 
 +</code>
  
-Vertical tableheaders are possible, too.+**Syntax-Elemente:** 
 +  * ''---->'': Neue horizontale Folie öffnen 
 +  * ''<----'': Folie schließen 
 +  * ''---->>'': Vertikaler Folien-Container öffnen 
 +  * ''<<----'': Vertikalen Container schließen
  
-|              ^ Heading 1            ^ Heading 2          ^ +=== Parameter für alternative Indikatoren === 
-^ Heading 3    | Row 1 Col 2          | Row 1 Col 3        | +<code> 
-^ Heading 4    | no colspan this time |                    | +---- salmon wiki:dokuwiki-128.png 10% repeat bg-slide zoom-in fade-out slow no-footer ----> 
-^ Heading 5    | Row 2 Col 2          | Row 2 Col 3        |+</code>
  
-As you can see, it's the cell separator before a cell which decides about the formatting:+**Übergangs-Optionen:** 
 +  * **Folien-Übergang:** ''none'', ''fade'', ''slide'', ''convex'', ''concave'', ''zoom'' 
 +  * **Richtung:** ''-in'', ''-out'' (z.B. ''zoom-in'', ''fade-out'') 
 +  * **Geschwindigkeit:** ''default'', ''fast'', ''slow''
  
-  |              ^ Heading 1            ^ Heading 2          ^ +==== Fragmente (Schrittweise Anzeige) ====
-  ^ Heading 3    | Row 1 Col 2          | Row 1 Col 3        | +
-  ^ Heading 4    | no colspan this time |                    | +
-  ^ Heading 5    | Row 2 Col 2          | Row 2 Col 3        |+
  
-You can have rowspans (vertically connected cells) by adding ''%%:::%%'' into the cells below the one to which they should connect.+=== Inline-Fragmente === 
 +<code> 
 +<fragment>Erscheint zuerst...</fragment>
  
-^ Heading 1      ^ Heading 2                  ^ Heading 3          ^ +<fragment>...dann das hier...</fragment>
-| Row 1 Col 1    | this cell spans vertically | Row 1 Col 3        | +
-| Row 2 Col 1    | :::                        | Row 2 Col 3        | +
-| Row 3 Col 1    | :::                        | Row 2 Col 3        |+
  
-Apart from the rowspan syntax those cells should not contain anything else.+<fragment>...und schließlich das!</fragment> 
 +</code>
  
-  ^ Heading 1      ^ Heading 2                  ^ Heading 3          ^ +=== Block-Fragmente === 
-  | Row 1 Col 1    | this cell spans vertically | Row 1 Col 3        | +<code> 
-  | Row 2 Col 1    | :::                        | Row 2 Col 3        | +<fragment-block> 
-  | Row 3 Col 1    | :::                        | Row 2 Col 3        |+==== Überschrift erscheint komplett ==== 
 +  * Listenpunkt 1 
 +  * Listenpunkt 2 
 +  * Listenpunkt 3 
 +</fragment-block> 
 +</code>
  
-You can align the table contents, too. Just add at least two whitespaces at the opposite end of your text: Add two spaces on the left to align right, two spaces on the right to align left and two spaces at least at both ends for centered text.+=== Fragment-Listen === 
 +<code> 
 +<fragment-list> 
 +  * Punkt 1 (erscheint einzeln) 
 +  * Punkt 2 (erscheint einzeln) 
 +  * Punkt 3 (erscheint einzeln) 
 +</fragment-list>
  
-^           Table with alignment           ^^^ +<no-fragment-list> 
-|         right|    center    |left          | +  * Alle Punkte (erscheinen zusammen) 
-|left          |         right|    center    | +  * Auch bei aktivierter build_all_lists Option 
-| xxxxxxxxxxxx | xxxxxxxxxxxx | xxxxxxxxxxxx |+</no-fragment-list> 
 +</code>
  
-This is how it looks in the source:+=== Fragment-Stile und Indizes === 
 +<code> 
 +<fragment style="fade-in" index="1">Erstes Fragment</fragment> 
 +<fragment style="highlight-red" index="2">Zweites Fragment</fragment> 
 +</code>
  
-  ^           Table with alignment           ^^^ +**Fragment-Stile:** 
-  |         right|    center    |left          | +  * ''fade-in'', ''fade-out'', ''fade-up'', ''fade-down'' 
-  |left          |         right|    center    | +  * ''zoom-in'', ''zoom-out'' 
-  | xxxxxxxxxxxx | xxxxxxxxxxxx | xxxxxxxxxxxx |+  * ''highlight-red'', ''highlight-green'', ''highlight-blue'' 
 +  * ''current-visible'', ''semi-fade-out''
  
-Note: Vertical alignment is not supported.+==== Sprecher-Notizen ====
  
-===== No Formatting =====+<code> 
 +===== Folie-Titel ===== 
 +Sichtbarer Folien-Inhalt
  
-If you need to display text exactly like it is typed (without any formatting), enclose the area either with ''%%<nowiki>%%'' tags or even simpler, with double percent signs ''<nowiki>%%</nowiki>''.+<notes> 
 +  * Notiz für den Sprecher 
 +  * Nur im Sprecher-Modus sichtbar (Taste 's') 
 +  * Listen sind hier nie inkrementell 
 +</notes> 
 +</code>
  
-<nowiki> +**Sprecher-Modus aktivieren:** Taste ''s'' während der Präsentation drücken.
-This is some text which contains addresses like this: http://www.splitbrain.org and **formatting**, but nothing is done with it. +
-</nowiki> +
-The same is true for %%//__this__ text// with a smiley ;-)%%.+
  
-  <nowiki> +==== Fußzeilen ====
-  This is some text which contains addresses like this: http://www.splitbrain.org and **formatting**, but nothing is done with it. +
-  </nowiki> +
-  The same is true for %%//__this__ text// with a smiley ;-)%%.+
  
-===== Code Blocks =====+=== Globale Fußzeile === 
 +<code> 
 +<wrap footer> 
 +Firmenlogo oder Copyright-Hinweis 
 +</wrap>
  
-You can include code blocks into your documents by either indenting them by at least two spaces (like used for the previous examples) or by using the tags ''%%<code>%%'' or ''%%<file>%%''.+====== Erste Folie ====== 
 +Inhalt... 
 +</code>
  
-  This is text is indented by two spaces.+=== Fußzeile für einzelne Folien deaktivieren === 
 +<code> 
 +{{no-footer}} 
 +===== Folie ohne Fußzeile ===== 
 + 
 +{{background>:images:image1.png no-footer}} 
 +===== Folie mit Hintergrund ohne Fußzeile ===== 
 + 
 +---- no-footer ----> 
 +Alternative Folien-Syntax ohne Fußzeile 
 +</code> 
 + 
 +==== Konfigurationsoptionen ====
  
 +=== Vollständige Parameter-Syntax ===
 <code> <code>
-This is preformatted code all spaces are preserved: like              <-this+~~REVEAL theme=sky&transition=convex&controls=1&show_progress_bar=1&build_all_lists=1&show_image_borders=0&horizontal_slide_level=2&enlarge_vertical_slide_headers=0&show_slide_details=1&open_in_new_window=1&auto_slide=6000&loop=1~~
 </code> </code>
  
-<file> +=== Wichtige Konfigurationsparameter ===
-This is pretty much the same, but you could use it to show that you quoted a file. +
-</file>+
  
-Those blocks were created by this source:+^ Parameter ^ Werte ^ Beschreibung ^ 
 +| ''theme'' | ''white'', ''black'', ''sky'', etc. | Präsentations-Theme | 
 +| ''transition'' | ''none'', ''fade'', ''slide'', ''convex'', ''concave'', ''zoom'' | Folien-Übergang | 
 +| ''controls'' | ''0'', ''1'' | Navigations-Kontrollen anzeigen | 
 +| ''show_progress_bar'' | ''0'', ''1'' | Fortschrittsbalken anzeigen | 
 +| ''build_all_lists'' | ''0'', ''1'' | Listen schrittweise aufbauen | 
 +| ''show_image_borders'' | ''0'', ''1'' | Bild-Rahmen anzeigen | 
 +| ''horizontal_slide_level'' | ''1'', ''2'' | Header-Ebene für horizontale Folien | 
 +| ''enlarge_vertical_slide_headers'' | ''0'', ''1'' | Vertikale Folien-Header vergrößern | 
 +| ''size'' | ''960x700'' | Basis-Foliengröße in Pixeln | 
 +| ''auto_slide'' | ''0'', ''6000'' | Automatischer Folien-Wechsel (ms) | 
 +| ''loop'' | ''0'', ''1'' | Präsentation wiederholen |
  
-    This is text is indented by two spaces.+==== PDF-Export ====
  
-  <code> +=== Export-URL === 
-  This is preformatted code all spaces are preserved: like              <-this +<code> 
-  </code>+Normale URL: 
 +http://example.com/doku.php?do=export_revealjs&id=example:page
  
-  <file> +PDF-Export URL: 
-  This is pretty much the same, but you could use it to show that you quoted a file. +http://example.com/doku.php?do=export_revealjs&id=example:page&print-pdf 
-  </file>+</code>
  
-==== Syntax Highlighting ====+=== Export-Schritte === 
 +  - URL mit ''&print-pdf'' Parameter aufrufen 
 +  - Seite lädt im PDF-Export-Modus 
 +  - Browser-Druckfunktion verwenden (Strg+P) 
 +  - Als PDF speichern
  
-[[wiki:DokuWiki]] can highlight sourcecode, which makes it easier to read. It uses the [[http://qbnz.com/highlighter/|GeSHi]] Generic Syntax Highlighter -- so any language supported by GeSHi is supported. The syntax uses the same code and file blocks described in the previous section, but this time the name of the language syntax to be highlighted is included inside the tag, e.g. ''<nowiki><code java></nowiki>'' or ''<nowiki><file java></nowiki>''.+**Empfohlene Browser:** Chrome oder Chromium für beste Ergebnisse.
  
-<code java> +==== Best Practices ==== 
-/** + 
- * The HelloWorldApp class implements an application that +=== Folien-Design === 
- * simply displays "Hello World!" to the standard output. +  * **Wenig Text:** Maximal 6-8 Zeilen pro Folie 
- */ +  * **Große Schrift:** Gut lesbar auch von hinten 
-class HelloWorldApp { +  * **Kontrast:** Dunkler Text auf hellem Hintergrund oder umgekehrt 
-    public static void main(String[] args) { +  * **Bilder optimieren:** Nicht zu große Dateien verwenden 
-        System.out.println("Hello World!"); //Display the string.+ 
 +=== Navigation === 
 +  * **Tastatur:** Pfeiltasten für Navigation 
 +  * **Maus:** Klick für nächste Folie 
 +  * **Touch:** Wischen auf mobilen Geräten 
 +  * **Übersicht:** Taste ''Esc'' für Folien-Übersicht 
 + 
 +=== Performance === 
 +  * ''%%~~NOCACHE~~%%'' für dynamische Inhalte 
 +  * Bilder vor Upload komprimieren 
 +  * Nicht zu viele Fragmente pro Folie 
 + 
 +=== Kompatibilität === 
 +  * **Include Plugin:** Siehe Kompatibilitäts-Fix in Plugin-Dokumentation 
 +  * **MathJax:** Wird automatisch geladen (ignoriert DokuWiki MathJax Plugin) 
 +  * **Wrap Plugin:** Vollständig kompatibel 
 + 
 +==== Beispiel-Präsentation ==== 
 + 
 +<code> 
 +~~REVEAL white~~ 
 + 
 +====== Meine Präsentation ====== 
 +**Untertitel hier** 
 + 
 +Datum und Autor 
 + 
 +===== Agenda ===== 
 +  * Punkt 1 
 +  * Punkt 2   
 +  * Punkt 3 
 + 
 +{{background>lightblue}} 
 +===== Hauptteil ===== 
 + 
 +<fragment>Erster wichtiger Punkt</fragment> 
 + 
 +<fragment>Zweiter wichtiger Punkt</fragment> 
 + 
 +<fragment-block> 
 +==== Detaillierte Informationen ==== 
 +  * Detail A 
 +  * Detail B 
 +  * Detail C 
 +</fragment-block> 
 + 
 +==== Unterfolie ==== 
 +Vertikale Navigation mit Pfeiltasten 
 + 
 +<notes> 
 +Sprecher-Notizen: 
 +- Punkt A erwähnen 
 +- Fragen stellen 
 +- Auf nächste Folie überleiten 
 +</notes> 
 + 
 +===== Zusammenfassung ===== 
 +  * Wichtigste Erkenntnisse 
 +  * Nächste Schritte 
 +  * Kontakt-Informationen 
 + 
 +===== Vielen Dank! ===== 
 +**Fragen?** 
 + 
 +{{background>:images:company-logo.png}} 
 +</code> 
 + 
 +==== Fehlerbehebung ==== 
 + 
 +=== Häufige Probleme === 
 + 
 +^ Problem ^ Lösung ^ 
 +| Präsentation startet nicht | ''%%~~REVEAL~~%%'' am Seitenanfang hinzufügen | 
 +| Folien werden nicht getrennt | Header-Syntax prüfen (====== vs =====) | 
 +| Hintergrund wird nicht angezeigt | Bild-Pfad und Dateiformat überprüfen | 
 +| Fragmente funktionieren nicht | Syntax von ''<fragment>'' Tags prüfen | 
 +| PDF-Export fehlerhaft | Chrome/Chromium Browser verwenden | 
 + 
 +=== Bekannte Einschränkungen === 
 +  * **PHP 7.4+ erforderlich:** Ältere Versionen nicht unterstützt 
 +  * **DokuWiki "Igor" Kompatibilität:** Begrenzte Unterstützung 
 +  * **Plugin-Konflikte:** Include Plugin benötigt Anpassung 
 +  * **MathJax:** Verwendet eigene MathJax-Einbindung 
 + 
 +=== Debug-Tipps === 
 +  * Browser-Entwicklertools für JavaScript-Fehler 
 +  * ''%%~~NOCACHE~~%%'' für Konfigurationsänderungen 
 +  * Plugin-Manager für Aktivierung/Deaktivierung 
 +  * DokuWiki-Logs für Server-seitige Fehler 
 + 
 +---- 
 + 
 +**Das Reveal.js Plugin erweitert DokuWiki um professionelle Präsentationsfähigkeiten. Für detaillierte Informationen und Updates besuchen Sie das [[https://github.com/neuralyzer/dokuwiki-plugin-revealjs|GitHub Repository]].** 
 + 
 +{{tag>reveal.js präsentation slideshow plugin dokuwiki}} 
 + 
 +---- 
 + 
 +===== 19. Mermaid Plugin ===== 
 + 
 +==== Plugin-Übersicht ==== 
 +Das **Mermaid Plugin** ermöglicht die Erstellung von Diagrammen und Flussdiagrammen mit der JavaScript-basierten Bibliothek [Mermaid](https://mermaid.js.org/). Mermaid rendert Markdown-inspirierte Textdefinitionen zu interaktiven Diagrammen. 
 + 
 +  * **GitHub Repository:** [[https://github.com/RobertWeinmeister/dokuwiki-mermaid|RobertWeinmeister/dokuwiki-mermaid]] 
 +  * **Mermaid Version:** 11.6.0 (lokal gehostet) 
 +  * **DokuWiki Kompatibilität:** 2024-02-06b "Kaos" ✅ 
 +  * **PHP Anforderung:** 8.0+ (⚠️ wichtig für Funktionalität) 
 +  * **Lizenz:** GNU GPL v2.0 (Plugin), MIT (Mermaid.js) 
 + 
 +==== Grundlegende Verwendung ==== 
 + 
 +=== Einfaches Diagramm === 
 +<code> 
 +<mermaid> 
 +  graph TD 
 +    A[Start] --> B{Entscheidung} 
 +    B -->|Ja| C[Aktion 1] 
 +    B -->|Nein| D[Aktion 2] 
 +    C --> E[Ende] 
 +    D --> E 
 +</mermaid> 
 +</code> 
 + 
 +**Ergebnis:** Rendert ein interaktives Flussdiagramm. 
 + 
 +=== Grundlegende Syntax-Regeln === 
 +  * **Container:** Verwenden Sie ''<mermaid>'' und ''</mermaid>'' Tags 
 +  * **Diagramm-Typ:** Definiert die erste Zeile (z.B. ''graph TD'', ''sequenceDiagram'') 
 +  * **Knoten:** Definiert mit verschiedenen Formen: ''A[Text]'', ''B(Text)'', ''C{Text}'' 
 +  * **Verbindungen:** Verwenden Sie Pfeile: ''-->'', ''---'', ''-.->'' 
 + 
 +==== Unterstützte Diagramm-Typen ==== 
 + 
 +=== Flussdiagramme (Flowcharts) === 
 +<code> 
 +<mermaid> 
 +  flowchart TD 
 +    A[Rechteck] --> B(Runde Ecken) 
 +    B --> C{Raute} 
 +    C -->|Ja| D[Ergebnis 1] 
 +    C -->|Nein| E[Ergebnis 2] 
 +    D --> F((Kreis)) 
 +    E --> F 
 +</mermaid> 
 +</code> 
 + 
 +**Richtungen:** 
 +  * ''TD'' oder ''TB'': Top-Down (oben nach unten) 
 +  * ''BT'': Bottom-Top (unten nach oben) 
 +  * ''LR'': Left-Right (links nach rechts) 
 +  * ''RL'': Right-Left (rechts nach links) 
 + 
 +=== Sequenzdiagramme === 
 +<code> 
 +<mermaid> 
 +  sequenceDiagram 
 +    participant A as Kunde 
 +    participant B as Server 
 +    participant C as Datenbank 
 +     
 +    A->>B: Anfrage senden 
 +    B->>C: Daten abfragen 
 +    C-->>B: Daten zurückgeben 
 +    B-->>A: Antwort senden 
 +     
 +    Note over A,C: Kommunikation beendet 
 +</mermaid> 
 +</code> 
 + 
 +**Pfeil-Typen:** 
 +  * ''A->>B'': Solider Pfeil 
 +  * ''A-->>B'': Gestrichelter Pfeil 
 +  * ''A-xB'': Pfeil mit Kreuz 
 +  * ''A--xB'': Gestrichelter Pfeil mit Kreuz 
 + 
 +=== Gantt-Diagramme === 
 +<code> 
 +<mermaid> 
 +  gantt 
 +    title Projektplan 
 +    dateFormat  YYYY-MM-DD 
 +    section Planung 
 +    Anforderungen sammeln :done, des1, 2024-01-01,2024-01-05 
 +    System-Design        :active, des2, 2024-01-06, 3d 
 +    section Entwicklung 
 +    Frontend entwickeln  :2024-01-10, 7d 
 +    Backend entwickeln   :2024-01-15, 10d 
 +    section Tests 
 +    Unit Tests          :2024-01-20, 3d 
 +    Integration Tests   :2024-01-23, 2d 
 +</mermaid> 
 +</code> 
 + 
 +=== Klassendiagramme === 
 +<code> 
 +<mermaid> 
 +  classDiagram 
 +    class Fahrzeug { 
 +      +String marke 
 +      +String modell 
 +      +int baujahr 
 +      +starten() 
 +      +stoppen()
     }     }
-}+     
 +    class Auto { 
 +      +int anzahlTueren 
 +      +boolean automatik 
 +      +fahren() 
 +    } 
 +     
 +    class Motorrad { 
 +      +String motortyp 
 +      +beschleunigen() 
 +    } 
 +     
 +    Fahrzeug <|-- Auto 
 +    Fahrzeug <|-- Motorrad 
 +</mermaid>
 </code> </code>
  
-The following language strings are currently recognized: //4cs, 6502acme, 6502kickass, 6502tasm, 68000devpac, abap, actionscript-french, actionscript, actionscript3, ada, algol68, apache, applescript, asm, asp, autoconf, autohotkey, autoit, avisynth, awk, bascomavr, bash, basic4gl, bf, bibtex, blitzbasic, bnf, boo, c, c_loadrunner, c_mac, caddcl, cadlisp, cfdg, cfm, chaiscript, cil, clojure, cmake, cobol, coffeescript, cpp, cpp-qt, csharp, css, cuesheet, d, dcs, delphi, diff, div, dos, dot, e, epc, ecmascript, eiffel, email, erlang, euphoria, f1, falcon, fo, fortran, freebasic, fsharp, gambas, genero, genie, gdb, glsl, gml, gnuplot, go, groovy, gettext, gwbasic, haskell, hicest, hq9plus, html, html5, icon, idl, ini, inno, intercal, io, j, java5, java, javascript, jquery, kixtart, klonec, klonecpp, latex, lb, lisp, llvm, locobasic, logtalk, lolcode, lotusformulas, lotusscript, lscript, lsl2, lua, m68k, magiksf, make, mapbasic, matlab, mirc, modula2, modula3, mmix, mpasm, mxml, mysql, newlisp, nsis, oberon2, objc, objeck, ocaml-brief, ocaml, oobas, oracle8, oracle11, oxygene, oz, pascal, pcre, perl, perl6, per, pf, php-brief, php, pike, pic16, pixelbender, pli, plsql, postgresql, povray, powerbuilder, powershell, proftpd, progress, prolog, properties, providex, purebasic, pycon, python, q, qbasic, rails, rebol, reg, robots, rpmspec, rsplus, ruby, sas, scala, scheme, scilab, sdlbasic, smalltalk, smarty, sql, systemverilog, tcl, teraterm, text, thinbasic, tsql, typoscript, unicon, uscript, vala, vbnet, vb, verilog, vhdl, vim, visualfoxpro, visualprolog, whitespace, winbatch, whois, xbasic, xml, xorg_conf, xpp, yaml, z80, zxbasic//+=== Git-Graphen === 
 +<code> 
 +<mermaid> 
 +  gitGraph 
 +    commit id: "Initial" 
 +    branch develop 
 +    checkout develop 
 +    commit id: "Feature A" 
 +    commit id: "Feature B" 
 +    checkout main 
 +    commit id: "Hotfix" 
 +    merge develop 
 +    commit id: "Release" 
 +</mermaid> 
 +</code>
  
-==== Downloadable Code Blocks ====+=== User Journey Diagramme === 
 +<code> 
 +<mermaid> 
 +  journey 
 +    title Benutzer-Journey: Online-Shopping 
 +    section Suche 
 +      Webseite besuchen: 5: Benutzer 
 +      Produkt suchen: 3: Benutzer 
 +      Ergebnisse filtern: 4: Benutzer 
 +    section Kauf 
 +      Produkt auswählen: 5: Benutzer 
 +      In Warenkorb legen: 5: Benutzer 
 +      Checkout: 3: Benutzer 
 +      Bezahlung: 2: Benutzer 
 +    section Lieferung 
 +      Bestellung bestätigen: 5: Benutzer 
 +      Lieferung verfolgen: 4: Benutzer 
 +      Produkt erhalten: 5: Benutzer 
 +</mermaid> 
 +</code>
  
-When you use the ''%%<code>%%'' or ''%%<file>%%'' syntax as above, you might want to make the shown code available for download as well. You can do this by specifying a file name after language code like this:+=== Entity-Relationship Diagramme === 
 +<code> 
 +<mermaid> 
 +  erDiagram 
 +    KUNDE ||--o{ BESTELLUNG : "erstellt" 
 +    BESTELLUNG ||--|{ BESTELLPOSITION : "enthält" 
 +    BESTELLPOSITION }o--|| PRODUKT : "bezieht sich auf" 
 +    PRODUKT }o--|| KATEGORIE : "gehört zu" 
 +     
 +    KUNDE { 
 +      int kunde_id 
 +      string name 
 +      string email 
 +      string adresse 
 +    } 
 +     
 +    BESTELLUNG { 
 +      int bestellung_id 
 +      int kunde_id 
 +      date bestelldatum 
 +      decimal gesamtbetrag 
 +    } 
 +     
 +    PRODUKT { 
 +      int produkt_id 
 +      string name 
 +      decimal preis 
 +      int kategorie_id 
 +    } 
 +</mermaid> 
 +</code>
  
 +=== Tortendiagramme ===
 <code> <code>
-<file php myexample.php> +<mermaid> 
-<?php echo "hello world!"; ?> +  pie title Marktanteile Browser 2024 
-</file>+    "Chrome" : 65.8 
 +    "Safari" : 18.8 
 +    "Edge" : 5.4 
 +    "Firefox" : 3.2 
 +    "Andere" : 6.8 
 +</mermaid>
 </code> </code>
  
-<file php myexample.php> +==== Erweiterte Funktionen ====
-<?php echo "hello world!"; ?> +
-</file>+
  
-If you don't want any highlighting but want a downloadable file, specify a dash (''-'') as the language code: ''%%<code - myfile.foo>%%''.+=== Größenanpassung === 
 +<code> 
 +<mermaid 100% 400px> 
 +  graph TD 
 +    A[Breite: 100%] --> B[Höhe: 400px] 
 +</mermaid>
  
 +<mermaid 500px 300px>
 +  graph LR
 +    C[Breite: 500px] --> D[Höhe: 300px]
 +</mermaid>
 +</code>
  
-===== Embedding HTML and PHP =====+**Unterstützte Einheiten:** 
 +  * **Pixel:** ''400px'', ''500px'' 
 +  * **Prozent:** ''100%'', ''50%'' 
 +  * **CSS-Einheiten:** ''10cm'', ''5in'', ''20em''
  
-You can embed raw HTML or PHP code into your documents by using the ''%%<html>%%'' or ''%%<php>%%'' tags. (Use uppercase tags if you need to enclose block level elements.)+=== Raw-Modus === 
 +<code> 
 +<mermaid> 
 +  raw 
 +  graph TD 
 +    A(**mermaid**)-->B((__plugin__)) 
 +    A-->C(((//for//))) 
 +    B-->D[["[[https://www.dokuwiki.org/dokuwiki|DokuWiki]]"]] 
 +    C-->D 
 +</mermaid> 
 +</code>
  
-HTML example:+**Raw-Modus Vorteile:** 
 +  * Keine DokuWiki-Syntax-Verarbeitung 
 +  * Vollständige Mermaid-Funktionalität verfügbar 
 +  * Vermeidet Konflikte zwischen DokuWiki und Mermaid-Syntax
  
 +=== DokuWiki-Links in Mermaid ===
 <code> <code>
-<html> +<mermaid> 
-This is some <span style="color:red;font-size:150%;">inline HTML</span> +  graph TD 
-</html> +    A[Start] --> B["[[wiki:syntax|Syntax-Seite]]"] 
-<HTML> +    B --> C["[[namespace:page|Interne Seite]]"] 
-<p style="border:2px dashed red;">And this is some block HTML</p> +    C --> D["[[https://www.dokuwiki.org|Externe Seite]]"] 
-</HTML>+</mermaid>
 </code> </code>
  
-<html> +**Link-Syntax-Regeln:** 
-This is some <span style="color:red;font-size:150%;">inline HTML</span> +  * **Interne Links:** ''[[seitenname|Anzeige-Text]]'' 
-</html> +  * **Externe Links:** ''[[URL|Anzeige-Text]]'' 
-<HTML> +  * **Anführungszeichen:** Notwendig bei Links in Mermaid-Knoten
-<p style="border:2px dashed red;">And this is some block HTML</p> +
-</HTML>+
  
-PHP example:+=== Styling und Themes === 
 +<code> 
 +<mermaid> 
 +  graph TD 
 +    A[Knoten A] --> B[Knoten B] 
 +    A --> C[Knoten C] 
 +    B --> D[Knoten D] 
 +    C --> D 
 +     
 +    %% Styling-Definitionen 
 +    classDef wichtig fill:#ff9999,stroke:#333,stroke-width:2px 
 +    classDef normal fill:#bbdefb,stroke:#333,stroke-width:1px 
 +     
 +    class A,D wichtig 
 +    class B,C normal 
 +</mermaid> 
 +</code> 
 + 
 +**Verfügbare Themes:** 
 +  * **Standard:** ''default'', ''neutral'', ''dark'' 
 +  * **Erweitert:** ''forest'', ''base'', ''mc-squared'' 
 + 
 +==== Diagramm-Export ==== 
 + 
 +=== SVG-Export aktivieren === 
 +**Administratoren müssen den Save-Button in der Plugin-Konfiguration aktivieren:** 
 +  - Admin → Konfiguration → Mermaid Plugin 
 +  - "Visibility of Save Button" auf "sichtbar" setzen 
 + 
 +=== Export-Funktionalität === 
 +  - **Maus über Diagramm:** Save-Button erscheint 
 +  - **SVG-Download:** Klick auf Save-Button startet Download 
 +  - **Format:** Behält exakte Darstellung bei 
 + 
 +=== Server-seitige Konvertierung === 
 +**Lock-Button aktivieren für statische SVG-Einbettung:** 
 +  - Verhindert client-seitige Konvertierung 
 +  - Nützlich für PDF-Export (dw2pdf Plugin) 
 +  - Archivierung von Seiten mit statischen Diagrammen 
 + 
 +==== Bekannte Probleme und Lösungen ==== 
 + 
 +=== Klammer-Konflikte === 
 +**Problem:** Mermaid und DokuWiki verwenden beide eckige Klammern.
  
 +**Lösung:** Anführungszeichen verwenden:
 <code> <code>
-<php> +%% Falsch: 
-echo 'The PHP version: '; +graph TD 
-echo phpversion(); +  A[Link] --> B[[internal:link]] 
-echo ' (generated inline HTML)'; + 
-</php> +%% Richtig: 
-<PHP> +graph TD 
-echo '<table class="inline"><tr><td>The same, but inside a block level element:</td>'; +  A[Link] --> B["[[internal:link]]"]
-echo '<td>'.phpversion().'</td>'; +
-echo '</tr></table>'; +
-</PHP>+
 </code> </code>
  
-<php> +=== Click-Events vs. DokuWiki-Links === 
-echo 'The PHP version: '; +**Problem:** Mermaid Click-Events kollidieren mit DokuWiki-Links.
-echo phpversion(); +
-echo ' (inline HTML)'; +
-</php> +
-<PHP> +
-echo '<table class="inline"><tr><td>The same, but inside a block level element:</td>'; +
-echo '<td>'.phpversion().'</td>'; +
-echo '</tr></table>'; +
-</PHP>+
  
-**Please Note**: HTML and PHP embedding is disabled by default in the configuration. If disabled, the code is displayed instead of executed.+**Schlecht:** 
 +<code> 
 +<mermaid> 
 +  flowchart TD 
 +    A[Link] 
 +    click A "https://www.github.com" 
 +</mermaid> 
 +</code>
  
-===== RSS/ATOM Feed Aggregation ===== +**Besser:** 
-[[DokuWiki]] can integrate data from external XML feeds. For parsing the XML feeds, [[http://simplepie.org/|SimplePie]] is used. All formats understood by SimplePie can be used in DokuWiki as well. You can influence the rendering by multiple additional space separated parameters:+<code> 
 +<mermaid> 
 +  flowchart TD 
 +    A["[[https://www.github.com|Link]]"] 
 +</mermaid> 
 +</code>
  
-^ Parameter  ^ Description ^ +=== Such-Highlighting === 
-| any number | will be used as maximum number items to show, defaults to 8 | +  * **Problem:** DokuWiki-Suchhervorhebung kann Mermaid-Parsing stören 
-| reverse    | display the last items in the feed first | +  * **Lösung:** Automatisch deaktiviert für Mermaid-Diagramme 
-| author     | show item authors names | +  * **Auswirkung:** Suche funktioniert normal, aber keine Hervorhebung in Diagrammen
-| date       | show item dates | +
-| description| show the item description. If [[doku>config:htmlok|HTML]] is disabled all tags will be stripped | +
-| nosort     | do not sort the items in the feed | +
-| //n//[dhm] | refresh period, where d=days, h=hours, m=minutes. (e.g. 12h = 12 hours). |+
  
-The refresh period defaults to 4 hours. Any value below 10 minutes will be treated as 10 minutes. [[wiki:DokuWiki]] will generally try to supply a cached version of a page, obviously this is inappropriate when the page contains dynamic external content. The parameter tells [[wiki:DokuWiki]] to re-render the page if it is more than //refresh period// since the page was last rendered.+==== Praktische Beispiele ====
  
-By default the feed will be sorted by date, newest items first. You can sort it by oldest first using the ''reverse'' parameter, or display the feed as is with ''nosort''.+=== Systemarchitektur === 
 +<code> 
 +<mermaid> 
 +  graph TB 
 +    subgraph "Frontend" 
 +      UI[Web-Interface] 
 +      API[API-Gateway] 
 +    end 
 +     
 +    subgraph "Backend" 
 +      AUTH[Authentication] 
 +      LOGIC[Business Logic] 
 +      CACHE[Redis Cache] 
 +    end 
 +     
 +    subgraph "Datenbank" 
 +      PG[(PostgreSQL)] 
 +      MONGO[(MongoDB)] 
 +    end 
 +     
 +    UI --> API 
 +    API --> AUTH 
 +    API --> LOGIC 
 +    LOGIC --> CACHE 
 +    LOGIC --> PG 
 +    LOGIC --> MONGO 
 +</mermaid> 
 +</code>
  
-**Example:**+=== Deployment-Pipeline === 
 +<code> 
 +<mermaid> 
 +  graph LR 
 +    DEV[Development] --> TEST[Testing] 
 +    TEST --> STAGE[Staging] 
 +    STAGE --> PROD[Production] 
 +     
 +    DEV --> |Git Push| BUILD[Build] 
 +    BUILD --> |Unit Tests| TEST 
 +    TEST --> |Integration Tests| STAGE 
 +    STAGE --> |Manual QA| PROD 
 +     
 +    BUILD -.-> |Artifacts| REPO[Artifact Repository] 
 +    REPO -.-> STAGE 
 +    REPO -.-> PROD 
 +</mermaid> 
 +</code>
  
-  {{rss>http://slashdot.org/index.rss 5 author date 1h }}+=== Entscheidungsbaum === 
 +<code> 
 +<mermaid> 
 +  graph TD 
 +    START[Problem identifiziert] --> CRITICAL{Kritisch?} 
 +    CRITICAL -->|Ja| IMMEDIATE[Sofortige Maßnahmen] 
 +    CRITICAL -->|Nein| ANALYZE[Analyse durchführen] 
 +     
 +    ANALYZE --> SOLUTION{Lösung verfügbar?} 
 +    SOLUTION -->|Ja| IMPLEMENT[Implementierung] 
 +    SOLUTION -->|Nein| RESEARCH[Weitere Recherche] 
 +     
 +    IMMEDIATE --> DOCUMENT[Dokumentation] 
 +    IMPLEMENT --> DOCUMENT 
 +    RESEARCH --> ANALYZE 
 +     
 +    DOCUMENT --> REVIEW[Review & Feedback] 
 +    REVIEW --> CLOSE[Abschluss] 
 +</mermaid> 
 +</code>
  
-{{rss>http://slashdot.org/index.rss 5 author date 1h }}+==== Konfiguration ====
  
 +=== Admin-Einstellungen ===
 +**Zugang:** Admin → Konfiguration → Mermaid Plugin
  
-===== Control Macros =====+^ Einstellung ^ Optionen ^ Beschreibung ^ 
 +| **Version/Ort** | Lokal (11.6.0), Remote (latest), Spezifische Version | Mermaid-Version auswählen | 
 +| **Standard-Theme** | default, neutral, dark, forest, base, mc-squared | Globales Theme | 
 +| **Standard-Look** | classic, handDrawn, rough | Darstellungsstil | 
 +| **Log-Level** | fatal, error, warn, info, debug | Debug-Informationen | 
 +| **Save-Button** | Sichtbar, Verborgen | SVG-Export-Funktionalität | 
 +| **Lock-Button** | Sichtbar, Verborgen | Server-seitige Konvertierung |
  
-Some syntax influences how DokuWiki renders a page without creating any output it self. The following control macros are availble:+=== Entwickler-Einstellungen === 
 +**Debug-Modus aktivieren:** 
 +  - Log-Level auf "debug" setzen 
 +  - Browser-Entwicklertools öffnen 
 +  - Konsole auf Mermaid-Fehler prüfen
  
-^ Macro           ^ Description | +==== Best Practices ====
-| %%~~NOTOC~~%%   | If this macro is found on the page, no table of contents will be created | +
-| %%~~NOCACHE~~%% | DokuWiki caches all output by default. Sometimes this might not be wanted (eg. when the %%<php>%% syntax above is used), adding this macro will force DokuWiki to rerender a page on every call |+
  
-===== Syntax Plugins =====+=== Performance === 
 +  * **Einfache Diagramme:** Bessere Ladezeiten 
 +  * **Komplexe Diagramme:** In Unterdiagramme aufteilen 
 +  * **Lokale Version:** Schneller als Remote-Version 
 +  * **Cache nutzen:** Vermeiden Sie ''%%~~NOCACHE~~%%'' wenn möglich
  
-DokuWiki's syntax can be extended by [[doku>plugins|Plugins]]. How the installed plugins are used is described on their appropriate description pages. The following syntax plugins are available in this particular DokuWiki installation:+=== Wartbarkeit === 
 +  * **Kommentare:** Verwenden Sie ''%%'' für Kommentare 
 +  * **Struktur:** Logische Gruppierung mit ''subgraph'' 
 +  * **Benennung:** Sprechende Knotennamen verwenden 
 +  * **Dokumentation:** Diagramm-Zweck beschreiben 
 + 
 +=== Zugänglichkeit === 
 +  * **Alt-Text:** Textuelle Beschreibung für komplexe Diagramme 
 +  * **Kontrast:** Ausreichender Farbkontrast 
 +  * **Größe:** Angemessene Diagrammgröße für Lesbarkeit 
 + 
 +==== Fehlerbehebung ==== 
 + 
 +=== Häufige Probleme === 
 + 
 +^ Problem ^ Ursache ^ Lösung ^ 
 +| Diagramm wird nicht gerendert | PHP < 8.0 | PHP-Version upgraden | 
 +| Syntax-Fehler | Ungültige Mermaid-Syntax | Syntax in Mermaid Live Editor testen | 
 +| DokuWiki-Konflikte | Klammer-Probleme | Raw-Modus oder Anführungszeichen verwenden | 
 +| Performance-Probleme | Zu komplexe Diagramme | Diagramm vereinfachen oder aufteilen | 
 +| Export funktioniert nicht | Save-Button nicht aktiviert | Admin-Konfiguration prüfen | 
 + 
 +=== Debug-Strategien === 
 +  - **Mermaid Live Editor:** [[https://mermaid.live/|mermaid.live]] zum Testen 
 +  - **Browser-Konsole:** JavaScript-Fehler prüfen 
 +  - **Schrittweise Entwicklung:** Komplexe Diagramme Schritt für Schritt aufbauen 
 +  - **Raw-Modus:** Bei Syntax-Konflikten verwenden 
 + 
 +==== Changelog ==== 
 + 
 +=== Aktuelle Version (11.6) === 
 +  * **2025-06-04:** Mermaid 11.6.0 Support 
 +  * **2025-03-23:** Mermaid 11.5.0, Theme/Look-Konfiguration 
 +  * **2024-10-15:** Mermaid 11.2.0, SVG-Export, Lock-Funktionalität 
 +  * **2024-02-15:** Mermaid 10.8.0, Standard-Theme-Einstellung 
 + 
 +=== Kompatibilität === 
 +  * **DokuWiki:** 2024-02-06b "Kaos" ✅ 
 +  * **PHP:** 8.0+ erforderlich ⚠️ 
 +  * **Browser:** Alle modernen Browser 
 +  * **Plugins:** Konflikt mit flowcharts Plugin 
 + 
 +----
  
-~~INFO:syntaxplugins~~+**Das Mermaid Plugin erweitert DokuWiki um professionelle Diagramm-Funktionalität. Für Updates und Probleme besuchen Sie das [[https://github.com/RobertWeinmeister/dokuwiki-mermaid|GitHub Repository]].**
  
 +{{tag>mermaid diagramm flowchart sequenz gantt plugin dokuwiki}}
  • wiki/syntax.1442815613.txt.gz
  • Zuletzt geändert: 21.09.2015 08:06
  • von Damian Solka