Formulare Website
Formulare Spezielles
Folgende zwei Spezial-Funktionalitäten sind weder intuitiv noch offensichtlich. Fazit ist aber, dass, wenn man die Vorlagen benutzt, um neue Formulare zu kreieren, alles schon richtig eingestellt ist. (Im Oktober 2022 wurde alle Formulare überprüft.)
Verwendung und Veröffentlichung von Fotoaufnahmen (Checkbox)
Problem
Bei der Checkbox für die Einwilligung der Fotoaufnahmen ergeben sich folgende Probleme:
- Wenn der Text in der Checkbox-Beschreibung eingefügt wird, ist der Text zu klein und man kann diesen nicht formatieren (zB. Paragraphen einsetzen).
- Wenn ein HTML-Text vor einer Checkbox gestellt wird, ist kein Zusammenhang (technischer Art, für Screenreader) ersichtlich zwischen Text (davor) und Checkbox.
Lösung
Falls die Checkbox den Schlüssel (Code-Feldname) ‚photo_publication_acknowledgment‚ hat, bezieht sich die Checkbox auf den vorangehenden HTML-Text. So kann der Screenreader richtig mitteilen, welcher Text gemeint ist, das man zur Kenntnis nimmt.
- Einfaches HTML: photo_publication_text
- Checkbox: photo_publication_acknowledgment
Wenn für neue Formulare immer eine Vorlage benutzt wird, muss man hier nichts korrigieren.
Auto-complete
Damit die Browser schon (früher) gemachte Eingaben von Nutzer:innen vorschlagen können, sollen bei den Webforms immer die gleichen Schlüssel (Code-(Feld-)Namen) für die Felder benutzt werden, gemäss folgender Liste.
Feldtitel: Schlüssel
- Salutation/Anrede: salutation
- First Name/Vorname: first_name
- Last Name/Nachname: last_name
- E-mail: mail
- Telephone (Contact Tracing): telephone
- Institution / School / Company: company
- Position: position
Wenn für neue Formulare immer eine Vorlage benutzt wird, muss man hier nichts korrigieren.
Weitere schon benutzte Felder
- Date of birth/Geburtsdatum: date_of_birth (‚geburtsdatum‘ wurde auch schon benutzt)
- Age/Alter: age
- Gender/Geschlecht: gender
- Date/Datum: date_today
- Place/Ort: place
Abfrage des Geschlechts
Um in einem Formular die Abfrage des Geschlechts zu machen muss ein Element vom Typ Radio other mit speziellen Einstellungen hinzugefügt werden. Die drei Werte Männlich, Weiblich und Keine Angabe sind bereits vorbereitet. Lediglich das Feld für Weiteres Geschlecht muss jeweils noch hinzugefügt werden. Dieses Feld lässt sich leider nicht in der Vorlage abbilden, da es zuerst ein zusätzliches Eingabefeld öffnen wird, wie in der folgenden Abbildung gezeigt.
Im folgenden die Schritte um ein Feld für die Abfrage des Geschlechts in ein Formular einzufügen.
- Als Element Typ Radios other auswählen
- Bei Optionen Geschlecht oder Gender auswählen
- Bei Options display Side by side auswählen
- Unter Other option settings wird das Other option label mit dem Text “Weiteres” ausgefüllt
- Unter Other title wird auch “Weiteres” ausgefüllt
- Unter Other placeholder wird “Weiteres Geschlecht…” ausgefüllt
Nach Bedarf muss auch noch die Übersetzung auf Englisch hinzugefügt werden mittels folgender Schritte.
- Wechsel auf Übersetzung um Englische Übersetzung hinzufügen.
- Auswahl der Englischen Übersetzung
- Titel: Geschlecht auf “Gender”
- Other option label: Weiteres auf “Other”
- Other title: Weiteres auf “Other Gender”
- Other placeholder: Weiteres Geschlecht… auf “Enter other…”
Nun haben wir auch eine richtige Englische Übersetzung.
Formulare vor Missbrauch schützen mit Captchas
Um missbräuchliche Verwendung (z.B. Spam-Versand) der Drupal-Formulare durch Bots weitgehend zu verhindern ist es notwendig Captchas einzusetzen. Die HfH hat sich entschieden dazu die Google-reCAPTCHA-V3-Technologie zu verwenden. Bei diesem «reCAPTCHA V3» wird Missbrauch vermieden, ohne dass der User etwas ausfüllen muss. Dieses reCAPTCHA-V3 ist für den Benutzer erkennbar am blauen reCAPTCHA Logo unten rechts auf der Webseite. Alle Formulare auf der HfH-Website müssen damit ausgestattet werden.
Das Captcha wird in ein Formular eingebaut wie ein Formularelement. Die Schritte dazu sind nachfolgend aufgelistet und mit drei Screenshots illustriert.
- Add Element
- Suche nach Captcha-Element und füge es hinzu
- Konfigurieren des Challenge type als no_action (from module recaptcha_v3)