Wenn du Elemente nebeneinander anzeigen lassen möchtest, kannst du den Container-Block nutzen. Dieser Block wird gerne für den Bau von Landing Pages genutzt oder auch bei Eingabeblöcken.
Hinzufügen des Containers
Im Tab Blöcke gehe zu Layout und ziehe den Container-Block in deinen Heyflow
Ziehe die gewünschten Blöcke in den Container
Passe das Layout des Containers an
Publiziere deinen heyflow und schon bist du startklar!
Bearbeitungsoptionen
Allgemein
Allgemein
Außenbreite: Wähle die äußere Breite des Containers. Beachte, dass die Vorschau ggf. kleiner dargestellt wird, als hier ausgewählt.
Innenbreite: Wähle die breite des inneren Elements. Auch hier wird die Breite ggf, kleiner dargestellt, als ausgewählt.
Inhalt ausrichten: Definiere, ob der Inhalt des Containers links, rechts oder mittig dargestellt wird.
Margin & Padding: Definiere den Abstand zum oberen, rechten, unteren und linken Rand dieses Blocks.
Layout
Layout
Layout: Bestimme die vertikale oder horizontale Ausrichtung der Blöcke innerhalb des Containers.
Ausrichten: Layout der Blockplatzierung im Verhältnis zu einer Seite.
Layout Mobil: Bestimme die vertikale oder horizontale Ausrichtung der Blöcke innerhalb des Containers auf mobiler Ansicht.
Abstand: Bestimme den Abstand der einzelnen Elemente zueinander per Schieberegler oder mit genauer Pixelanzahl.
Spalten
Spalten
Verteilung: Bestimme die Verteilung der Elemente des Containers.
Horizontale Ausrichtung: Wenn die Verteilung der Spalten jeweils auf 0 gestellt ist, kannst du die horizontale Ausrichtung anpassen.
Aussehen
Aussehen
Sichtbarkeit: Hierüber kannst du auswählen, ob der Block nur in der mobilen bzw. Desktop Version angezeigt wird oder diesen gänzlich verstecken.
Hintergrundfarbe: Du kannst du eine Farbe auswählen, die als Hintergrund für den Block genutzt wird.
Hintergrundbild: Lege ein Hintergrundbild für den Block fest.
Style Variante: Lege ein vorgefertigtes Muster fest. Die verschiedenen Styles können jeweils im Design-Tab angepasst werden.
Beispiele
Empfehlung (Testimonial)
Containers können dafür genutzt werden, um Erfahrungsberichte z.B. auf einer Landingpage schöner anzeigen zu lassen.
Hintergrundbilder und GIFs
Neben einer Hintergrundfarbe kannst du in einem Container auch ein Hintergrundbild oder sogar ein GIF einblenden, sodass dein Flow noch mehr heraussticht.