Wiki-Quellcode von leitfaden-plugin-url-muss-noch-geaendert-werden
Verstecke letzte Bearbeiter
author | version | line-number | content |
---|---|---|---|
![]() |
1.22 | 1 | [[**Plugin-Download**>>url:https://customer.formcycle.eu/index.php/apps/files/?dir=/FORMCYCLE%20-%20Plugins%20Customer/Leitfaden%3Aleitfaden-resources&fileid=25265||rel="noopener noreferrer" target="_blank"]] (erfordert Anmeldung) |
![]() |
1.2 | 2 | |
![]() |
1.4 | 3 | {{content/}} |
![]() |
1.2 | 4 | |
![]() |
1.23 | 5 | {{velocity}} |
6 | ##{{info}} | ||
7 | ##Hinweis, dass das für bayr. LK ist. | ||
![]() |
1.32 | 8 | ##Über das //???? Plugin// werden Möglichkeiten zur Einbindung der AKDB Basisdienste **Bürgerkonto** und **Postkorb** in {{formcycle/}} bereitgestellt. |
![]() |
1.23 | 9 | ##{{/info}} |
10 | {{/velocity}} | ||
![]() |
1.5 | 11 | {{figure image="formular_vorlage.png"}} |
12 | TBD | ||
13 | {{/figure}} | ||
14 | |||
![]() |
1.32 | 15 | == Vorbemerkungen == |
![]() |
1.5 | 16 | |
![]() |
1.37 | 17 | In dem vom Bayerischen Landkreistag und dem Bayerischen Staatsministerium für Digitales herausgegebenen [[//Leitfaden zur nutzerorientierten und einheitlichen Formulargestaltung für die bayerischen Landkreise//>>https://www.stmd.bayern.de/wp-content/uploads/2020/10/10-2020_Leitfaden-nutzerfreundlicher-Formulargestaltung.pdf||target="_blank"]] werden für die Umsetzung von Online-Formularen konkrete Vorschläge gemacht und Empfehlungen gegeben. |
![]() |
1.3 | 18 | |
![]() |
1.42 | 19 | Das //Leitfaden-Plugin// stellt Funktionalitäten zur Verfügung, welche im Leitfaden beschrieben wurden, aber nicht standardmäßig in {{formcycle/}} umsetzbar sind. |
![]() |
1.3 | 20 | |
![]() |
1.43 | 21 | Im folgenden wird nach allgemeinen Installationshinweisen zunächst beschrieben, wie die einzelnen Punkte im Leitfaden unter Zuhilfenahme des Plugins [[umgesetzt werden können>>TODO]]. Danach folgt eine detaillierte Beschreibung der durch das Plugin vorgenommenen Anpassungen an der Darstellung von Formularen und der durch das Plugin hinzugefügten [[Widgets>>Formcycle.FormDesigner.FormElements.Widgets]] und Funktionalitäten im Punkt [[XXX>>TODO]]. |
![]() |
1.18 | 22 | |
![]() |
1.33 | 23 | == Hinweis zur Verwendung des Leitfaden-Plugins zusammen mit dem Theme-Konfigurator-Plugin == |
![]() |
1.18 | 24 | |
![]() |
1.42 | 25 | Das //Leitfaden-Plugin// nimmt wie auch das [[Theme-Konfigurator-Plugin>>Formcycle/PluginDocumentation/ThemeConfiguratorPlugin]] Änderungen am Aussehen von Formularen vor. Daher kann es beim parallelen Betrieb von beiden Plugins zu Konflikten kommen, wodurch die Darstellungsoptionen des Leitfaden-Plugins eventuell überschrieben werden. Daher sollte bei einem parallen Einsatz beider Plugins darauf geachtet werden, dass möglichst nur Dinge durch das //Theme-Konfigurator-Plugin// angepasst werden, bei denen nicht auch durch das //Leitfaden-Plugin// Veränderungen vorgenommen werden, wie zum Beispiel das Logo. |
![]() |
1.18 | 26 | |
![]() |
1.7 | 27 | == Installation == |
![]() |
1.6 | 28 | |
![]() |
1.7 | 29 | Das Plugin kann als Mandant-Plugin oder System-Plugin installiert werden. Eine Anleitung zur Installation von Plugins finden Sie [[hier>>doc:Formcycle.UserInterface.Client.Plugins.WebHome]]. |
![]() |
1.6 | 30 | |
![]() |
1.41 | 31 | == Umsetzung ,,, mithilfe des Leitfaden-Plugins == |
![]() |
1.18 | 32 | |
![]() |
1.39 | 33 | Im folgenden wird auf die einzelnen Punkte des Leitfadens kurz eingegangen und gezeigt, wie diese nach der Installation des Plugins in FORMCYCLE realisiert werden können. |
![]() |
1.5 | 34 | |
![]() |
1.9 | 35 | === #1 Frage den Bürger als erstes, was er möchte. === |
36 | |||
37 | Man muss Formular entsprechend aufbauen... Plugin stellt CSS bereit für Hilfehinweise | ||
38 | |||
39 | Nachdem Bürger angegeben hat, was er eigentlich will, können durch sichtbarkeitsbedingungen nun diejenigen Abfragen und Eingabefelder eingeblendet werden, die für das spezielle Anliegen des Bürgers absolut notwendig sind. | ||
40 | |||
41 | === #2 Unterteile dein Formular in sinnvolle Prozessschritte und gebe Orientierung === | ||
42 | |||
![]() |
1.39 | 43 | |
![]() |
1.9 | 44 | Siehe Widget-Plugin ... |
![]() |
1.38 | 45 | Für bestimmte Punkte des Leitfadens wird zudem das [[Widget-Plugin Navigationsleiste>>Formcycle.PluginDocumentation.WidgetXNavigationBar]] benötigt. |
![]() |
1.9 | 46 | |
![]() |
1.39 | 47 | |
![]() |
1.9 | 48 | === #3 Gib dem Bürger eine Übersicht über seine Angaben und verlinke zu den Seiten === |
49 | |||
50 | Nach dem ltrzte seite stellt Plugin eine automatische Zusammenfassung bereit ... | ||
51 | |||
52 | === #4 Biete jederzeit die Möglichkeit an Kontakt aufzunehmen === | ||
53 | |||
54 | Man muss in Header oder Footer halt die Kontaktinformationen packen... | ||
55 | |||
56 | === #5 Gib dem Bürger die Möglichkeit sich zu erklären === | ||
57 | |||
58 | Bemerkungsfelder sollten an geeigneten Stellen hinzugefügt werden. Hier bietet sich die Textareas an. | ||
59 | |||
60 | Durch anpassung der maximal möglichen zeichenzahlö kann hier zum einen begrenzt werden, wieviel der Bürger schreiben kann. Durch die standardmäßig aktive Option ??? wird unter der Textare die Anzahl der maximal möglichen Zeichen und die Anzahl der aktuell bereits eingegebenen zeichen angezieigt. | ||
61 | Dadurch kann dem Bürger auch signalisiert werden, wie umfangreich eventuelle Bemerkungen an der jeeiligen Stelle ausfallen können. | ||
62 | |||
63 | === #6 Komme den Fragen deiner Bürger zuvor === | ||
64 | |||
65 | Gibt es da eigentlich css klassen die wir mitliefern für diese Hinweisblöcke? | ||
66 | Ansonsten: Wie mache ich einen Hinweisblock ... | ||
67 | |||
![]() |
1.10 | 68 | === #7 Positioniere die Feldbezeichnungen oberhalb des Feldes === |
![]() |
1.9 | 69 | |
![]() |
1.10 | 70 | Standardmäßig in FC so eingestellt |
![]() |
1.9 | 71 | |
![]() |
1.10 | 72 | === #8 Bilde sinnvolle visuelle Hierarchien === |
![]() |
1.9 | 73 | |
![]() |
1.10 | 74 | Verwendung von Fieldsets |
75 | Fette Labelbeschriftungen und farbliche Hervorhebeung von Auswahloptionen sind Standardmäßig in FC so eingestellt und werden auch vom Leitfaden-Plugin so umgesetzt | ||
![]() |
1.9 | 76 | |
![]() |
1.10 | 77 | === #9 Weise deinen Bürgern den Weg === |
![]() |
1.9 | 78 | |
![]() |
1.10 | 79 | Aktive Felder werden z.T: vom Browser hervorgehoben |
80 | ??? Mach das Plugin was mit ausgefüllten Feldern??? <- Setzt das Plugin wirklich Haken an die Felder? | ||
![]() |
1.9 | 81 | |
![]() |
1.10 | 82 | === #10 Gib deinen Bürgern auch Rückmeldungen === |
![]() |
1.9 | 83 | |
![]() |
1.10 | 84 | ??? Mach das Plugin was mit ausgefüllten Feldern??? <- Frage auch für die HKK |
85 | |||
86 | === #11 Wähle sinnvolle Feldgrößen === | ||
87 | |||
88 | Alles Standardoptionen von FORMCYCLE, die für das jeweilige Formular(-feld) individuell verwendet werden können. | ||
89 | |||
90 | === #12 Gehe sorgsam mit Auszeichnungen für Schrift um === | ||
91 | |||
92 | Hier muss der Formularersteller entscheiden, was er wirklich hervorheben will. Da Labels und Textelemente einen Richtexteditor für die anzuzeigenden Texte haben, kann dies in FORMCYCLE sehr einfach gemacht werden. | ||
93 | |||
94 | === #13 Mache Pflichtfelder in jeder Situation deutlich sichtbar === | ||
95 | |||
96 | Standardoption von FC, der Pflichtfeldstern sollte sich farblich vom restlichen Design der Kommune entsprechend abheben | ||
97 | ???Plugin vergrößert Stern??? | ||
98 | Überschriften, buttons sind standardmäßig in FC und im Plugin in Fett und Fließtexte sind auch standardmäßig in normaler Schrift | ||
99 | |||
100 | === #14 Hebe Schaltflächen hervor und beschrifte sie === | ||
101 | |||
102 | Plugin fügt für wiederholte elemente beschriftungen zu den Kontrollschaltflächen hinzu | ||
103 | Auch hier muss darauf geachtet werden, dass sich Schaltflächen farblich vom restlichen Design der Kommune entsprechend abheben | ||
104 | |||
105 | === #15 Vermeide doppelte Eingaben === | ||
![]() |
1.11 | 106 | |
![]() |
1.12 | 107 | Standardfunktionalität von FC: Per RB abfragen, ob Angaben von vorher bereits eingegebenen abweichen, Weitere zunächst versteckte Formularfelder werden dann über "sichtbar wenn" bedingungen einblenden. |
![]() |
1.11 | 108 | |
![]() |
1.10 | 109 | === #16 Verwende vorausgefüllte Standardtexte als Beispielangabe === |
![]() |
1.13 | 110 | |
111 | Platzhalter sind auch Standardfeature von FC | ||
112 | |||
![]() |
1.10 | 113 | === #17 Gib proaktiv hilfreiche Hinweise und Erklärungen === |
![]() |
1.13 | 114 | |
![]() |
1.14 | 115 | Hilfefenster sind auch Standardfeature von FC, aber durch das Plugin erscheinen sie standardmäßig, wenn das Feld sichtbar ist |
![]() |
1.13 | 116 | |
![]() |
1.14 | 117 | === #18 Biete so oft wie möglich Auswahlfelder an === |
![]() |
1.13 | 118 | |
![]() |
1.15 | 119 | Mehrstufige Abfrage mit RB für wichtigste Auswahl(en) und Auswahlfeldern für sonstige Auswahlen, bei den können mit FC einfach mit Sichtbarkeitsbedingungen umgesetzt werden. |
![]() |
1.14 | 120 | |
![]() |
1.15 | 121 | Wenn Abfragen wie z.B. Stattsbürgerschaft häufiger in Formularen vorkommen, können diese als Datenquelle hinterlegt und dadurch einfach eingebunden und für alle Formulare gepflegt werden. |
![]() |
1.14 | 122 | |
![]() |
1.10 | 123 | === #19 Hilf deinen Bürgern Dokumente anzuhängen === |
![]() |
1.15 | 124 | |
125 | Wir haben noch kein neues Upload-Control und können das in FC daher momentan nicht umsetzen <- Oder ist das im Leitfaden? | ||
126 | |||
![]() |
1.10 | 127 | === #20 Überprüfe die Angaben deiner Bürger === |
![]() |
1.15 | 128 | |
129 | zusätzliche Köntextabhängige Prüfungen können per JavaScript vorgenommen werden. | ||
130 | |||
![]() |
1.10 | 131 | === #21 Mache Fehler sichtbar und erkläre sie === |
![]() |
1.15 | 132 | |
133 | FC markiert standardmäßig Felder, bei denen Angaben nicht valide sind. Durch Plugin wird das Aussehen deutlicher (??? und was ist mit Uploads?) | ||
134 | |||
![]() |
1.10 | 135 | === #22 Unterstütze die AutoFill-Funktion der Browser === |
![]() |
1.15 | 136 | |
137 | In FORMCYCLE ab Version 6.6.?? für jedes Formularelement wählbar. | ||
138 | |||
![]() |
1.10 | 139 | === #23 Kommuniziere mit deinen Bürgern auf Augenhöhe === |
![]() |
1.15 | 140 | |
141 | Kein technischer Inhalt... | ||
142 | Hinweise als Textelement(?) | ||
143 | |||
![]() |
1.10 | 144 | === #24 Halte deine Bürger auf dem Laufenden === |
145 | |||
![]() |
1.15 | 146 | Über Statusverarbeitung kann zum Beispiel nach X Tagen ein Erinnerungsstatus aufgerufen werden, der eine E-Mail versendet. |
147 | Beispielformular? Oder Screenshot vom Workflow? | ||
148 | |||
![]() |
1.23 | 149 | |
150 | |||
![]() |
1.37 | 151 | == Technische Dokumentation des Leitfaden-Plugins == |
![]() |
1.43 | 152 | oder lieber technische Details? war: Weitere Hinweise zum Aufbau von Formularen, Inhalt des Plugins |
![]() |
1.9 | 153 | |
![]() |
1.37 | 154 | Das Plugin stellt Ressourcen zur Verfügung, welche in Formularen automatisch verwendet werden und fügt neue Validierungsreglen und Widgets hinzu. Im folgenden wird auf alle |
![]() |
1.9 | 155 | |
![]() |
1.43 | 156 | js |
157 | schriftart verändern | ||
158 | uploads werden verändert | ||
159 | -> verlinken | ||
160 | |||
![]() |
1.37 | 161 | === CSS === |
162 | Hier fehlt ein guter titel...Kosmetische Anpassungen? | ||
163 | |||
164 | === Änderungen an === | ||
165 | |||
![]() |
1.43 | 166 | === Validierungsregeln === |
![]() |
1.37 | 167 | |
![]() |
1.43 | 168 | Durch das Plugin werden 4 neue [[Validierungsregeln>>TODO]] bereitgestellt. Zu beachten ist allen, dass sie nur überprüfen können, ob eine Eingabe formal dem Aufbau des jeweiligen Wertetyps entspricht. Es kann aber nicht überprüft werden, ob es tatsächlich einen solchen Wert, wie zum Beispiel eine konkrete BIC, gibt. Folgende Regeln werden hinzugefügt: |
![]() |
1.37 | 169 | |
![]() |
1.46 | 170 | ; xm-vdt-bic |
171 | : Validierung für Eingabefelder, in die der Benutzer ein Geschäftskennzeichen (SWIFT-BIC) für Kontodaten eingibt (DECIMAL, A-Z) | ||
![]() |
1.43 | 172 | |
![]() |
1.46 | 173 | ; xm-vdt-iban |
174 | : Validierung für Eingabefelder, in die der Benutzer eine Bankverbindung in Schreibweise der internationalen Bankkontonummer (IBAN) eingibt (DECIMAL, A-Z) | ||
![]() |
1.43 | 175 | |
![]() |
1.46 | 176 | ; xm-vdt-iban-de |
177 | : Validierung für Eingabefelder, in die der Benutzer eine Bankverbindung in Schreibweise der internationalen Bankkontonummer (IBAN) eingibt (DECIMAL, A-Z) | ||
![]() |
1.43 | 178 | |
![]() |
1.46 | 179 | ; xm-vdt-steuerid |
180 | : Validierung für Eingabefelder, in die der Benutzer eine steuerliche Identifikationsnummer nach § 139b, Abgabenordnung eingibt (11 x DECIMAL) | ||
![]() |
1.43 | 181 | |
![]() |
1.27 | 182 | === Formularwidget Hinweis === |
![]() |
1.43 | 183 | {{velocity}} |
184 | ##{{figure image="formular_vorlage.png" clear="h3"}} | ||
185 | ##TBD | ||
186 | ##{{/figure}} | ||
187 | {{/velocity}} | ||
![]() |
1.27 | 188 | |
![]() |
1.36 | 189 | |
![]() |
1.27 | 190 | === Formularwidget Kontaktdaten === |
![]() |
1.43 | 191 | {{velocity}} |
192 | ##{{figure image="formular_vorlage.png" clear="h3"}} | ||
193 | ##TBD | ||
194 | ##{{/figure}} | ||
195 | {{/velocity}} | ||
![]() |
1.27 | 196 | |
![]() |
1.36 | 197 | |
![]() |
1.27 | 198 | === Formularwidget Unsichtbarer Container === |
![]() |
1.43 | 199 | {{velocity}} |
200 | ##{{figure image="formular_vorlage.png" clear="h3"}} | ||
201 | ##TBD | ||
202 | ##{{/figure}} | ||
203 | {{/velocity}} | ||
![]() |
1.27 | 204 | |
![]() |
1.36 | 205 | |
![]() |
1.24 | 206 | === Zusammenfassung === |
![]() |
1.49 | 207 | {{figure image="leitfaden_zusammenfassung_beispiel.png" clear="h4"}} |
208 | Beispiel für das Aussehen einer Zusammenfassung mit in [[Fieldsets>>TODO]] gruppierten Formularelementen. | ||
![]() |
1.48 | 209 | {{/figure}} |
![]() |
1.46 | 210 | Durch das Plugin werden im {{designer/}} zusätzliche Konfigurationsmöglichkeiten hinzugefügt, welche es ermöglichen, auf der letzten im Formular vorhandenen [[Seite>>TODO]] eine Zusammenfassung anzuzeigen. Auf dieser Seite wird zuerst die Zusammenfassung aller vorangegangen Seiten angezeigt und darunter alle Elemente, welche im {{designer/}} auf dieser Seite platziert wurden. |
![]() |
1.27 | 211 | |
![]() |
1.46 | 212 | In der Zusammenfassung tauchen nur die Formularelemente auf, welche sichtbar sind und einen Wert haben. Das bedeutet, dass leere Eingabefelder nicht in der Zusammenfassung aufgeführt werden. |
![]() |
1.27 | 213 | |
![]() |
1.48 | 214 | Werden Formularfelder in einem [[Fieldset>>TODO]] gruppiert, wird eine |
![]() |
1.46 | 215 | |
![]() |
1.48 | 216 | |
![]() |
1.44 | 217 | ==== Konfiguration von Formularelementen ==== |
![]() |
1.46 | 218 | {{figure image="leitfaden_zusammenfassung_elemente.png" clear="h4"}} |
![]() |
1.48 | 219 | Konfigurationsmöglichkeiten für die Sichtbarkeit eines Formualrelements in der Zusammenfassung |
![]() |
1.46 | 220 | {{/figure}} |
![]() |
1.47 | 221 | Über die unter //Darstellung// zu findende Option //Bei Zusammenfassung// kann die Sichtbarkeit von Formularelementen in der Zusamenfassung gesteuert werden. |
![]() |
1.9 | 222 | |
![]() |
1.47 | 223 | Diese Option wird bei allen [[Formularelementen>>TODO]] und [[Widgets>>TODO]] angezeigt, ist aber nur sinnvoll bei Bildern und bei Formularelementen, in denen der Nutzer eine Eingabe tätigen kann. Andere Elemente wie Schaltflächen werden generell nicht in der Zusammenfassung angezeigt. |
![]() |
1.46 | 224 | |
![]() |
1.47 | 225 | Folgende Optionen stehen zur Auswahl: |
226 | |||
![]() |
1.46 | 227 | ; Sichtbarkeit automatisch |
![]() |
1.47 | 228 | : Das Element wird in der Zusammenfassung angezeigt, wenn es sichtbar ist und einen Wert hat oder vom Typ [[Bild>>TODO]] ist. Standmäßig ist diese Option ausgewählt |
![]() |
1.46 | 229 | |
![]() |
1.47 | 230 | ; nicht sichtbar |
231 | : Das element wird nicht in der Zusammenfassung angezeigt | ||
![]() |
1.46 | 232 | |
![]() |
1.48 | 233 | |
![]() |
1.44 | 234 | ==== Konfiguration der Schaltfläche ==== |
![]() |
1.45 | 235 | {{figure image="leitfaden_zusammenfassung_buttons.png" clear="h4"}} |
236 | Aktion //Leitfaden-Plugin// in den Konfigurationseinstellungen einer Schaltfläche | ||
237 | {{/figure}} | ||
238 | Das //Leitfaden-Plugin// fügt für [[Schaltflächen>>TODO]] eine neue Aktion mit dem Namen //Zusammenfassung + prüfen// hinzu. Die Aktion //Zusammenfassung + prüfen// springt dabei immer auf die Letzte im Formular vorhandene Seite. | ||
![]() |
1.24 | 239 | |
![]() |
1.44 | 240 | {{velocity}} |
241 | ##== Weitere Anpassungen am Aussehen der Formulare == | ||
242 | ## | ||
243 | ##-> jenseits von Leitfaden | ||
244 | ## | ||
245 | ##Logo einbinden als BILD oder per CSS. -> allgemeine links | ||
246 | ##Hier empfihlt sich | ||
247 | {{/velocity}} |