Cómo conectar formulario Blocko de WordPress con Google Sheets usando Google Apps Script

¿Quieres guardar las respuestas de tu formulario directamente en una hoja de cálculo de Google? Aquí te explico cómo hacerlo desde WordPress usando Google Apps Script y un formulario creado con Gutenberg + Blocko.

1. Crea la hoja de cálculo

• Ve a Google Sheets, crea un documento y asígnale nombre: Email log.
• No es necesario crear columnas; el script las agregará.

2. Agrega este script en Google Apps Script

En la hoja, ve a Extensiones > Apps Script y pega:

/**
 * @OnlyCurrentDoc
 */
function doPost(e) {
  var sheetName = "Email log";
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var sheet = ss.getSheetByName(sheetName);
  
  // Crear hoja si no existe
  if (!sheet) {
    sheet = ss.insertSheet(sheetName);
    sheet.appendRow(["Name", "Email", "Phone", "Subject", "Message", "Date", "Time"]);
  }

  // Parsear la petición entrante
  var data = JSON.parse(e.postData.contents);
  var name = data.name || "";
  var email = data.email || "";
  var phone = data.phone || "";
  var subject = data.subject || "";
  var message = data.message || "";
  var date = Utilities.formatDate(new Date(), Session.getScriptTimeZone(), "yyyy-MM-dd");
  var time = Utilities.formatDate(new Date(), Session.getScriptTimeZone(), "HH:mm:ss");

  // Agregar fila a la hoja
  sheet.appendRow([name, email, phone, subject, message, date, time]);

  return ContentService.createTextOutput("ok").setMimeType(ContentService.MimeType.TEXT);
}

3. Publica como aplicación web

• Clic en Implementar > Nueva implementación.
• Tipo: Aplicación web.
• Ejecutar como: Tú mismo.
• Acceso: Cualquiera (para que WordPress pueda enviar datos).
• Copia la URL del script (la usarás en el hook).

Agrega el hook en tu tema o plugin

function form_1_google_sheets_callback( $form_data ) {
	if ( empty( $form_data['type'] ) || $form_data['type'] !== 'google_sheets_1' ) return;

	$url = 'https://script.google.com/macros/s/TU_ID/exec'; // Reemplaza con tu URL

	$data = array(
		'name'    => sanitize_text_field( $form_data['name'] ?? '' ),
		'phone'   => sanitize_text_field( $form_data['phone'] ?? '' ),
		'email'   => sanitize_email( $form_data['email'] ?? '' ),
		'subject' => 'Formulario Web',
		'message' => sanitize_textarea_field( $form_data['message'] ?? '' ),
	);

	wp_remote_post( $url, array(
		'method'  => 'POST',
		'body'    => wp_json_encode( $data ),
		'headers' => array( 'Content-Type' => 'application/json' ),
	));
}
add_action( 'process_form', 'form_1_google_sheets_callback', 1 );

5. En tu formulario Blocko (Gutenberg)

Tu bloque personalizado debe incluir un hidden con type:

<input type="hidden" name="type" value="google_sheets_1" />

Asegúrate de que tu formulario dispare el hook process_form cuando se envíe. Puedes hacerlo desde tu bloque Gutenberg personalizado con dispatch o mediante AJAX/PHP.