Forms

How to create a form

September 15, 2026
How to create a form

In TeleportHQ, you create a form by adding a Form element to a page, then adding fields with + Add elements in the right panel. Pick ready-made fields such as Name, Email, Phone and Submit button, or start from a ready-made Contact Form, Sign Up or Sign In section. When your site is published on TeleportHQ hosting, every submission is saved in Growth → Forms, and TeleportHQ emails the workspace owner about each one.

Before you start

  • A form keeps your project a website. Adding a form, its fields and its settings doesn't turn a TeleportHQ website into a web app. Only a workflow attached to the form does, for example one that saves submissions to a database. See What's the difference between a website and a web app?
  • TeleportHQ forms work on TeleportHQ hosting. They accept submissions from your project's address ending in .teleporthq.app or .teleporthq.site, and from the custom domain connected to the project. On a site hosted anywhere else, such as your own Vercel account or downloaded code, submissions are refused with "Domain not allowed" and nothing is saved. See Why is my form not working?
  • Your plan sets how many forms the workspace can have. Each new form counts as soon as you add it. See How many forms and submissions can I have?

Steps

1. Add a form

Pick one of these ways:

  • From the Elements panel. In the left sidebar, click Elements, open the Primitives tab, and click Form in the Forms group. A form with Name and Email fields and a Submit button is added to the page you're on.

    The Forms group of the TeleportHQ Primitives tab, with the Form card highlighted

  • From a ready-made section. In Elements, open the Sections tab and click Contact Form, Sign Up or Sign In in the list of categories.

    The categories of the TeleportHQ Sections tab, with Contact Form highlighted

    Click a design, for example Enquiry beside details, to add it to the page. See How to add ready-made sections.

    The Contact Form designs in the TeleportHQ Sections tab, with Enquiry beside details highlighted
  • With AI. Ask the AI Assistant, for example "Add a booking request form with name, email, phone and preferred date".

TeleportHQ names the form after its page or component, for example Homepage Form, and lists it in Growth → Forms. You can rename it in the form's settings. See How to choose what happens after someone submits a form.

2. Add fields

  1. On the canvas, select the form, or any field inside it.

  2. In the right panel, in the form's card at the top, click + Add elements. You can also click + Add form elements under the selected form on the canvas. The Add form element window opens.

    The TeleportHQ right panel for a selected form, with the + Add elements button highlighted
  3. Click the field you need. For example, for a salon booking form, click Phone under contacts. The window closes and the field, with its label, input type and placeholder, appears in the form above the button.
  4. Repeat for each field, for example Date & time under dates and Long answer under general for a message.
The TeleportHQ Add form element window with its contacts, general, dates and buttons groups

The window's groups hold:

  • contacts: Name, First name, Last name, Email, Phone, Address, Company name, City, State/Province, Postal/ZIP code, Website and Social links (one field each for LinkedIn, GitHub, Facebook, Instagram, YouTube and a website).
  • general: Short answer, Long answer, Number, Link, Dropdown and Checkbox.
  • dates: Date picker and Date & time.
  • buttons: Submit button.

3. Style and publish

  1. Select any label, field or the button and style it in the right panel, like other elements.
  2. At the top right, click Publish and publish your site. See How to publish your site.

Check that it worked

  1. Open your published site and submit the form with test data, for example test@example.com.
  2. In the editor's left sidebar, click Growth (the last button, under Live).
  3. Under Forms, click Form submissions. Ctrl+5 (Cmd+5 on a Mac) opens it in one go. Your forms are listed under Your forms, for example Homepage Form with "Homepage · 1 submission".
  4. Click the form. Its submissions, with your test entry, are listed beside the list. See How to see and export form submissions.

Troubleshooting

"This project has reached its limit of 10 forms." The project already has as many forms as its plan allows, so TeleportHQ doesn't add the form or the form section. A window titled This feature is not available on your current plan says "This project has reached its limit of 10 forms. Upgrade to add more." and offers Upgrade Now. Delete a form you don't use, or get more forms. See How many forms and submissions can I have?

The Manage button is missing when I select the form The form doesn't store its submissions in TeleportHQ: its Form Submissions switch is off, or a workflow handles the submission. See Why is my form not working?

Submissions don't arrive See Why is my form not working?

Good to know

  • Sign Up and Sign In sections collect an email address, like any other form. Their submissions go to Growth → Forms. They don't create accounts or sign anyone in. The sign-in and checkout forms that the user accounts and store features build aren't listed there, and neither are forms that hand their submissions to a workflow. For real visitor accounts, see How to add sign-up and login to your site.
  • Fields must be inside the Form element. A field or button placed outside the form isn't sent with it.
  • Spam protection. A form added from the Primitives tab comes with a hidden spam-trap field. Forms from sections or the AI Assistant may not: check Hidden spam-trap field in the form's settings. See How to protect forms from spam (reCAPTCHA).
  • To make a field required, or to check what visitors type, see How to check what visitors type in a form field.
  • To preview the success or error look while designing, select the form and use Form UI State in the right panel. It doesn't change your live site.
  • To do more on submit, such as saving to a database or sending an SMS, attach a workflow with On Form Submit. A workflow makes the project a web app, and a window asks you to confirm first. See How to create a workflow.
Share

Related Articles

How to set up form fields (placeholders, required, types)

In TeleportHQ, you set up a form field by selecting it and opening the Attributes section in the right panel, where you change its placeholder text, make it required, choose its type (text, email, number, phone, date and more) and set its name, which becomes the field's column in your submissions.

How to check what visitors type in a form field

In TeleportHQ, open the form's Manage Form window (Growth → Forms → Settings), go to Field rules, pick a field, and set Required, a Format such as Email address, Phone number or Text length, a Pattern for your own format, and the Message when the value is refused; click Save and publish, and the visitor's browser checks the field before the form is sent.

How to choose what happens after someone submits a form

In TeleportHQ, you open a form's Manage Form window (Growth → Forms → Settings) and, on the Settings tab, choose what visitors see after submitting (an alert, a component, a page or a web address), who gets an email for each submission (up to 3 addresses, the workspace owner first), and when the form closes (an expiration date or a submission limit); click Save and publish.

How to see and export form submissions

In TeleportHQ, you see form submissions in Growth → Forms → Form submissions by picking a form in the Your forms list, where you search, open and edit entries, mark them as spam, move them to trash, download one as a PDF, or click Download submissions to export them as a CSV file.

How many forms and submissions can I have?

In TeleportHQ, the Trial and Pro plans include 10 forms and 2,000 form submissions per 30 days for the whole workspace, Premium has unlimited forms and submissions, every form counts as soon as it's added (ready-made form sections too), and on Trial and Pro you can buy more from Growth → Forms with Increase Limits.

How to add ready-made sections

In TeleportHQ, you add a ready-made section such as a hero, pricing table or FAQ from Elements → Sections by opening a category or searching and clicking a design; it lands as ordinary elements in your site's style, and Replace Section swaps any block of the page for another design.