How to create floating form using Popup widget

The Floating Pane layout in the Forms works great for side panels, but what if you need your form to float somewhere else — for example, in the center of the page?

Here’s a simple workaround using the Popup widget :backhand_index_pointing_down:


Setting up your floating form


The Popup widget already includes a Form block with the most common fields. If it covers your needs, you can use it directly

Need more field options? This workaround lets you add a full Form widget inside your Popup

Create your Popup widget

Create a new Popup widget and select the layout that fits your needs.

We also recommend enabling the Reopen button so visitors can open the form again if they accidentally close the popup.


Configure Popup settings

Open the Settings tab and customize when and where your popup should appear:

  • Set the display frequency

  • Choose the pages and devices where it should be shown

  • Add display triggers or schedule if needed


Add your Form widget to Popup

Copy your Form widget installation code:


Then open your Popup widget, add an HTML block on the Builder tab, and paste the code there:


If a horizontal scroll appeared, adjust the widget’s width on the Layout tab:


This video demonstrates how the floating form appears in 7 seconds after the page load:


Guys, was this solution helpful? Let us know in the comments :slightly_smiling_face:

4 Likes