The Sticky Bar Block lets you attach a container to the top or bottom of a page so important elements stay visible while visitors move through your flow. This makes it easy to keep key actions, such as Continue, Submit, or Next step buttons, always accessible, without requiring users to scroll to the end of a page.

Keeping primary actions fixed on the screen is a common design pattern in modern mobile and web experiences. By placing actions within the natural thumb zone, the Sticky Bar Block helps visitors navigate funnels faster, reduces friction between steps, and improves overall completion rates.

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.

First, choose if the block should stick to the top or the bottom of your page.

Select the outer width of the container and the width of the inner element. Note that the preview may be displayed smaller than selected here. Define whether the content of the container is displayed on the left, right or in the centre.

Define the distance to the top, right, bottom and left edge of this block.

Adjust spacing to modify distances for each edge of the container and the inner element(s).

Next preview your changes to ensure the spacing meets your design needs. Proper margin and padding adjustment helps create cleaner, more visually appealing designs by controlling the space between elements.

Determine the vertical or horizontal direction of the blocks within the container, both for desktop and for mobile view. Align the block placement of the inner elements in relation to the edges of the container.

Also determine the gap or distance between the individual elements inside the container using the exact number of pixels.

Define the distribution of elements in the container using the arrangement settings. If the distribution of the columns is set to 0, you can adjust the horizontal alignment using the justify options.

Under Appereance, select a background color or even a background image for the block.

Set the block’s Default Visibility to show only on mobile, desktop, or hide it completely. Alternatively, you can set up a Conditional Visibility. This lets you decide based on which rules a block should appear.