Dynamische Farben: Textfarbe anpassen

Schwierigkeitsgrad: Schwierig

Wozu dient die Funktion?

Sie verwenden diese Funktionalität, wenn ein Teilnehmer nach der Farbauswahl bei einer Einfachauswahlfrage die nächste(n) Frage(n) einschl. Antwortmöglichkeiten in der von ihm ausgewählten Farbe sehen soll. Die von einem Teilnehmer gewählte Farbe kann dann für jede Frage in der Umfrage eingestellt werden.

Use Case und dessen Einrichtung

Angenommen, Sie haben eine Einfachauswahlfrage in die Umfrage aufgenommen, bei der Sie den Umfrageteilnehmer bitten, eine Farbe auszuwählen, in der der Text der nächsten Frage angezeigt werden soll. Diese Frage könnte zum Beispiel so aussehen:

Jede Farbe ist mit einer eigenen Antwortmöglichkeit versehen; jeder Farbe ist ein Wert zugeordnet, z. B. Red = 1; Emerald green = 2; Blue = 3; Light black = 4 und Orange = 5.

Bevor Sie z. B. mit der Erstellung der Frage beginnen, deren Text in der vom Teilnehmer ausgewählten Farbe angezeigt werden soll, müssen Sie eine Wertezuweisung in die Umfrage aufnehmen. Diese kann der Umfrage NACH der ersten Auswahlfrage hinzugefügt werden.

In dieser Wertezuweisung muss eine IF-THEN-ELSE-Anweisung enthalten sein, in der für jede Textfarbe ein hexadezimaler Farbcode eingetragen werden muss, z. B. Red = #ff0000; Emerald green = #4fc978; Blue = #0000ff; Light black = #454545 und Orange = #ffa500. Wird in der Frage von einem Befragten keine Farbe ausgewählt, wird der Text der nächsten Frage in der Farbe Brown (Hex-Code: #964b00) angezeigt. Diese Farbe wird in der ELSE-Anweisung in der Wertezuweisung angegeben.

Für diese Wertezuweisung müssen die folgenden Daten eingestellt werden:

  • Umfragevariable: TextColor ist ein von Ihnen gewählter Variablenname.
  • Datentyp: Der Datentyp der Variablen TextColor muss Text sein.
  • Ausführen: die Option Jederzeit (unmittelbar nach jeder Änderung einer involvierten Variable) muss ausgewählt sein.

Diese Wertezuweisung kann wie folgt interpretiert werden:

  • Wählt ein Teilnehmer bei Frage q1 die Antwortoption 1 (= Red), wird der Text der von Ihnen zu definierenden Folgefrage(n) in der Farbe Rot (Hex-Code #ff0000) angezeigt.
  • Wählt ein Teilnehmer bei Frage q1 die Antwortoption 2 (= Emerald green), wird der Text der von Ihnen zu definierenden Folgefrage(n) in der Farbe Smaragdgrün (Hex-Code #4fc978) angezeigt.
  • Wählt ein Teilnehmer bei Frage q1 die Antwortoption 3 (= Blue), wird der Text der von Ihnen zu definierenden Folgefrage(n) in der Farbe Blau (Hex-Code #0000ff) angezeigt.
  • Wählt ein Teilnehmer bei Frage q1 die Antwortoption 4 (= Light black), wird der Text der von Ihnen zu definierenden Folgefrage(n) in der Farbe Hellschwarz (Hex-Code #454545) angezeigt.
  • Wählt ein Teilnehmer bei Frage q1 die Antwortoption 5 (= Orange), wird der Text der von Ihnen zu definierenden Folgefrage(n) in der Farbe Orange (Hex-Code #ffa500) angezeigt.
  • Wenn ein Teilnehmer keine Farbe bei Frage q1 auswählt, wird der Text der von Ihnen zu definierenden Folgefrage(n) in der Farbe Braun (Hex-Code #964b00) angezeigt.

Hinweis: Bitte berücksichtigen Sie die Notationsweise, wie z. B. das doppelte Ist-gleich-Zeichen in der IF-Anweisung.

Nach der Wertezuweisung können Sie eine Frage einfügen, deren Text in der vom Teilnehmer ausgewählten Farbe angezeigt werden soll. In diesem Beispiel gehen wir von einer Einfachauswahlfrage aus. Der Text der Frage und der entsprechenden Antwortoptionen sollte mit dem folgenden HTML-Code versehen werden:

  • <span style=”color: {{custom.TextColor}};”>Text</span>, wobei Text durch den Text der Frage, der entsprechenden Antwortoption ersetzt werden kann

Das Verfahren ist wie folgt:

  • Klicken Sie in das Textfeld der neuen Einfachauswahlfrage, damit der Link zum Texteditor oben rechts in diesem Feld angezeigt wird.
  • Klicken Sie auf diesen Link, um das RTE-Fenster zu öffnen.
  • Klicken Sie in diesem Fenster auf das Symbol Code-Ansicht.
  • Kopieren Sie den oben stehenden HTML-Code und fügen Sie ihn in das Code-Ansicht Fenster ein.
  • Ersetzen Sie das Wort Text durch die gewünschte Frage.
  • Klicken Sie auf die grüne Schaltfläche Änderungen speichern.

Hinweis: Das gleiche Verfahren kann mit Hilfe des RTE-Fensters für die Antwortoptionen durchgeführt werden.

Nachdem die Frage und die zugehörigen Antwortoptionen mit HTML-Code versehen wurden, kann die Umfrage aktiviert werden. Wenn in der Auswahlfrage zum Beispiel die Farbe Orange ausgewählt wird, wird die nachfolgende Frage wie folgt angezeigt:

Updated on May 15, 2023
Was this article helpful?

Related Articles

Need Support?
Please login to your Survalyzer account and use the "Create Support Request" form.
Login to Survalyzer