Come inviare i dati del modulo Elementor a Fogli Google

I moduli web sono uno strumento molto potente per interagire con gli utenti, ad esempio possono iscriversi alla newsletter della tua azienda inserendo il loro indirizzo email e qualsiasi altro dato che desideri raccogliere. O forse sei una società di e-commerce che desidera includere un modulo d'ordine di vendita sul tuo sito Web per comodità dei tuoi clienti. Un altro tipo di modulo che può essere utile per la tua attività è includere un modulo di feedback dei clienti in modo da poter acquisire una migliore conoscenza di ciò che funziona e ciò che non lo è nella tua attività.

Elementor Pro viene fornito con molti widget nativi, uno dei widget per creare facilmente un modulo sul tuo sito Web è il widget Modulo. Con il widget Modulo, puoi creare un'ampia gamma di moduli sul tuo sito Web WordPress. Per ulteriori informazioni sul widget, puoi consultare il nostro precedente articolo su Elementor Form Builder.

Sebbene Elementor abbia una funzione integrata per gestire gli invii di moduli (dati), potresti voler inviare i dati a Fogli Google per organizzare e classificare i dati in un formato logico.

In questo articolo, ti mostreremo come ottenere i dati da Elementor Form in Google Sheet, che è un editor di fogli di calcolo cloud che semplifica l'accesso e l'utilizzo per gli utenti.

Avvia un nuovo foglio di lavoro in Fogli Google

Puoi accedere a fogli di Google da sheet.google.com utilizzando un account Google gratuito (per uso personale) o un account Google Workspace (per uso aziendale). Crea un nuovo foglio di lavoro vuoto per iniziare.

Apri l'editor di script delle app

Precedentemente posizionato nel menu Strumenti dal nome dell'editor di script, oggi si chiamava Apps Script nel menu Estensione .

Ottieni i codici per abilitare il trasferimento dei dati

Per poter trasferire i dati del modulo Elementor su Fogli Google, devi prima collegarli utilizzando il seguente codice.

 // Cambia in true per abilitare le notifiche e-mail
var emailNotification = false;
var emailAddress = "Cambia_alla_tua_email";

// NON MODIFICARE QUESTI PROSSIMI PARAMENTI
var isNewSheet = false;
var dati ricevuti = [];
/**
 * questa è una funzione che si attiva quando la webapp riceve una richiesta GET
 *Non utilizzato ma obbligatorio.
 */
funzione doGet( e ) {
	return HtmlService.createHtmlOutput( "Sì, questo è l'URL del webhook, richiesta ricevuta");
}
// Ricevitore Webhook: attivato con il modulo webhook all'URL dell'app pubblicato.
funzione doPost( e ) {
	var parametri = JSON.stringify(e.parametro);
	parametri = JSON.parse(parametri);
	insertToSheet(parametri);
	// Risposta HTTP
	return HtmlService.createHtmlOutput("richiesta inviata ricevuta");
}
// Appiattisce un oggetto nidificato per un utilizzo più semplice con un foglio di calcolo
funzione appiattireOggetto( ob ) {
	var toReturn = {};
	for ( var i in ob ) {
		se ( ! ob.hasOwnProperty( i ) ) continua;
		if ( ( tipo di oggetto[ i ] ) == 'oggetto' ) {
			var flatObject = flattenObject( ob[ i ] );
			for ( var x in flatObject ) {
				if ( ! flatObject.hasOwnProperty( x ) ) continua;
				toReturn[ i + '.' + x ] = oggetto piatto[ x ];
			}
		} altro {
			toReturn[ i ] = ob[ i ];
		}
	}
	tornare a Ritorno;
}
// normalizza le intestazioni
funzione getHeaders( formSheet, keys) {
	intestazioni var = [];
  
	// recupera le intestazioni esistenti
    if ( ! isNewSheet ) {
	  headers = formSheet.getRange( 1, 1, 1, formSheet.getLastColumn() ).getValues()[0];
    }
	// aggiungi eventuali intestazioni aggiuntive
	var newHeaders = [];
	newHeaders = keys.filter( funzione( k ) {
		restituisce headers.indexOf( k ) > -1 ? falso : k;
	} );
	newHeaders.forEach( funzione( h ) {
		headers.push( h );
	} );
	intestazioni di ritorno;
}
// normalizza i valori
funzione getValues( intestazioni, flat ) {
	var valori = [];
	// spinge i valori in base alle intestazioni
	headers.forEach( funzione( h ){
		values.push( flat[ h ] );
	});
	valori di ritorno;
}
// Inserisci le intestazioni
funzione setHeaders(foglio, valori) {
	var headerRow = sheet.getRange( 1, 1, 1, values.length )
	headerRow.setValues([valori]);
	headerRow.setFontWeight("grassetto").setHorizontalAlignment("centro");
}
// Inserisci i dati nel foglio
funzione setValues(foglio, valori) {
	var lastRow = Math.max(sheet.getLastRow(),1);
	sheet.insertRowAfter( lastRow );
	sheet.getRange( lastRow + 1, 1, 1, values.length ).setValues([ valori] ).setFontWeight("normal" ).setHorizontalAlignment("centro");
}
// Trova o crea un foglio per il modulo
funzione getFormSheet( nomeform) {
	var formSheet;
	var activeSheet = SpreadsheetApp.getActiveSpreadsheet();
	// crea un foglio se necessario
	if (activeSheet.getSheetByName( formName ) == null ) {
      formSheet = activeSheet.insertSheet();
      formSheet.setName( formName);
      isNewSheet = vero;
	}
	restituisce activeSheet.getSheetByName(formName);
}

