Skip to main content
List Block

Whether you want to point out your selling points or visualize the next steps in the process, with the list block you can do exactly that.

Heyflow avatar
Written by Heyflow
Updated this week

Our List block is a great tool to present information in a meaningful, appealing way. It's the perfect tool to point out key aspects, may it be about your company or the offer you're presenting in your flow.

🔎 If you're looking for a shorter list with the same icons and no headlines, take a look at our checklist block here.


Adding the list block

  1. In the Blocks tab, drag the list block into your heyflow

  2. Enter your information with a headline and explanatory text, or use variables

  3. When you select the text, a toolbar will appear that offers different formatting options and links. You can e.g. select the text color or format (bold, underline, italic).

  4. Adjust the settings such as amount of columns and add icons or even your own pictures via the image library.

  5. Just publish your heyflow and you’re good to go!


Edit Options

Spacing

  • Width: Here you can adjust the maximum spread of the block and choose between S, M, L and maximum width.

  • Top, Bottom, Left, Right: You can use these options to set the distance to all sides. To do this, either use the slider or specify the exact number of pixels.

Appearance

  • Visibility: Here you can choose whether the block is only displayed in the mobile or desktop version or whether it is hidden completely.

  • Background color: You can select a colour to be used as the background for the block.

  • Columns (desktop): Choose the amount of columns displayed next to each other on your desktop.

  • Columns (mobile): Choose the amount of columns displayed next to each other on your mobile device.

Animation & Navigation

  • Animate: Activate, if you want to add animation to to the icons of your list.

  • Animated duration (in seconds): Define the length of the animation.

  • Animation mode: Choose the mode of your animation, to define, if the different items of your list should be displayed one by one or all at once.

  • Navigation when done: Set up a navigation, once the animation finished.

  • Preview: Shows a preview of your settings.

Did this answer your question?