Der Bild-Block ist eine einfache, aber wirkungsvolle Möglichkeit, deinen Flow optisch ansprechender zu gestalten. Du kannst dein eigenes Bild oder GIF hochladen, um wichtige Inhalte hervorzuheben, die richtige Stimmung zu setzen oder die Aufmerksamkeit auf bestimmte Bereiche deines Flows zu lenken.
Inhalt bearbeiten
Nach dem Klick auf einen Block findest du rechts den Bereich Inhalts.
Unter Bild kannst du dein eigenes Bild hochladen und bei Bedarf zuschneiden oder die Heyflow-Bibliothek nutzen. Die Bildbibliothek beschleunigt deinen Workflow, da sie es dir ermöglicht, Bilder über mehrere Flows hinweg zu verwalten und wiederzuverwenden – so musst du dasselbe Bild nicht mehrfach hochladen. Klicke einfach auf „Aus Bibliothek wählen“, um deine verfügbaren Bilder zu durchsuchen und auszuwählen. Mehr Informationen zur Bildbibliothek findest du hier.
Das Alt-Label stellt einen Alternativtext bereit, der angezeigt wird, wenn ein Bild nicht geladen werden kann. Das hilft Nutzer:innen, den Kontext zu verstehen und verbessert die Barrierefreiheit, zum Beispiel für Screenreader.
💡Wir unterstützen fast alle Bildformate mit einem Dateilimit von 12 MB. Um eine bessere Flow-Performance zu gewährleisten, lade dein Bild in einem komprimierten Format hoch, ohne dabei an Qualität zu verlieren. Es gibt zahlreiche Online-Bildkomprimierungstools!
❗ Wenn du ein GIF hochlädst, lade es als Original hoch und schneide es nicht zu.
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.
Navigation
Mit der Option Navigation aktivieren kannst du festlegen, ob ein Klick auf das Bild Nutzer:innen zu einer Webseite weiterleiten soll. Gib die gewünschte Zieladresse im Feld URL ein und nutze die Einstellung Öffnen in…, um zu bestimmen, ob der Link im gleichen oder in einem neuen Fenster geöffnet werden soll.
Mit Saubere URL kannst du Variablen, die keinen Wert enthalten, automatisch aus der URL löschen, einschließlich des vorangestellten &wort=.
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.
Erscheinungsbild
Lege fest, ob der Block nur auf Mobile, Desktop oder gar nicht angezeigt wird. Du kannst außerdem eine Hintergrundfarbe für den Block wählen.
Mit Ecken-Rundung bestimmst du, wie stark die Ecken deines Bildes abgerundet werden. Gib dafür einfach die exakte Pixelzahl ein. Unter Größe kannst du mit einer Prozentangabe dein Bild kleiner oder größer machen.
