# Sign-up form

### Section overview

The Sign-up form section provides a customizable interface for customers to create an account or log in to your store. It combines account authentication forms with optional content blocks for enhanced visual appeal.

#### Common Use Cases

* Account creation and login pages
* Customer registration with additional custom fields
* Membership signup forms with supplementary information display
* Password recovery interface

#### Usage Tips

* Customize the default form (login or signup) based on your primary goal for the page
* Use the content block to showcase membership benefits or important account information
* Add custom fields to collect additional customer information during signup
* Ensure form fields have clear labels and placeholders for better user experience
* For mobile, consider adjusting width settings to ensure forms remain readable on smaller screens

### Section Settings

| Setting              | Description                                                                   |
| -------------------- | ----------------------------------------------------------------------------- |
| Top spacing          | Controls the padding space above the section (0-300px)                        |
| Bottom spacing       | Controls the padding space below the section (0-300px)                        |
| Color scheme         | Sets the background and text color combination for the section                |
| Border color         | Determines the color of any borders in the section (subtle or strong)         |
| Button color         | Sets the style and color of buttons in the section                            |
| Border position      | Specifies where borders appear (none, top, bottom, or both)                   |
| Vertical alignment   | Controls how content blocks align vertically (top, middle, bottom)            |
| Horizontal alignment | Controls how content blocks align horizontally (left, center, right)          |
| Enable margin        | When enabled, applies horizontal margin to the section content                |
| Visibility           | Controls when the section is visible (all devices, mobile only, desktop only) |

### Block Settings

#### Form

This block provides the account creation, login, and password recovery forms that allow customers to authenticate with your store.

* Block limit: 1

| Setting        | Description                                                          |
| -------------- | -------------------------------------------------------------------- |
| Heading        | Title displayed above the form                                       |
| Content        | Text content displayed above the form                                |
| Default form   | Sets which form is initially displayed (login or signup)             |
| Width desktop  | Controls the width of the form on desktop devices (1-12 columns)     |
| Width mobile   | Controls the width of the form on mobile devices (1-12 columns)      |
| Text alignment | Sets the horizontal alignment of the form text (left, center, right) |

#### Content

This block provides additional visual content to supplement the signup forms, such as images, videos, or promotional text.

* Block limit: 1

| Setting              | Description                                                       |
| -------------------- | ----------------------------------------------------------------- |
| Heading              | Title displayed in the content area                               |
| Content              | Text content for the block                                        |
| Button label         | Text for the optional button                                      |
| Button URL           | Link destination for the button                                   |
| Image                | Primary image for the content block                               |
| Background image     | Secondary background image for the content block                  |
| Video                | Optional video file to display                                    |
| Enable autoplay      | When enabled, video will play automatically                       |
| Enable mute toggle   | When enabled, shows a button to toggle video sound                |
| Enable loop          | When enabled, video will play continuously                        |
| Minimum height       | Sets the minimum height for the content block (0-800px)           |
| Enable padding       | When enabled, adds padding to the content block                   |
| Color scheme         | Sets the background and text color combination for the block      |
| Text color           | Forces specific text color (default, light, or dark)              |
| Border color         | Sets the border style for the content block                       |
| Button color         | Sets the style and color for buttons in the block                 |
| Enable gradient      | When enabled, applies a gradient effect to the background         |
| Width desktop        | Controls the width of the block on desktop devices (1-12 columns) |
| Width mobile         | Controls the width of the block on mobile devices (1-12 columns)  |
| Vertical alignment   | Controls how content aligns vertically within the block           |
| Horizontal alignment | Controls how content aligns horizontally within the block         |
| Text position        | Sets whether text appears above or below media elements           |

#### Field

This block allows you to add custom fields to the signup form to collect additional customer information.

* Block limit: 50

| Setting           | Description                                                 |
| ----------------- | ----------------------------------------------------------- |
| Input label       | Label displayed for the custom field                        |
| Input placeholder | Placeholder text shown inside the input field               |
| Input type        | Type of input field (single line, multi-line, or checkbox)  |
| Required field    | When enabled, makes the field mandatory for form submission |


---

# 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://help.brickspacelab.com/keystone/sections/forms/sign-up-form.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.
