[Hướng dẫn] Đồng bộ dữ liệu điền form trên website lên Google Sheet 2024

Đồng bộ dữ liệu điền form trên website lên Google Sheet – Dù bạn đang sở hữu một website hay Landing page, chắc chắn bạn luôn có các CTA hay các form để khách hàng điền thông tin. Từ những thông tin này sẽ là data quan trọng để doanh nghiệp/cửa hàng tư vấn, hỗ trợ, upsale cho khách hàng.

Vấn đề ở đây là, DỮ LIỆU CỦA KHÁCH HÀNG SAU KHI ĐIỀN FORM SẼ ĐƯỢC GỬI VỀ ĐÂU?

Để mang đến sự tiện lợi và quen thuộc cho khách hàng, ATPWEB sẽ hướng dẫn cách đồng bộ dữ liệu điền form trên website lên Google Sheet.

Liên hệ Fanpage ATPWEB

Các bước thực hiện đồng bộ dữ liệu điền form trên website lên Google Sheet

Để thực hiện đồng bộ dữ liệu điền form trên website lên Google Sheet bạn cần thực hiện 2 bước:

1. Thiết lập webhook với Apps Script trên Google Sheet
2. Dán URL webhook trên vào Form trên Elementor

#Script webhook

// Change to true to enable email notifications var emailNotification = true; var emailAddress = "Đổi_thành_Email_của_bạn"; // 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' } ); }

Bước 1: Sử dụng Apps Script trên Google Sheet

Vào Google Sheet -> Chọn Tiện ích mở rộng -> chọn Apps script

Copy và dán script webhook ở trên vào -> nhấn Triển khai ->  Tùy chọn triển khai mới

Chọn loại Ứng dụng Web -> Chọn các thông tin như ảnh bên dưới -> Triển khai

#Lưu ý: Ở phần Người có quyền truy cập bạn vui lòng chọn Bất kỳ ai

Copy URL Webhook ->Xong

Bước 2: Webhook trong Elementor

Vào Form Elementor -> Chọn webhook

Dán URL đã copy ở trên vào -> nhấn cập nhật

Các lưu ý trong nội dung script:

– Điều chỉnh dòng bên dưới thành tiêu đề

var subject -> Tiêu đề của thông báo tới gmail var message -> Nội dung trong form function sendNotification( data, url ) { var subject = "Thông tin khách hàng mới từ website"; var message = "Có thông tin form mới tại " + data['form_name'] + " Được cập nhật vào google sheet : " + url; MailApp.sendEmail( emailAddress, subject, message, { name: 'Automatic Emailer Script' } ); }

– Đổi thành Email của bạn và bật noti nếu cần

var emailNotification = true; var emailAddress = "your_adress@gmail.com";

Tổng kết

Như vậy là chỉ với vài bước đơn giản mà bạn đã có thể đồng bộ dữ liệu điền form trên website lên Google Sheet. Từ giờ bạn chỉ cần thực hiện kéo các phễu về landing page/website và khách hàng điền đơn, click CTA… Sau đó quản trị lead và data sẽ được tự động đưa về Google Sheet và thông báo qua email của bạn.

Việc quản lý dữ liệu bây giờ là cực kỳ dễ dàng và quen thuộc rồi đúng không nào. Chúc các bạn thành công!

Đừng quên liên hệ ATPWEB để thiết kế website hoặc thiết kế landing page nhé.

 

• Hotline: 0707 6666 56
• Fanpage: http://facebook.com/atpweb.vn
• Website: http://atpweb.vn