Skip to content

Modal form

This module is a HubSpot form in a modal pop-up, hidden until a visitor clicks a button that opens it.

Content options

  • Tag: A short label above the heading. Optional.
  • Body text: A heading and short intro above the form.
  • Form: Any HubSpot form, with an inline thank-you message or a redirect.

Opening the modal

  • Trigger: Set any button or link on the page to the URL #modal-1.
  • More than one: Modals are numbered in page order, so the second is #modal-2, the third #modal-3, and so on.
  • Closing: Visitors close it with the cross, the Escape key or a click outside.

Recommendations

  • Do use it to keep visitors on the page, opening a short form from a "Get in touch" button.
  • Don't move modals around without checking their triggers. The numbers follow page order, so a button can end up opening the wrong one.

Examples

Modal form module with defaults, set to the website enquiry form. Click the button to open it.

Open the modal

With a tag and heading, opened from a Banner's Get in touch button.