HTML Field Conditional Logic Popup

Description

Adds a Show as Popup checkbox to HTML fields in the form editor. When conditional logic shows a popup-enabled HTML field after user interaction, its content opens in an accessible modal instead of inline on the form.

Usage Notes

  • Enable Show this HTML field as a popup when visible on an HTML field (Advanced tab), then configure conditional logic on that field so it is shown when the desired rule matches.
  • Single PHP block — frontend JS and CSS are inlined via wp_add_inline_script and wp_add_inline_style on forms that contain at least one popup HTML field.
  • The popup opens when conditional logic shows the field after user interaction — not on initial page load.
  • Popup HTML is inserted via innerHTML; only place trusted content in HTML fields used as popups.
  • Default modal styling is minimal; adjust the CSS in gf_html_popup_get_frontend_styles() to match your theme.
  • The form editor setting uses jQuery (Gravity Forms editor API). Frontend modal behavior uses vanilla DOM only.
Discuss in community forums
View documentation

Resources

Code

Snippet Documentation

Frequently Asked Questions

Adding a snippet is easy-peasy.

How do I add a snippet to my WordPress site?

Click the Copy Code button to copy the snippet to your clipboard. Then paste it into the appropriate file in your WordPress installation — typically your theme’s functions.php file or a custom plugin file. Alternatively, you can use a code-snippets plugin to add the code without editing theme files directly.

Where should I place PHP snippets?

The recommended approach is to create a site-specific plugin or use a code-snippets manager plugin. Avoid adding code directly to your theme’s functions.php — those changes are lost when the theme updates. If you must use a theme file, use a child theme’s functions.php instead.

Where should I place JavaScript or CSS snippets?

JavaScript and CSS snippets should be enqueued properly using wp_enqueue_script() or wp_enqueue_style() within a PHP file (such as your custom plugin or child theme’s functions.php). Avoid pasting scripts directly into template files or the Customizer’s “Additional CSS” for anything non-trivial.

Do I need to log in to copy a snippet?

Yes. Snippet code is only visible to logged-in users. Create a free account or log in to view and copy the full code.

What does the “Requires” field mean?

Each snippet lists its dependencies — the minimum versions of WordPress, PHP, and any Gravity Forms add-ons needed for the snippet to work. Make sure your environment meets these requirements before using the code.

Will snippets break my site if I update Gravity Forms?

Snippets rely on Gravity Forms hooks and APIs that may change between major versions. Always check the snippet’s version compatibility before updating. We recommend testing on a staging site first. If a snippet stops working after an update, check back here — we update snippets when breaking changes occur.

Can I modify a snippet to fit my needs?

Absolutely. Snippets are starting points. You’re free to adapt them to your specific use case. If your changes might benefit others, consider contributing back via the linked GitHub repository.