// funzione magica dove tutto accade
funzione insertToSheet( data ){
	var flat = flattenObject (dati);
	var keys = Object.keys( flat );
	var formName = data["form_name"];
	var formSheet = getFormSheet( formName );
	var headers = getHeaders (formSheet, keys);
	var values ​​= getValues(intestazioni, flat);
	setHeaders( formSheet, headers);
	setValues( formSheet, valori);
	
    se (e-mail di notifica) {
		sendNotification( data, getSeetURL() );
	}
}
funzione getSeetURL() {
  var foglio elettronico = SpreadsheetApp.getActiveSpreadsheet();
  foglio var = foglio di calcolo.getActiveSheet();
  restituisce spreadsheet.getUrl();
}
funzione sendNotification(dati, url) {
	var subject = "Una nuova sottomissione di Elementor Pro Froms è stata inserita nel tuo foglio";
  var message = "Una nuova sottoscrizione è stata ricevuta tramite il modulo " + data['form_name'] + " e inserita nel tuo foglio Google all'indirizzo: " + url;
	MailApp.sendEmail( indirizzo email, oggetto, messaggio, {
		nome: 'Script di posta elettronica automatico'
	} );
}

Credito per il codice a bainternet.

Cancella tutto il codice e incolla il codice

Dopo aver ottenuto il codice, incollalo nell'editor di Apps Script, cancella prima tutto il codice esistente per farlo funzionare.

Rinomina il progetto e salva le modifiche

Una volta che il codice è pronto, puoi rinominare il titolo dello script, quindi fare clic sul pulsante Salva .

Distribuisci lo script e copia l'URL dell'app Web

Dopo aver salvato la modifica, distribuiamo lo script facendo clic sul pulsante Distribuisci e selezionando Nuova distribuzione dalle opzioni.

Nella finestra che appare, fai clic sull'icona a forma di ingranaggio e scegli l'opzione dell'app Web .

Nel modulo appena visualizzato, modifica l'accesso a Chiunque e fai clic sul pulsante Distribuisci .

Se in qualche modo l'implementazione dello script richiede l'autorizzazione per accedere al tuo foglio di calcolo, autorizza il suo accesso per fare in modo che lo script sia in grado di scrivere i dati sul tuo foglio di calcolo.

Al termine della distribuzione dello script, copiare l'URL dell'app Web .

Incolla l'URL dell'app Web nelle impostazioni Webhook del modulo Elementor

Nell'editor di Elementor, fai clic sul modulo che desideri connettere al foglio di Google, si aprirà l'impostazione del modulo nel pannello di sinistra dell'editor, quindi scorri verso il basso e fai clic sul blocco Azione dopo l'invio - Aggiungi azione Webhook - quindi si apre un nuovo Blocco Webhook di seguito, facendo clic su di esso verrà visualizzato un campo URL per posizionare il collegamento dell'app Web copiato.

Ok, il gioco è fatto, puoi testare il modulo compilando il campo di testo e facendo clic sul pulsante di invio.

Abbiamo testato il modulo che abbiamo creato compilando il modulo e facendo clic sul pulsante di invio 3 volte.

Sul foglio di Google, il codice creerà un nuovo foglio sotto il nome del modulo su Elementor. Abbiamo chiamato il modulo in google sheet e il nuovo nome del foglio è lo stesso.

Sul foglio appena creato, i dati che inviamo dal modulo Elementor sono tutti lì, senza perdere alcun dato.

Riassumendo

I moduli web sono uno strumento utile per tenere traccia di determinate informazioni dai visitatori del tuo sito web. E sono probabilmente uno degli elementi più importanti del tuo sito web quando si tratta di raggiungere i tuoi obiettivi. Collegando il modulo al nostro foglio Google, possiamo organizzare e classificare i dati in un formato logico. Una volta inseriti questi dati nel foglio di calcolo, possiamo utilizzarli per organizzare e far crescere la nostra attività.