Formulario de Elementor a hojas de calculo de Google sheets - 2022

Aprende como vincular cualquier formulario de Elementor a las hojas de Calculo de Google sheets en menos de 5 minutos. El código esta en el primer comentario ya que KZbin no me dejo ponerlo en la descripción.
Recomendación personal : Ver el video a velocidad 1.5

[@wito9961]

/* Google app-script to utilise Elementor Pro Forms webhook * From : github.com/pojome/elementor/issues/5894 */ var emailNotification = false; /* Change to true to enable email notifications */ var emailAddress = "[e-mail]"; /* EDIT this to your email */ // DO NOT EDIT THESE NEXT PARAMS var isNewSheet = false; var receivedData = []; /** * this is a function that fires when the webapp receives a GET request * Not used but required. */ function doGet( e ) { return HtmlService.createHtmlOutput( "Yep this is the webhook URL, request received" ); } // Webhook Receiver - triggered with form webhook to published 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 ); } // key 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 Forms submission has been inserted to your sheet"; var message = "A new submission has been received via " + data['form_name'] + " form and inserted into your Google sheet at: " + url; MailApp.sendEmail( emailAddress, subject, message, { name: 'Automatic Emailer Script' } ); }

[@EvandroTapia]

Me funcionó, muchas gracias

[@alejandroojeda7792]

Fija el comentario así los usuarios hayan más facilmente el código

[@santiagodurango3438]

Dios te bendiga Me sirvió ucho el video, estaba loco tratando de solucionar, gracias!

[@plasty82]

Lo apliqué y me funcionó perfecto! gracias!

[@byroncastellanos2593]

El mejor tutorial del mundo, mundial

[@grozenblat]

Espectacular. El mejor tutorial de todo KZbin jajaja. Gracias WITO!

[@spencerbce9231]

Gracias crack! Los que no encuentran el código, sigan buscando en los comentarios. Ahí está. Solo busquen.

[@joel.31]

Sos el 1 wito! El código está a lo último en los comentarios, busquen!

[@JoseGutierrez-wr1dm]

Hola! No se muestran en el sheets las fechas y otros valores que me interesaría que se muestren, como puedo hacerlo?

[@vanematadeen7742]

muchas gracias por este video, me sirvió muchísimo!!!

[@jorgerivera6560]

Hola, implemente con éxito 2 veces a 2 formularios distintos y me funcionó re bien. He creado un nuevo formulario pero ahora me sale un error, primero me salió la ventana con los permisos hasta ahí bien, luego me llego un correo para aprobar el acceso, el cual aprobé; pero ya no me permitió integrar correctamnete. Habrá alguna actualización? o Puedo duplicar el documento de Google Sheets y cambiar el nombre del formulario si es así como consigo el link para pegarlo en el Webhook del formulario en elementor, muchas gracias

[@jetaembcp]

Tenga su like, buen hombre. Muchas gracias.

[@AlvaroMCZ]

Te felicito por tu canal sigue subiendo contenido eres bueno en lo que haces 🤓🤓

[@automatizotunegocio8523]

Buen video amigo, tienes un suscriptor nuevo saludos.

[@suyenfs]

¿Hola, como puedo enviar la información a una base de datos externa en vez de la hoja de cálculo?

[@luisduranve]

el formulario me marca error de webhook al intentar enviar la info, la info llega a mi correo pero no pasa por la webhook

[@zaniahparra3687]

Hola Wito, buen día! he usado tu código y me ha funcionado muy bien, muchas gracias! solo que en estás últimas ocaciones, el formulario llega perfectamente a la hoja de cálculo, pero en la página web aparece un mensaje de "Error de envío" Sabes por qué es eso? muchas gracias!

[@jorgevivasbcrown]

Me esta pasando lo mismo, que puede ser?

[@jorgevivasbcrown]

ya lograste resolver el problema?

[@zaniahparra3687]

@@jorgevivasbcrown No tengo idea 😔

[@zaniahparra3687]

@@jorgevivasbcrown No, no sé como, yo no soy programadora. Y tú?

[@ilisam]

Mil gracias!!! Funcionó perfecto!! 🙏🏼

[@jhonbetancourt1197]

@Oscar Mellado x2

[@alexdesupercool2291]

Hola, serías tan amable de compartir el código?

[@ilisam]

