Connect Google Forms to Groundhogg

Step 1: Set Up Your Google Form

1. Create or Open a Google Form:
   • Go to Google Forms.
   • Either create a new form or open an existing one.
   • Add the fields you want to capture (e.g., First Name, Email, Phone). Ensure each field has a clear, unique question title.
2. Test the Form:
   • Fill out and submit the form at least once to generate sample data. This will help later when mapping fields in Groundhogg.

Step 2: Configure Groundhogg’s Webhook Listener

1. Log in to Your WordPress Admin Dashboard:
   • Navigate to your WordPress site where Groundhogg is installed.
2. Create a New Funnel:
   • Go to Groundhogg > Funnels in the WordPress dashboard.
   • Click Add New and select Start from Scratch. Name your funnel (e.g., “Google Form Integration”).
3. Add the Webhook Listener Benchmark:
   • In the funnel builder, drag the Webhook Listener benchmark from the left sidebar (under Benchmarks) into the funnel flow.
   • This is the starting point for capturing data from your Google Form.
4. Copy the Listener URL:
   • Once the Webhook Listener is added, click on it to open its settings.
   • You’ll see a Listener URL field with a unique URL (e.g., https://yourdomain.com/wp-json/groundhogg/v3/webhooks/...).
   • Copy this URL to your clipboard. This is where Google Form data will be sent.
5. Save the Funnel:
   • Click Save in the funnel builder to activate the Webhook Listener. (You’ll configure field mapping later after sending test data.)

Step 3: Set Up a Google Apps Script to Send Webhook Data

Google Forms doesn’t natively support webhooks, so you’ll use Google Apps Script to send form responses to Groundhogg’s Webhook Listener.

1. Open the Google Form Script Editor:
   • In your Google Form, click the three-dot menu (⋮) in the top-right corner.
   • Select Script Editor. This opens a new tab with a blank script.
2. Add the Webhook Script:
   • Replace the default code with the following script. Replace YOUR_WEBHOOK_LISTENER_URL with the Listener URL you copied from Groundhogg:
     

   function onFormSubmit(e) {
     // Replace this with your webhook URL
     var webhookUrl = "https://your-webhook-endpoint.com";
   
     // Get form response data
     var formResponse = e.response;
     var itemResponses = formResponse.getItemResponses();
   
     // Build the payload
     var payload = {
       "timestamp": formResponse.getTimestamp().toISOString(),
       "responses": {}
     };
   
     // Loop through each form response and add it to the payload
     for (var i = 0; i < itemResponses.length; i++) {
       var itemResponse = itemResponses[i];
       payload.responses[itemResponse.getItem().getTitle()] = itemResponse.getResponse();
     }
   
     // Send the data to the webhook URL
     var options = {
       "method": "post",
       "contentType": "application/json",
       "payload": JSON.stringify(payload)
     };
   
     UrlFetchApp.fetch(webhookUrl, options);
   }
   				

3. Save the Script:
   • Click the disk icon or go to File > Save. Name your project (e.g., “Groundhogg Webhook”).
4. Set Up a Trigger:
   • In the Script Editor, click the clock icon (Triggers) in the left sidebar.
   • Click + Add Trigger in the bottom-right corner.
   • Configure the trigger:
     • Choose which function to run: onSubmit.
     • Choose which deployment: Head (default).
     • Select event source: From form.
     • Select event type: On form submit.
   • Click Save. You may need to authorize the script by signing in with your Google account and granting permissions.
5. Test the Script:
   • Go back to your Google Form, submit a test response, and ensure the script runs without errors. (You’ll verify the data in Groundhogg later.)