Pre-populate Embedded Calendly invitee information with Leadshook Information

Last Updated on Dec 27, 2021 by Jos

Fact Checked

Home ยป Blog ยป Lead Generation ยป Pre-populate Embedded Calendly invitee information with Leadshook Information


    One of the great things about Leadshook is it’s ability to store and pass information between itself and other systems. Only issue with this is the other system needs to have a way to accept that data.

    When it comes to setting calendly integrations the ideal circumstance is you don’t make your visitors have to enter the information they just entered in your leadshook form again, leadshook handles this very well for calendlys that are embedded within its own quiz.

    But when you want to pass that information to a custom scheduling page with additional information it’s unable to pick up the url parameters without a bit of customisation to the calendly embed code.

    Before setting up the page make sure to have your redirect url set up in your leadshook results node.

    In this example I want to pass the following information

    • First name
    • Last name
    • Company
    • Email

    Resulting in a link that should look like this, replace your domain with your own thank you page url off course.{first_name}&lastname={last_name}&company={company_name}&email={email}

    Below is the code you’ll need to use on your page to pick up the url parameters to use in your own calendly. Replace the yourcalendlylink line with your own calendly link.

      function getSearchParams(k){
         var p={};[?&]+([^=&]+)=([^&]*)/gi,function(s,k,v){p[k]=v})
         return k?p[k]:p;
      //define base url
      var base_url = "";
      // define base html string
      var js_str = '<div class="calendly-inline-widget" data-url="###" style="min-width:320px;height:630px;"></div><scripttt type="text/javascript" src="" async></scripttt>';
      var fname = "&full_name=" + getSearchParams("firstname");
      var lname = "%20" + getSearchParams("lastname");
      var name = fname+lname;
      var email = "&email=" + getSearchParams("email");
      // company
      var company = "&company=" + getSearchParams("company");
      var new_url = base_url + name + email + company;
      var js_strb = js_str.replace("###", new_url);
      var js_strb = js_strb.replace("ttt", "t");
    <div id="candle_holder"></div>

    The end result being a fully custom thank you and scheduling page that looks like this and has pre-filled the user information in calendly, should they choose to schedule straight away. As you can see I’ve used some of the parameters to dynamically customise info on the page as well as the calendly embed.

    Ready to Grow Your Business?