How to Trigger HubSpot Popup Form on Button Click or Page Load

Download FREE HubSpot CMS Guide
How to Trigger HubSpot Popup Form on Button Click or Page Load

HubSpot provides the ability to display a pop up form with various triggers (exit intent, after 7 seconds, etc.) But what if you want to show it immediately or when a button is clicked? Below is some javascript to help achieve this functionality.

How to use this script

  • Create pop up form
  • Set targeting to the page you would like the form to appear
  • Set the form pop-up trigger to 600 seconds or 10 minutes. This will essentially hide the pop up until you manually set it to appear using the script below.
  • Now that you have the form created and connected to the page. Add the script to the HubSpot page by editing the page > Settings > Advanced Options > Footer HTML
    Pasted 7

Here is an example page using a button trigger to open a pop up form.

<script> 
window.onload = function() { 
    // add a delay to give time for the pop form to load 
    setTimeout(function() { 

        // trigger the opening of the pop up without delay
        // window.leadflows.dynoFactory.create(window.leadflows.lfConfig.leadFlows[0]).open(); 
        
        /* can also be triggered on button click 
        Change '#main-content .button' query selector below to your button class or ID
        */
        $("#main-content .button").click(function(){ 
            event.preventDefault();
            window.leadflows.dynoFactory.create(window.leadflows.lfConfig.leadFlows[0]).open(); 
        }); 

    }, 200); 
// window load 
};
</script>

 

What about multiple form pop-ups on the same page?

The default HubSpot pop-up form is ideal for showing one pop-up form per page based on the URL targeting.

If you wanted to have buttons to trigger different forms, I would create custom modal functionality and then embed my forms in there.

If you are not a developer and would like to implement this functionality, contact me for a proposal.

Written by: Jake Lett
I share digital marketing tips and HubSpot tutorials to help marketers and business owners grow their business.


Tags: , , ,

Want to Get Email Updates of New Articles?

Join My Email Newsletter