# Connect your contact form to Fullwhere

If you have a contact form on your website and want to connect it to Fullwhere so that submissions flow directly into the platform, you have 3 ways to do so :

* by [redirect](#connect-your-contact-form-by-redirect)
* by [API](#connect-your-contact-form-by-api)
* by [iframe](#connect-your-contact-form-by-iframe)

## Connect your contact form by redirect

This is a turnkey method. It is the simplest way to connect your contact form to Fullwhere.

With this method, the `Contact` button, or equivalent, on your website no longer points to your current form. It points to your Fullwhere form instead.

When users click the `Contact` button, or equivalent, they are redirected to your Fullwhere form, available at a URL like <https://form.fullwhere.com/fr/contact?id=XXX>.

To set up this connection, first create a contact form in your Fullwhere space.

Go to your Fullwhere interface, under the Fullwhere Capture > [Contact Forms section](https://app.fullwhere.com/forms/contact), to configure your contact form. This form will serve as a 'replica' of the contact form on your website.

If needed, you can find a step-by-step guide [here](/capture/formulaires-de-contact.md) on how to configure your contact form.

You can customize your contact form, including colors, logos, and typography, so it matches your brand.

Once your form is ready, use the configuration panel on the right to easily copy the form link and add it to the `Contact` button, or equivalent, on your website.

## Connect your contact form by API

### Overview

This method connects your form to Fullwhere through the public API.

It lets you keep the form already live on your website without changing its visual appearance. Only the backend submission flow changes.

The first step is to create a contact form in your Fullwhere workspace. This form acts as a replica of the form on your website, so you can map your existing fields to the Fullwhere structure.

Go to your Fullwhere interface, under the Fullwhere Capture > [Contact Forms section](https://app.fullwhere.com/forms/contact), to configure your contact form. This form will serve as a 'replica' of the contact form on your website.

If needed, you can find a step-by-step guide [here](/capture/formulaires-de-contact.md) on how to configure your contact form.

{% hint style="warning" %}
**You must configure your form to identically match the one on your website, allowing you to map your existing fields to Fullwhere fields to record submissions.**
{% endhint %}

### Connecting your form to Fullwhere using our public API

Once your Fullwhere form is created, retrieve its **ID** by previewing the form or directly from the editor. You will need this ID to complete the connection.

Next, use two public API calls:

\
\- the first retrieves your form structure

> **API Reference:** [`GET /public/contact-form`](/developer/api-references/public-endpoints.md#get-public-contact-form)

\
\- the second sends form submissions to Fullwhere

> **API Reference:** [`POST /public/contact-form/submit`](/developer/api-references/public-endpoints.md#post-public-contact-form-submit)

{% hint style="warning" %}
If your form contains a '**STORE**' field type, the form structure response will include a `storeList` object providing the name and ID for each location.
{% endhint %}

## Connect your contact form by iframe

An `iframe` is a web technology that lets you display external content directly inside a page on your own website.

In this case, it allows you to embed your Fullwhere contact form into your site so users can fill it out without being redirected to another page.

This approach helps you keep a seamless user experience while still relying on Fullwhere to host and manage the form.

To set up this connection, first create a contact form in your Fullwhere space.

Go to your Fullwhere interface, under the Fullwhere Capture > [Contact Forms section](https://app.fullwhere.com/forms/contact), to configure your contact form. This form will serve as a 'replica' of the contact form on your website.

If needed, you can find a step-by-step guide [here](/capture/formulaires-de-contact.md) on how to configure your contact form.

You can customize your contact form, including colors, logos, and typography, so it matches your brand.

*If necessary, you can use the iframe example below by replacing the UUID with your form's ID and the language.*

<pre class="language-html"><code class="lang-html">&#x3C;div style="width: 100%; max-width: 800px; margin: 0 auto;">
  &#x3C;iframe
    src="https://form.fullwhere.com/<a data-footnote-ref href="#user-content-fn-1">fr</a>/contact?id=<a data-footnote-ref href="#user-content-fn-2">f5c658ce-5419-4085-a198-a374ebd7a7ec</a>"
    width="100%"
    height="650px"
    style="border: none; border-radius: 8px; background-color: transparent;"
    title="Formulaire de contact"
    loading="lazy">
  &#x3C;/iframe>
&#x3C;/div>
</code></pre>

[^1]: Select the language in which to load your form

[^2]: Enter your form ID here


---

# 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://docs.fullwhere.com/developer/use-cases/connect-your-contact-form-to-fullwhere.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.
