How to Show a Gravity Form with a Button Click

Problem

When it comes to online forms, placement matters. If you drop a form right in the middle of your page, it can overwhelm visitors or interrupt the flow of your content.

On the other hand, burying it at the bottom of the page may mean fewer people ever see it.

What many site owners want is a simple way to show a form only when a visitor clicks a button, a clean, controlled experience that reduces friction while boosting conversions.

But here’s the problem: Gravity Forms doesn’t natively support two-step popups. While you can hack together solutions with page builders or third-party popup tools, these approaches often come with trade-offs:

• Page Builders: Some page builders (like Elementor or Divi) offer popup functionality, but tying them directly to Gravity Forms can be clunky, with styling issues or limitations in reset behavior.
• Generic Popup Plugins: There are many WordPress popup plugins available, but most aren’t built with Gravity Forms in mind. You might get the popup, but not the flexibility to reset, restyle, or control the form experience in the way Gravity Forms users expect.
• Custom Code: Developers can code their own modal solutions, but that adds complexity and maintenance overhead—something most site owners want to avoid.

So the challenge is clear: How do you easily show a Gravity Form with a button click, without relying on hacks or heavyweight popup builders?

Solution

That’s where the Modal Display for Gravity Forms add-on comes in. It was designed specifically to solve this problem for Gravity Forms users: a lightweight way to trigger forms from a button click using a clean, accessible modal popup.

Instead of complex setups, the add-on uses a simple shortcode to create the button and modal. Here’s how it works:

1. Add the shortcode where you want the button to appear.
2. The shortcode displays a button with your custom text.
3. When clicked, the button opens a modal with your Gravity Form inside.

Key Features

• Easy Shortcode Control → Set the form ID, button text, modal title, theme, and more.
• Custom Styling → Add your own CSS via a button_class attribute or extend themes.
• Reset Options → Decide how the form resets after submission: on open, on close, or never (default Gravity Forms behavior).
• Themes → Choose between built-in light and dark themes or roll your own.
• Accessibility Built-In → Fully navigable via keyboard and screen readers.

Example shortcode:

[gr_modal_form id="1" ajax="true" button="Register for Live Event" modal_title="Register for the Live Training on 9/29" button_class="button gbp-button--tertiary" theme="light"]

Clicking the button instantly displays the form in a modal popup—no page refresh, no extra hassle.

Why This Solution Works

Unlike page builder or third-party popup hacks, Modal Display for Gravity Forms was built for Gravity Forms users. That means: It’s a streamlined, purpose-built solution to a common problem.

What’s Coming Next

Right now, the plugin supports the basics of showing a Gravity Form with a button click. In future versions, I’m planning to add advanced triggers, such as:

• Time delays (e.g., open after 45 seconds)
• Exit-intent triggers (when someone is about to leave)
• Scroll-depth triggers (open after scrolling halfway down a page)

The Wrapup

If you’ve struggled with clunky workarounds just to show a Gravity Form with a button click, the Modal Display for Gravity Forms add-on was built for you. It’s a simple, reliable way to create two-step popups that improve user experience and boost conversions.

This add-on is not available as a standalone download. The only way to access it is by becoming a member of Gravity Ranger Elite, our private Skool community. Inside, you’ll get exclusive access to this plugin, plus monthly masterclasses, strategy sessions, templates, and a network of like-minded Gravity Forms power users.

Ready to unlock this add-on? Join Gravity Ranger Elite today and start using two-step popups with your Gravity Forms.