# 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.&#x20;

{% hint style="warning" %}
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.
{% endhint %}

### Ejemplo jQuery

```markup
<!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>
```

{% hint style="warning" %}
En el caso de los Custom\_attributes tipo **FECHA** deben ir en formato AAAA-MM-DD
{% endhint %}

### Parámetros disponibles para enviar

| Parameter                | Required |                                                                      |
| ------------------------ | -------- | -------------------------------------------------------------------- |
| app                      | yes      | Account identificator                                                |
| service\_uid             | No       | Customer's identificator                                             |
| email                    | No       | Customer's email                                                     |
| telephone                | No       | Customer's telephone                                                 |
| tags                     | No       | Comma separated tags                                                 |
| birthdate                | No       | Customer's birthday Format: YYYY-MM-DD                               |
| gender                   | No       | Customer's gender. Must be "F" or "M"                                |
| first\_name              | No       | Customer's first name                                                |
| last\_name               | No       | Customer's last name                                                 |
| mailing\_enabled         | No       | The user can or can't receive emails. Values: "enabled", "disabled". |
| mailing\_enabled\_reason | No       | Reason why the user can't receive emails.                            |
| sms\_enabled             | No       | The user can or can't receive SMS. Values: "enabled", "disabled".    |
| sms\_enabled\_reason     | No       | Reason why the user can't receive SMS.                               |

<mark style="color:green;">`POST`</mark> `https://api.woowup.com/apiv3/users`

#### Request Body

| Name             | Type   | Description                                                                     |
| ---------------- | ------ | ------------------------------------------------------------------------------- |
| mailing\_enabled | string | <p>The user can or can't receive emails. <br>Values: "enabled", "disabled".</p> |

{% tabs %}
{% tab title="200 " %}

```
```

{% endtab %}
{% endtabs %}

<mark style="color:green;">`POST`</mark> `https://api.woowup.com/apiv3/users`

#### Request Body

| Name             | Type   | Description                                                                     |
| ---------------- | ------ | ------------------------------------------------------------------------------- |
| mailing\_enabled | string | <p>The user can or can't receive emails. <br>Values: "enabled", "disabled".</p> |

{% tabs %}
{% tab title="200 " %}

```
```

{% endtab %}
{% endtabs %}

### HTTP Response Codes

| HTTP Code | Name        | Description           |
| --------- | ----------- | --------------------- |
| 200       | Ok          | Everything is ok      |
| 400       | Bad Request | Invalid parameters    |
| 403       | forbidden   | Account doesn't exist |

### Ejemplo funcional jQuery 2.2.4

{% hint style="info" %}
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.
{% endhint %}

```markup
<!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>
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://woowup-docs.gitbook.io/woowup-developer-docs/formularios-web/add-customers-from-newsletter.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
