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

# Signup Form

> Signup form overview.

<Warning>
  This method of Signup is only for [Legacy Softr Apps](/application-settings/n3K2UEfpC9BpHgakMzUU5Y/migrating-app-versions/4ASdHE4RECmauL82yzcVam). For the new Signup blocks and method for authentication, see the articles on [User Authentication](/core-concepts-overview/c5VwEbsWtTfPyUZjmEKvfx/user-authentication/7gJmq6B7syYE3hRoFxLs5J), [Utility Blocks](/application-settings/n3K2UEfpC9BpHgakMzUU5Y/utility-pages/49UoDpTpTPbkoKVwksoqfh), and the [Signup](/building-blocks/vikC2AWEpQGkZd4jGyoVxo/signup/54HYs3JEjYZA33S96fP3de) utility page.
</Warning>

## Logo, Title, and Background Image

Under the Features tab of block settings, you can add a logo to the block, change the title, as well as set a background image for the whole block.

<Frame>
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image1.png?fit=max&auto=format&n=VxMjh5thxtybPdCf&q=85&s=c0f595f2f48e61c7be77df13af2e819c" alt="Notion image" width="746" height="946" data-path="add-and-manage-users/images/signup-form/image1.png" />
</Frame>

## Signup Form

### **Sign up with Google**

If you enable this option, a **Sign up with Google** button will be added to the form, allowing your users to sign up with their Google Accounts.

<Frame caption="Signup with Google">
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image2.png?fit=max&auto=format&n=VxMjh5thxtybPdCf&q=85&s=3381d3b1759fa6d263ed0eea095be32a" alt="Signup with Google" width="1422" height="974" data-path="add-and-manage-users/images/signup-form/image2.png" />
</Frame>

<Tip>To enable Google Signup, you first need to add your Google APP Client details in **Integrations => Google Sign In**. You can find instructions on getting the **Client ID** and **Client Secret** [here](/integrations/etS18kJqm1fuD58KCsjC3z/google-sign-in/2hBabh9UqoE8W7aWrfPVFd).</Tip>

### **Domain-based signup**

Here, you can allow users to sign up only from specified domains. To do so, you need to add these domains inside the **Allowed domains** field. For instance, if you want only people with "softr.io" domains (e.g. [john@softr.io](mailto:john@softr.io)) to sign up, you need to enter "softr.io" into **Allowed domains** and hit **Enter** (see below). You can add as many domains as needed.

<Frame caption="Adding allowed domains">
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image3.png?fit=max&auto=format&n=VxMjh5thxtybPdCf&q=85&s=6181fb3185cb04ae7de54b04bbf68565" alt="Adding allowed domains" width="898" height="368" data-path="add-and-manage-users/images/signup-form/image3.png" />
</Frame>

## Form fields

### **Default Fields**

By default, you have three fields: **Name**, **Email**, and **Password,** where the **Name** field can be enabled or disabled. The placeholder texts of these fields can be modified as well. However, it's also possible to add any number of additional fields after connecting an Airtable users base, which we'll discuss next.

### **Adding Custom Fields**

You also have the option of customizing the Signup block by adding more fields. The values of additional fields will be stored in your [data source](/4230abecf813402aa2926466c313290a), therefore you need to have [a data source connected](/add-and-manage-users/pxnkp9H3qyEVMF6XUceqnj/syncing-users-with-a-data-source/hshRGygHr4T33EnaLntGf9) in the **Users** section. If you haven't connected a users base data source yet, you'll see a **Create Data Source** option under the **Signup Form** section in the **Features** tab.

<Frame caption="Create Data Source option">
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image4.png?fit=max&auto=format&n=VxMjh5thxtybPdCf&q=85&s=3abd456992ca99b7592d17b982d4286f" alt="Create Data Source option" width="844" height="852" data-path="add-and-manage-users/images/signup-form/image4.png" />
</Frame>

After clicking the **Create** button, you'll need to follow the process described [here](/integrations/etS18kJqm1fuD58KCsjC3z/google-sign-in/2hBabh9UqoE8W7aWrfPVFd) to connect a data source where user data will be synced. Further on, in your database, you can define additional fields to store extra user parameters and add those to the **Signup** form as well. Let's consider a specific example to give you a better idea of how this works.

Let's connect an Airtable users base, where we have added an additional **Position** field that indicates the position of the registered employee within the company.

