Integrar WhatsApp con WooCommerce

Paso a paso

1. 1

   Conecta un número en ZapZap API

   En el panel de ZapZap API, crea una instancia y lee el QR Code con el WhatsApp del número que enviará las notificaciones de la tienda. Guarda el instanceId, la x-api-key y el x-api-secret, que se usarán en las llamadas HTTP.

2. 2

   Activa los webhooks en WooCommerce

   En el panel de WordPress, ve a WooCommerce > Ajustes > Avanzado > Webhooks y haz clic en Añadir webhook. Ponle un nombre como Notifica WhatsApp y deja el estado en Activo.

3. 3

   Configura el tema y la URL de entrega

   En Tema, elige Pedido creado y Pedido actualizado (crea un webhook para cada uno). En el campo URL de entrega, indica la dirección de tu backend que recibirá el payload del pedido, por ejemplo https://tu-servidor.com/woo/pedido. Define un Secreto para validar la firma X-WC-Webhook-Signature.

4. 4

   Procesa el payload y dispara el mensaje

   En tu backend, lee el JSON del pedido enviado por WooCommerce (billing.phone, status, line_items) y arma el texto de la notificación según el estado. Luego haz una solicitud a ZapZap API enviando el mensaje al número del cliente mediante tu instancia.

5. 5

   Prueba con un pedido real

   Haz un pedido de prueba en la tienda, aprueba el pago y cambia el estado a completado. Verifica que llegaron los mensajes de confirmación, de pago y de envío. Usa el crédito de bienvenida (sujeto a la campaña vigente) para validar todo el flujo antes de escalar.

// ILUSTRATIVO: consulta los endpoints reales en https://api.zapzapapi.com/llms.txt
// Backend que recibe el webhook de WooCommerce y notifica al cliente por WhatsApp

app.post('/woo/pedido', async (req, res) => {
  const pedido = req.body; // payload de WooCommerce
  const telefono = pedido.billing.phone.replace(/\D/g, '');

  const textos = {
    'pending':    `Recibimos tu pedido #${pedido.number}. Esperando el pago.`,
    'processing': `Pago aprobado del pedido #${pedido.number}. Ya estamos preparando tus artículos.`,
    'completed':  `Tu pedido #${pedido.number} fue enviado. ¡Gracias por tu compra!`
  };

  const text = textos[pedido.status];
  if (!text) return res.sendStatus(200);

  const instanceId = 'TU_INSTANCIA';

  await fetch(`https://api.zapzapapi.com/api/v1/${instanceId}/send/text`, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'x-api-key': process.env.ZAPZAP_API_KEY,
      'x-api-secret': process.env.ZAPZAP_API_SECRET
    },
    body: JSON.stringify({ number: `55${telefono}`, text })
  });

  res.sendStatus(200);
});