> ## Documentation Index
> Fetch the complete documentation index at: https://docs.surveyowl.co/llms.txt
> Use this file to discover all available pages before exploring further.

# WordPress

> Add an Endpoint form to a WordPress page with a Custom HTML block.

## 1. Copy your Public Key

In the dashboard, open your Endpoint form, go to **General**, and copy the Public Key from the **Form endpoint URL**.

## 2. Add the embed code

Copy this code and replace `YOUR_FORM_PUBLIC_KEY` with your Public Key:

```html theme={null}
<form id="surveyowl-form">
  <label for="so-name">Name</label>
  <input id="so-name" name="name" required />

  <label for="so-email">Email</label>
  <input id="so-email" name="email" type="email" required />

  <label for="so-message">Message</label>
  <textarea id="so-message" name="message" rows="5" required></textarea>

  <button type="submit">Send message</button>
  <p id="surveyowl-status" role="status"></p>
</form>

<style>
  #surveyowl-form { max-width: 480px; font-family: inherit; }
  #surveyowl-form label { display: block; margin: 0 0 4px; }
  #surveyowl-form input,
  #surveyowl-form textarea { display: block; width: 100%; box-sizing: border-box; margin: 0 0 14px; padding: 8px; font: inherit; }
</style>

<script>
  (function () {
    var form = document.getElementById('surveyowl-form');
    var status = document.getElementById('surveyowl-status');
    var button = form.querySelector('button[type="submit"]');

    form.addEventListener('submit', function (event) {
      event.preventDefault();
      button.disabled = true;
      status.textContent = 'Sending…';

      fetch('https://api.surveyowl.co/v1/submit/YOUR_FORM_PUBLIC_KEY', {
        method: 'POST',
        body: new FormData(form)
      })
        .then(function (response) {
          return response.json().then(function (result) {
            if (!response.ok) {
              var message = typeof result.error === 'string' ? result.error : result.error && result.error.message;
              throw new Error(message || 'Could not send the form.');
            }
          });
        })
        .then(function () {
          form.reset();
          status.textContent = 'Thanks — your message was sent.';
        })
        .catch(function (error) {
          status.textContent = error.message;
        })
        .then(function () {
          button.disabled = false;
        });
    });
  })();
</script>
```

## 3. Paste it into WordPress

1. Edit the page or post in the block editor.
2. Select **+** and add a **Custom HTML** block.
3. Paste the code into the block.
4. Select **Update** or **Publish**.

## 4. Test it

Open the live page—not just the editor preview—send a test message, and check **Submissions** in the dashboard.

## Good to know

* If the form appears but nothing happens when you press the button, the `<script>` may have been removed. WordPress only keeps scripts for users who are allowed to post unfiltered HTML, and some security plugins strip them too. Try an administrator account.
* Caching or optimization plugins sometimes delay or rewrite inline scripts. If the button stays inactive, clear the cache or exclude the page from script optimization.
* Style the form in the `<style>` block, or with your theme's Additional CSS.
* With [domain restriction](/developer-api/submit-a-response#domain-restriction) on, add your site's domain.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.