<Frame caption="Users base with additional parameter">
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image5.png?fit=max&auto=format&n=VxMjh5thxtybPdCf&q=85&s=4e3d1b5f8e85e78d1e8ae5ac5df0b2f1" alt="Users base with additional parameter" width="1770" height="1304" data-path="add-and-manage-users/images/signup-form/image5.png" />
</Frame>

Now, we can add a position field to our Signup form and link it to this field on Airtable as done below.

<Frame caption="Additional Position field">
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image6.png?fit=max&auto=format&n=VxMjh5thxtybPdCf&q=85&s=c5ea72324ecfdf0085967a1be59b078a" alt="Additional Position field" width="918" height="954" data-path="add-and-manage-users/images/signup-form/image6.png" />
</Frame>

As a result, the users can now select a **Position** on signup, and it will be stored in the connected Airtable base as shown below.

<Frame caption="Additional Signup field stored on Airtable">
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image7.gif?s=276ba4bd69bc3cfa4264084337f2386c" alt="Additional Signup field stored on Airtable" width="2880" height="1414" data-path="add-and-manage-users/images/signup-form/image7.gif" />
</Frame>

### **Sign Up Button**

Lastly, there's the **Sign Up** button. The button **Text** can be changed, while the **Action** is predefined and can't be modified.

## Terms and Conditions

Here, you can choose if you want to display a **Terms & Conditions** checkbox on the form, so that the users have to accept it before proceeding with the registration. If the checkbox is enabled, there are two fields for linking **Terms** and **Privacy Policy** pages.

## Show Sign In

Choose whether you want to show a sign-in button (takes the user to the sign-in page) or not.

## On Sign up

Lastly, we need to set what page the user should be taken to after successfully signing up.

<Frame caption="Configuring page after signup">
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image8.png?fit=max&auto=format&n=VxMjh5thxtybPdCf&q=85&s=466cec6063946627bc460482227848a9" alt="Configuring page after signup" width="918" height="432" data-path="add-and-manage-users/images/signup-form/image8.png" />
</Frame>

## **Enable reCaptcha**

<Frame caption="Enabling reCaptcha on Sign Up form">
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image9.png?fit=max&auto=format&n=VxMjh5thxtybPdCf&q=85&s=8e1bde71e64d3563331d73d57a62d8dc" alt="Enabling reCaptcha on Sign Up form" width="858" height="534" data-path="add-and-manage-users/images/signup-form/image9.png" />
</Frame>

By adding reCaptcha authentication to your sign up form, you'll protect it from getting spammed or misused.

<Tip>Please, note that Softr only supports [reCaptcha v3](https://developers.google.com/recaptcha/docs/versions).</Tip>

To set up reCaptcha, you need to go to [https://www.google.com/recaptcha/admin/create](https://www.google.com/recaptcha/admin/create)
and enter your site details as shown below.

<Frame caption="reCaptcha setup">
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image10.png?fit=max&auto=format&n=VxMjh5thxtybPdCf&q=85&s=d2fa56359a764f7dadf8677e39fd3217" alt="reCaptcha setup" width="1748" height="1768" data-path="add-and-manage-users/images/signup-form/image10.png" />
</Frame>

In the next screen, you just need to copy the **Site Key** and **Secret Key.**

<Frame caption="Getting Site Key and Secret Key">
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image11.png?fit=max&auto=format&n=VxMjh5thxtybPdCf&q=85&s=7ed5d40bc9ed106939369bb14a10532e" alt="Getting Site Key and Secret Key" width="2030" height="1386" data-path="add-and-manage-users/images/signup-form/image11.png" />
</Frame>

To finalize the setup, paste the Site Key and Secret Key in your Softr app's **Settings => Integrations => Google reCaptcha.**

<Frame caption="Adding reCaptcha keys">
  <img src="https://mintcdn.com/softr-2b8a27e1/VxMjh5thxtybPdCf/add-and-manage-users/images/signup-form/image12.png?fit=max&auto=format&n=VxMjh5thxtybPdCf&q=85&s=7822cc83070819ad31ecc77f7cd180bb" alt="Adding reCaptcha keys" width="938" height="1008" data-path="add-and-manage-users/images/signup-form/image12.png" />
</Frame>

## Block visibility

The block is visible to all visitors of the app, and you have no control over its visibility, hence the default visibility setting is set to "Non-logged in users”.
