Buttons are essential for navigation and interaction in your flow. They can be used to redirect users to external URLs, trigger validations, or guide visitors through different steps. Heyflow offers various button types tailored to different navigation needs, ensuring a seamless user experience.

Button Types

Type	Description
Continue Button	The flow continues on to the following screen, when clicking on the button.
Submit Button	This action submits the user's inputs to the Heyflow servers that then delivers it to you via the integrations. The submit button is usually used once at the end of the flow. See also submit.
Back Button	The flow returns to the screen where the user came from (without validating the current screen).
Link Button	The user is redirected to the specified URL when clicking the button. You can also add variables to the URL simply by typing in @variable which will be replaced by the variable's value. See Variables.
Universal Button	This button can be used with all navigation actions.
Navigation	A combination of a Continue and Back Button.

❗ Without a submit action in your flow, you won't be able to collect any information. You should also be aware that the use of more than just one submit actions in your flow may lead to inconsistent and distorted data. In our Heyflow Analytics Dashboard, it will count as one submit, if a user submits multiple times in a single session.

Update the Content

After clicking on a building block, you’ll find the Content section on the right. Under Label, you can set a custom text for your button. You also have the option to change the button’s icon or remove it completely.

By enabling Show description, you can add additional text that will appear just below the button’s label. This is useful for providing more context or guidance to users interacting with your funnel.

Change the Settings

After clicking on a building block, you’ll find the Settings section on the right. This is where you can customize the block’s options, appearance, and behavior to tailor it perfectly to your flow.

General

Control key settings for the block, including choosing under Navigation what happens when a user clicks a button (not all options are available in all buttons):

Next page: Go to next page in order
Go to page: Choose a specific page
Go back: Go back to the previous page
Conditional Logic: Each option goes to a specific page
Redirect: Navigate to another webpage
Close Modal: If you have embedded your funnel as a popup, you can close it with this action

When you enable No validation, all required blocks on this page will be ignored. This means users can continue without filling in the mandatory fields.

Appearance

Set the block’s visibility to show only on mobile, desktop, or hide it completely. Additionally, you can select a background color for the block.

You can choose the button size from S, M, or L, and align the button together with its icon to the left, center, right, or across the whole width. If you’re using a description, you can also align it to the left, center, or right.

Additionally, you can enable Reverse content to switch the order of the label and icon, or activate Fit width to content, so the button only takes up as much space as it needs.

Spacing

Control the block’s layout by adjusting its width (S, M, L, or maximum) and setting the block's padding from the top, bottom, left, and right.

Tracking

If Tracking is activated for that block, you can give your button an event name that will be sent to your connected tracking tools. You can find more information about tracking here.

❗️Meta allows a maximum of 50 characters for an event name.

❗Custom Tracking of Submit Buttons:

When tracking a submit button click as an event, the event is triggered immediately upon clicking the button - not necessarily upon successful submission. If there are errors on the page (e.g., missing required inputs), the event is still sent, which can lead to discrepancies in conversion tracking.

Design your Block

After clicking on a building block, you’ll find the Design section on the right. You can quickly apply a preset style tailored to that block type. Also, customize colors, fonts, and spacing to match your flow.

When you apply a design to one block type, it automatically updates all blocks of that type across your flow. This keeps your design consistent, clean, and easy to maintain without styling each block manually.

🔎 Learn more in our full guide: Design Presets for Blocks