Formulario HTML / Script JS Newsletter

Cómo enviar contactos a Woowup desde el popup de registro en tu web mediante un script

Si tienes un popup o landing en el cual pides datos a tus usuarios para que se registren al newsletter o a alguna promocion, es posible enviar este usuario a Woowup mediante un llamado simple de AJAX.

Es necesario tener la Clave Pública de tu programa en Woowup. La puedes conseguir con rol de Super-Admin en la parte de configuración.

Ejemplo jQuery

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>My Ecommerce</title>
	<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
	<script>
		var settings = {
			"async": true,
			"crossDomain": true,
			"url": "https://events.woowup.com/events/users",
			"type": "POST",
			"headers": {
				"cache-control": "no-cache",
				"content-type": "application/json"
			},
			"data": JSON.stringify({
				"app": "CLAVE_PUBLICA_WOOWUP",
				"service_uid": "9988776655",
				"document": "1122334455",
				"email": "john@doe.com",
				"tags": "ecommerce,newsletter",
				"birthdate": "1989-06-22",
				"telephone": "+549116655443322",
				"gender": "M",
				"first_name": "John",
				"last_name": "Doe",
				"custom_attributes": {
	                "one_attribute": "one value",
		            "other_attribute": "other value",
	            }
			})
		}

		$.ajax(settings).done(function (response) {
			console.log(response);
		}).fail(function (error){ 
		        console.log(JSON.stringify(error)) 
		});
	</script>
</head>
<body>
</body>
</html>

En el caso de los Custom_attributes tipo FECHA deben ir en formato AAAA-MM-DD

Parámetros disponibles para enviar

POST https://api.woowup.com/apiv3/users

Request Body

POST https://api.woowup.com/apiv3/users

Request Body

HTTP Response Codes

Ejemplo funcional jQuery 2.2.4

El código "app": "XXXXXX" lo conseguís dentro de Configuración > Claves para desarrolladores. Es necesario tener permiso de super admin para ver las claves.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script
  src="https://code.jquery.com/jquery-2.2.4.min.js"
  crossorigin="anonymous"></script>
</head>
<body>
  <form action="">
    <table>
      <tr>
        <td>Email:</td>
        <td><input type="text" name="email"/></td>
      </tr>
      <tr>
        <td>Nombre:</td>
        <td><input type="text" name="first_name"/></td>
      </tr>
      <tr>
        <td>Apellido:</td>
        <td><input type="text" name="last_name"/></td>
      </tr>
      <tr>
        <td>Como nos encontraste?:</td>
        <td>
          <select name="source">
              <option value="recomendacion">Recomendación</option>
              <option value="via_publica">Publicidad vía pública</option>
              <option value="internet">Publicidad Internet</option>
          </select>
        </td>
      </tr>
      <tr><td colspan=2><button type="button" id="sent">Enviar</button></td></tr>
    </table>
  </form>
  <script>
    $(document).ready(function(){
      $("#sent").click(function(){
        var settings = {
              "async": true,
              "crossDomain": true,
              "url": "https://events.woowup.com/events/users",
              "type": "POST",
              "headers": {
                "cache-control": "no-cache",
                "content-type": "application/json"
              },
              "data": JSON.stringify({
              "app": "CLAVE_PUBLICA_WOOWUP",
              "email": $('input[name=email]').val(),
              "tags": "ecommerce,facebook,pantalon,popup",
              "first_name": $('input[name=first_name]').val(),
              "last_name": $('input[name=last_name]').val(),
              "custom_attributes": {
	                "source": $( "select[name=source]" ).val()
	            }
            })
        }

        $.ajax(settings).done(function (response) {
          console.log(response);
        });
      });

    });
  </script>
</body>
</html>

Last updated