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

# Form / survey builder

> Shared builder features for forms and surveys in the Hoop platform — embed codes, sticky contact, advanced elements, and more.

The Form / Survey Builder section covers shared capabilities that apply to both forms and surveys across the Hoop platform. This includes embed options, reusable elements, advanced field types, and integrations available in both builders.

<Frame caption="Form and survey builder — shared embed, sticky contact, and advanced field options">
  <img src="https://mintcdn.com/hoopai-84ec0cdc/WAml1mOrQ-Qs9CGD/images/sites-funnels-steps-1.png?fit=max&auto=format&n=WAml1mOrQ-Qs9CGD&q=85&s=4a19af14f4e8d81741493d340e618c79" alt="Form survey builder" width="1134" height="444" data-path="images/sites-funnels-steps-1.png" />
</Frame>

## Getting the embed code

To embed a form or survey on an external website or a page outside the builder:

<Steps>
  <Step title="Open the form or survey">
    Navigate to **Sites > Forms** or **Sites > Surveys** and click on the form or survey name to open it.
  </Step>

  <Step title="Click Integrate">
    Click the **Integrate** button in the top-right corner of the builder.
  </Step>

  <Step title="Copy the embed code">
    For **surveys**, click the copy icon to copy the iframe embed code.

    For **forms**, choose the embed layout type (Sticky Sidebar, Slide-In, Popup, or Inline), set trigger and activation options, then click **Copy embed code**.
  </Step>

  <Step title="Paste into your page">
    Paste the code into your website or page builder's HTML/custom code section.
  </Step>
</Steps>

<Frame caption="Form embed options — choose Sticky Sidebar, Slide-In, Popup, or Inline layout with trigger settings">
  <img src="https://mintlify.s3.us-west-1.amazonaws.com/hoopai-84ec0cdc/images/sites-forms-overview-1.png" alt="Form embed options" />
</Frame>

***

## Advanced shared elements

<AccordionGroup>
  <Accordion title="Signature element">
    Add a signature field to a form or survey for e-signature capture. Useful for consent forms, service agreements, and onboarding documents.
  </Accordion>

  <Accordion title="File upload element">
    Allow respondents to upload files directly in the form or survey. Useful for collecting portfolios, documents, or images. Uploaded files are stored in the contact's record.
  </Accordion>

  <Accordion title="Terms and conditions element">
    Add a checkbox with a custom terms and conditions message. The respondent must accept the terms before submitting. Required for compliance when collecting sensitive data.
  </Accordion>

  <Accordion title="Image element">
    Insert an image into the form or survey canvas. Use this to add logos, product photos, or instruction graphics between fields.
  </Accordion>

  <Accordion title="Score element">
    Add a scoring field that assigns a numeric value based on the respondent's answer. Scores accumulate across multiple score elements and can be used to segment or qualify contacts.
  </Accordion>

  <Accordion title="Rating element">
    Add a star or emoji rating scale. Commonly used for customer satisfaction surveys and NPS-style questions.
  </Accordion>

  <Accordion title="Address element">
    Add a structured address field with sub-fields for street, city, state, ZIP, and country. Maps directly to the contact's address record.
  </Accordion>

  <Accordion title="Text element">
    Add static descriptive text to the form or survey canvas — used for instructions, section headers, or introductory copy between questions.
  </Accordion>
</AccordionGroup>

***

## Advanced tab settings

Inside any form or survey, the **Advanced** tab controls:

* **Label and placeholder text** for each field
* **Border and styling** for individual form components
* **Required field** toggle — mark fields as mandatory before submission
* **Hidden fields** — pre-populate fields silently using URL parameters

***

## Sticky contact

The **Sticky Contact** feature pre-fills form and survey fields for returning visitors using browser cookies. When a known visitor opens a form, their previously entered information is automatically filled in.

**To enable sticky contact:**

1. Open the form or survey builder.
2. Switch to the **Settings** tab.
3. Toggle **Sticky Contact** on.
4. Click **Save**.

<Warning>
  Sticky Contact uses browser cookies. Team members entering data for different contacts should use incognito mode or clear their browser cookies between entries to prevent overwriting one contact's data with another's.
</Warning>

<Frame caption="Sticky contact — pre-fills returning visitor data using browser cookies for faster form completion">
  <img src="https://mintlify.s3.us-west-1.amazonaws.com/hoopai-84ec0cdc/images/sites-forms-analytics-1.png" alt="Sticky contact setting" />
</Frame>

***

## Integrating payments

Both forms and surveys support payment collection:

1. Add a **Products** element to the form or survey canvas.
2. Select the products to offer at submission.
3. The checkout step is presented at form submission using your connected payment integration.

Supports one-time purchases, subscriptions, and recurring donations.

***

## Organizing with folders

Create folders in **Forms** or **Surveys** to group related assets:

1. Click **Create Folder** and give it a name.
2. Drag forms or surveys into the folder, or use the **Move to Folder** option in the three-dot Actions menu.

<Note>
  Deleting a folder permanently deletes all forms or surveys inside it. Move items out of a folder before deleting the folder if you need to retain them.
</Note>

<Tip>
  Use the **Version History** feature in the form or survey builder to review previous saved versions and restore an earlier state if a recent edit caused unexpected behavior.
</Tip>