Web forms are a very powerful tool for interacting with users, for instance, they can subscribe to your company’s newsletter by entering their email address and any other data you wish to collect. Or perhaps you are an e-commerce company that wants to include a sales order form on your website as a convenience to your customers. Another type of form that may be useful to your business is including a customer feedback form so that you can gain better knowledge of what is working and what is not in your business.
Elementor Pro comes with many native widgets, one of the widgets to create a form easily on your website is the Form widget. With the Form widget, you can create a wide range type of forms on your WordPress website. For more information about the widget, you can check our previous article about Elementor Form Builder.
While Elementor has a built-in feature to manage form submissions (data), you might want to send the data to Google Sheets to organize and categorize data into a logical format.
In this article, we will show you how to get data from Elementor Form into Google Sheet which is a cloud spreadsheet editor that makes it easy to access and use for the users.
Start a New Spreadsheet in Google Sheets
You can access google sheets from sheets.google.com using a free Google account (for personal use) or a Google Workspace account (for business use). Create a new blank spreadsheet to get started.

Open the Apps Script Editor
Previously placed under Tools menu by the name script editor, nowadays it called Apps Script under Extension menu.

Get the Code to Enable the Data Transfer
To be able to transfer the Elementor form data to Google Sheets, you need to connect them first using the following code.
// Change to true to enable email notifications var emailNotification = false; var emailAddress = "Change_to_your_Email"; // DO NOT EDIT THESE NEXT PARAMS var isNewSheet = false; var recivedData = []; /** * this is a function that fires when the webapp receives a GET request * Not used but required. */ function doGet( e ) { return HtmlService.createHtmlOutput( "Yepp this is the webhook URL, request received" ); } // Webhook Receiver - triggered with form webhook to pusblished App URL. function doPost( e ) { var params = JSON.stringify(e.parameter); params = JSON.parse(params); insertToSheet(params); // HTTP Response return HtmlService.createHtmlOutput( "post request received" ); } // Flattens a nested object for easier use with a spreadsheet function flattenObject( ob ) { var toReturn = {}; for ( var i in ob ) { if ( ! ob.hasOwnProperty( i ) ) continue; if ( ( typeof ob[ i ] ) == 'object' ) { var flatObject = flattenObject( ob[ i ] ); for ( var x in flatObject ) { if ( ! flatObject.hasOwnProperty( x ) ) continue; toReturn[ i + '.' + x ] = flatObject[ x ]; } } else { toReturn[ i ] = ob[ i ]; } } return toReturn; } // normalize headers function getHeaders( formSheet, keys ) { var headers = []; // retrieve existing headers if ( ! isNewSheet ) { headers = formSheet.getRange( 1, 1, 1, formSheet.getLastColumn() ).getValues()[0]; } // add any additional headers var newHeaders = []; newHeaders = keys.filter( function( k ) { return headers.indexOf( k ) > -1 ? false : k; } ); newHeaders.forEach( function( h ) { headers.push( h ); } ); return headers; } // normalize values function getValues( headers, flat ) { var values = []; // push values based on headers headers.forEach( function( h ){ values.push( flat[ h ] ); }); return values; } // Insert headers function setHeaders( sheet, values ) { var headerRow = sheet.getRange( 1, 1, 1, values.length ) headerRow.setValues( [ values ] ); headerRow.setFontWeight( "bold" ).setHorizontalAlignment( "center" ); } // Insert Data into Sheet function setValues( sheet, values ) { var lastRow = Math.max( sheet.getLastRow(),1 ); sheet.insertRowAfter( lastRow ); sheet.getRange( lastRow + 1, 1, 1, values.length ).setValues( [ values ] ).setFontWeight( "normal" ).setHorizontalAlignment( "center" ); } // Find or create sheet for form function getFormSheet( formName ) { var formSheet; var activeSheet = SpreadsheetApp.getActiveSpreadsheet(); // create sheet if needed if ( activeSheet.getSheetByName( formName ) == null ) { formSheet = activeSheet.insertSheet(); formSheet.setName( formName ); isNewSheet = true; } return activeSheet.getSheetByName( formName ); } // magic function where it all happens function insertToSheet( data ){ var flat = flattenObject( data ); var keys = Object.keys( flat ); var formName = data["form_name"]; var formSheet = getFormSheet( formName ); var headers = getHeaders( formSheet, keys ); var values = getValues( headers, flat ); setHeaders( formSheet, headers ); setValues( formSheet, values ); if ( emailNotification ) { sendNotification( data, getSeetURL() ); } } function getSeetURL() { var spreadsheet = SpreadsheetApp.getActiveSpreadsheet(); var sheet = spreadsheet.getActiveSheet(); return spreadsheet.getUrl(); } function sendNotification( data, url ) { var subject = "A new Elementor Pro Froms subbmition has been inserted to your sheet"; var message = "A new subbmition has been recived via " + data['form_name'] + " form and inserted into your Google sheet at: " + url; MailApp.sendEmail( emailAddress, subject, message, { name: 'Automatic Emailer Script' } ); }
Credit for the code to bainternet.
Clear All Code and Paste the Code
After you get the code, paste it in the Apps Script editor, clear all existing code first to make it works.

Rename the Project and Save the Changes
Once the code is ready, you can rename the script title, then click save button .

Deploy the Script and Copy the Web App URL
After the change is saved, then let’s deploy the script by clicking the Deploy button and selecting New deployment from the options.

On the appearing window click the gear icon , and choose the Web app option.

On the newly appearing form change the access to Anyone and click the Deploy button.

If somehow the deployment of the script is asking for permission for accessing your spreadsheet, please Authorize its access to make the script is able to write the data on your spreadsheet.
After the deployment of the script is successful, copy the Web app URL.

Paste the Web App URL into Elementor Form Webhook Setting
On Elementor editor, click the form you want to connect with Google sheet, it will open the form setting on the left panel of the editor, then scroll down and click on the Action After Submit block — Add Webhook action — it then opens a new Webhook block below, clicking on it will give you a URL field for placing the copied web app link.

Okay, that’s it, you can test the form by filling in the text field and clicking the send button.
We tested the form we created by filling in the form and clicking the send button 3 times.

On Google sheet, the code will make a new sheet under the name of the form on Elementor. We named the form to google sheet, and the new sheet name is the same.

On the newly created sheet, the data we send from the Elementor form is all there, without missing any data at all.

The Bottom Line
Web forms are a useful tool for tracking certain information from your website visitors. And they are probably one of the most important elements on your website when it comes to achieving your goals. By connecting the form to our Google sheet, we can organize and categorize data into a logical format. Once this data is entered into the spreadsheet, we can use it to help organize and grow our business.
6 Comments
Hey there,
I’ve tried your method, now, I did receive a notification on my test email.
However, I’m not seeing a new form being added onto my Google Sheets.
Not sure what I’m doing wrong…
Hey Simon, have you cleared the editor in App Script before you paste the code. this default code “function myFunction() { }” must be deleted first.
Hi Hendry!
I want to activate the “Advanced Data” field on the elementor form but when I do so, the script stops working, it just creates a new sheet but no data is displayed.
The script has been working just fine for about 3 months now, it’s just that I need to add the advanced data to it.
Thanks in advance!
Hi,
I got the same problem.
Did you solve this?
Thanks!
Hi,
May I ask what kind of “advanced data” do you mean?
we tested with advanced form fields like File upload, password field, acceptance checkbox, and date field and it’s transferred successfully to Google Sheets.
Hi, works great. Thank you very much! I have a questionnaire on my site and i want the script to automatically sum the items, but i cant manage to do so. Could you please help me with that? Thank you very much