@@alexdesupercool2291 hola Alex! El código ya no me funciona :( lo tuve activo hasta el 20 de febrero

[@ilisam]

@Oscar Mellado hola Oscar! El código me dejó de funcionar :( reemplacé el formulario de Elementor por uno de Google Forms que se comunica directo con Google Sheets y lo integré en la web para resolver. Espero te pueda ayudar también!

[@ilisam]

@@jhonbetancourt1197 hola! El código me dejó de funcionar :( resolví usando un Google Form (que comunica directo a Google Sheets) e integrando el short code del Google form en la web. Espero te funcione!

[@greciaprint]

Perdon, sigue siendo vigente este tutorial en cuanto a su efectividad? y que diferencia habria a quien se conecta con zappien de pago?? muchas gracias

[@hectorcastillo1455]

Yo acabo de probarlo y sí funciona, sin ningún costo extra. También uso zappier y creo que una primer diferencia es que no tengo la fecha del lead. Espero encontrar la forma

[@greciaprint]

@@hectorcastillo1455 voy a probarlo gracias

[@walterwir]

Hola estimado👋🏼...y el codigo que mencionas donde esta?

[@juanpabloponzioquiroga1871]

Buenas, se puede hacer esto pero con dos paginas web diferentes para que vayan al mismo google sheets?

[@veroniquekrause]

Hola Wito, eres un crack! Por casualidad tienes el código para hacer lo mismo pero desde ninja forms? Yo uso Elementor, pero en la web que estoy creando tengo un solo formulario de ninja porque está integrado en un plugin que es la base de la web (Geodirectory). La cosa es que ese formulario termina siendo prácticamente la base de datos. Muchas gracias desde ahorita 🤗

[@Nastydesing]

Gracias por tu aporte, like y suscripción .

[@litefilos]

Genial, muchas gracias por compartir :)

[@ericktorres5413]

Gracias wito funcionó perfecto!

[@samanthasouki9466]

Me sirvió, muchas gracias!

[@sebastianhormero1421]

Men, sos un crack enserio

[@Smith-qy5ir]

El codigo del script donde lo encuentro

[@terramarrealtor]

hola no me deja abrir la aplicacion me sale direccion invalida. que se puede hacer gracias

[@brunoburelli1410]

Excelente video me ayudo mucho, como puedo agregar más correos a la notificación vía mail, muchas gracias🔥

[@alexdesupercool2291]

Hola Wito, muchas gracias por tu video, donde puedo encontrar el código? Desde ya gracias!

[@veroniquekrause]

Lo puso en el primer comentario.

[@chuchuqui1]

Se puede editar Google sheet con esto?

[@alexdesupercool2291]

Tienes algun sitio web propio? ElCódigo no está =(

[@samuelbalcazar6747]

funciona muy bueno

[@ricardodelosreyes5307]

Disculpa pero no veo donde tienes el script

[@tuviajeenprimeraclase]

no dejaste el codigo.. no dices donde descargar o copiar el dicho codigo.. no se ve tan facil como prometes...

[@julian-munoz]

Hola WITO. Lo he probado con ELEMENTOR FREE y no consigo que funcione. ¿Sabes si es compatible? Saludos.

[@wito9961]

Debes colocar el código directamente desde la sección avanzado - custom CSS que solo esta disponible en Elementor Pro

[@julian-munoz]

Gracias @@wito9961 En Elementor Free se pueden añadir Webhook Actions en Setting > Add Action, pero no existe el apartado Actions After Submit. Y en la zona de Webhook URL aparece solo este texto "Enter the webhook URL where you want to send your Form data after submit e.g. Integrate with Zapier Webhook." (Advanced Data no aparece). Por lo que veo las Add Action en Elementor Free se pueden añadir pero no sirven para este propósito de enlazar con Google Sheets 😞 (a pasar por caja 💸). Por cierto, ¿para poder usar una Google Sheet almacenada en Drive sabes si es necesario disponer de una licencia en Google Workspace (workspace.google.com/intl/es/pricing.html) o no es obligatorio?

[@ANDI-M-cx9qv]

@@wito9961 donde esta el código?

[@valeriapacheco175]

@@wito9961 Hola no logre que funcione, tengo Elementor Pro y puse el cogido en sección avanzado - custom CSS , y me sale error

[@robertodiaz1602]

Buenisimo tutorial!! preguntas: hay forma de utilizar el mismo script para usar dos formularios diferentes para que me cree otra hoja mas o solo me sirve para crear una sola hoja?, y en vez de mail, hay forma de enviar mensaje a un whatsapp?. desde ya muchas gracias! Abrazo!

[@wito9961]

Claro, puedes usarlo en todos los formularios de Elementor que quieras, lo único que recomiendo es que le cambies el nombre al formulario al momento que lo creas en Elementor para que no te confundas

[@robertodiaz1602]

@@wito9961 Genial!! Voy a probar, gracias por la respuesta, saludos

[@restaurantesvenezolanosint]

@@wito9961 hola, me ha funcionado perfecto desde que lo implementé... Ahora he creado un segundo formulario para otros usuarios. Use la misma url para que lo vacie en la misma hoja de cálculo y no me agrega la data de ese nuevo formulario. Sabrías decirme por qué?

[@Pablo-Torti]

No encuentro el Código...

[@wito9961]

Está en el primer comentario

[@alexdesupercool2291]

@@wito9961 No está =(

[@ltlta]

@@wito9961 Holaaa donde está el codigo?

[@joseluisrangelsaavedra7442]

Donde esta el codigo?

[@nicolasmaciel172]

Serias tan amable de pasarnos el codigo. gracias

[@wito9961]

En el primero comentario

[@fabiancl25]

@@wito9961 no lo veo amigo...

[@wito9961]

@@fabiancl25 /* Google app-script to utilise Elementor Pro Forms webhook * From : github.com/pojome/elementor/issues/5894 */ var emailNotification = false; /* Change to true to enable email notifications */ var emailAddress = "[e-mail]"; /* EDIT this to your email */ // DO NOT EDIT THESE NEXT PARAMS var isNewSheet = false; var receivedData = []; /** * this is a function that fires when the webapp receives a GET request * Not used but required. */ function doGet( e ) { return HtmlService.createHtmlOutput( "Yep this is the webhook URL, request received" ); } // Webhook Receiver - triggered with form webhook to published 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 ); } // key 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 Forms submission has been inserted to your sheet"; var message = "A new submission has been received via " + data['form_name'] + " form and inserted into your Google sheet at: " + url; MailApp.sendEmail( emailAddress, subject, message, { name: 'Automatic Emailer Script' } ); }

[@jessykaexito2572]

Buenas, disculpa pero el código no está....

[@wito9961]

En el primer comentario, KZbin no me dejo pegarlo en la descripción

[@AMG8200]

Deslike me apareio un anuncio de terror :(

[@alejandrodelhierroschumylo3565]

donde esta el codigo?