Der Bildauswahl-Block funktioniert wie der Mehrfachauswahl-Block: Nutzer:innen können eine oder mehrere vordefinierte Optionen auswählen. Auch hier eignet er sich bestens, wenn du strukturierte Antworten abfragen möchtest.
Der Unterschied liegt in der Darstellung: Du kannst neben Text auch Bilder, Icons oder Emojis hinzufügen, sodass die Auswahl deutlich visueller und intuitiver wird. Das ist ideal, um Produkte zu präsentieren, Beispiele zu zeigen oder das Nutzererlebnis interaktiver zu gestalten.
In diesem Artikel erfährst du, wie du den Inhalt, die Einstellungen und das Design des Blocks anpasst.
Inhalt bearbeiten
Nach dem Klick auf einen Block findest du rechts den Bereich Inhalts. Hier fügst du neue Elemente hinzu oder bearbeitest bestehende Inhalte.
Block-Label
Nutze das Block-Label, um deine Frage zu stellen oder die Auswahl zu erklären. Das hilft Nutzer:innen, den Kontext zu verstehen und verbessert die Barrierefreiheit, zum Beispiel für Screenreader.
Optionen
Mit + Hinzufügen erstellst du weitere Optionen. Sortiere sie per Drag & Drop über die sechs Punkte links oder lösche nicht benötigte Optionen.
Klick auf das Icon, um es zu ändern, ein Emoji zu wählen, ein Bild hochzuladen oder eins aus deiner Bibliothek auszuwählen.
Klick auf den Options-Text, um ihn direkt zu bearbeiten. Mit Beschreibung anzeigen kannst du eine zweite Zeile mit zusätzlichen Informationen anzeigen lassen.
Einstellungen anpassen
Nach dem Klick auf einen Block findest du rechts den Bereich Einstellungen. Hier passt du Optionen, Darstellung und Verhalten des Blocks so an, wie es zu deinem Flow passt.
Allgemein
Passe die wichtigsten Einstellungen für den Block an, z. B. indem du Werte als sensibel markierst, sodass sie nicht in unserer Datenbank gespeichert werden, oder den Block als erforderlich festlegst, sodass Nutzer:innen eine Option auswählen müssen, bevor sie fortfahren können.
Du kannst zwischen Einfach- und Mehrfachauswahl wählen und optional eine voreingestellte Standardoption setzen. Bei Mehrfachauswahl lässt sich zudem ein Minimum und Maximum an auswählbaren Optionen festlegen.
Navigation
Wenn dein Block als Einfachauswahl eingestellt ist, kannst du unter Navigation auswählen, was passiert, wenn Nutzer:innen eine Option klicken. 
- Nächste Seite: Immer zur nächsten Seite gehen 
- Zur Seite springen: Immer zu einer bestimmten Seite gehen 
- Konditionale Logik: Gehe abhängig von der Antwort auf unterschiedliche Seiten 
- Keine Aktion: Auf der aktuellen Seite bleiben 
Aktiviere Navigiere beim Klicken einer Option, um sofort ohne weiteren Button-Klick weiterzuleiten.
💡 Navigation bei Klick aktiviert? So leitest du direkt weiter – wir empfehlen trotzdem einen Button für eine einheitliche Seiten-Struktur.
🔎 Konditionale Logik macht deinen Flow smarter: Reagiere dynamisch auf Antworten, personalisiere deinen Flow, überspringe irrelevante Fragen oder zeige gezielt weitere Inhalte. Mehr erfahren.
Erscheinungsbild
Lege fest, ob der Block nur auf Mobile, Desktop oder gar nicht angezeigt wird. Bestimme auch, wie viele Spalten pro Zeile auf Mobile und Desktop erscheinen sollen.
Du kannst außerdem eine Hintergrundfarbe für den Block wählen und Label sowie Optionen links, zentriert oder rechts ausrichten.
Wenn du eigene Bilder hochlädst, kannst du den Bildmodus auf „fixiert“ setzen und das Bildverhalten sowie die Höhe für Mobile und Desktop separat einstellen.
Abstände
Passe die Breite des Blockes (S, M, L oder max.) an und definiere die Abstände nach oben, unten, links und rechts mit einer Pixelangabe.
Labels & Variablen
System Label legen fest, wie deine Daten gespeichert und organisiert werden, während Variablen es dir ermöglichen, diese Daten dynamisch in deinem Flow zu nutzen und anzuzeigen. Du kannst ein Label für den gesamten Block und individuelle Labels für jede Option festlegen, um deine Daten strukturiert und leicht nutzbar zu halten.
Tracking
Wenn das Tracking für diesen Block aktiviert ist, kannst du jeder Option einen Ereignisnamen geben, der an deine integrierten Tracking-Tools gesendet wird. Hier findest du mehr Informationen zum Tracking.
❗️Meta erlaubt maximal 50 Zeichen für einen Event Namen.
Block designen
Nach dem Klick auf einen Block findest du rechts den Bereich Design. Hier kannst du ein vordefiniertes Style-Set für diesen Blocktyp wählen oder Farben, Schriftarten und Abstände individuell anpassen.
Designänderungen an einem Blocktyp wirken sich automatisch auf alle Blöcke dieses Typs im Flow aus. So bleibt dein Design einheitlich, übersichtlich und leicht zu ändern, ohne jeden Block einzeln gestalten zu müssen.
🔎 Erfahre mehr dazu in unserem Artikel: Design Presets für Blöcke
Sieh dir auch die weiteren Design-Optionen von Heyflow an, um deinen Flow und deine Blöcke noch individueller zu gestalten:
Best Practices & FAQ
❓ Kann ich eigene Bilder hochladen?
❓ Kann ich eigene Bilder hochladen?
Ja! Du kannst eigene Bilder in den Bildauswahl-Block hochladen. JPG- oder PNG-Formate funktionieren am besten.
❓ Kann ich beim Klicken auf eine Option zu einer externen URL weiterleiten?
❓ Kann ich beim Klicken auf eine Option zu einer externen URL weiterleiten?
Nein, dies ist ein Eingabe-Block, daher speichern wir die Antwort des Nutzers, anstatt weiterzuleiten. Als Alternative kannst du zu einer Seite mit einem Lader weiterleiten, die die Nutzer automatisch zur externen URL weiterleitet.
❓ Welche Bildgröße wird empfohlen?
❓ Welche Bildgröße wird empfohlen?
800×800 px funktioniert gut für die meisten Flows; so bleibt die Qualität hoch, ohne die Ladezeit zu verlangsamen.
⭐ Verwende eine Einzelauswahl statt Mehrfachauswahl
⭐ Verwende eine Einzelauswahl statt Mehrfachauswahl
Die Einzelauswahl eignet sich am besten, wenn Nutzer:innen eine eindeutige Wahl treffen müssen. Sie spart Zeit und Klicks, besonders wenn „Bei Klick auf Option weiterleiten“ aktiviert ist, da kein Button erforderlich ist.
⭐ Verwende Icons, Emojis oder Bilder konsistent
⭐ Verwende Icons, Emojis oder Bilder konsistent
Wähle nur einen Typ (Icons, Emojis oder Bilder) und bleibe im gesamten Flow dabei. Die visuellen Elemente sollten relevant zu jeder Option sein, um die Erfahrung klar und ansprechend zu gestalten.
⭐ Begrenze Optionen besonders auf Mobilgeräten
⭐ Begrenze Optionen besonders auf Mobilgeräten
Da der Bildauswahl-Block viel Platz einnimmt, solltest du nicht mehr als 4 Optionen hinzufügen, besonders auf mobilen Geräten. Bei mehr Optionen kannst du auf Desktop einen Bildauswahl-Block und auf Mobil einen Mehrfachauswahl-Block anzeigen.
⭐ Reagiere auf Antworten mit Konditionaler Logik
⭐ Reagiere auf Antworten mit Konditionaler Logik
Nutze Konditionale Logik, um Leads vorzuqualifizieren und Nutzer:innen basierend auf ihren Auswahlmöglichkeiten zu den relevanten Seiten weiterzuleiten.










