How to Add & edit Fields?
General settings
Title
Title is the heading of the contact form, you can change it to fit your form purpose.

Description
Description is a small paragraph under Title. You can use it to present the introduction or purpose of contact form.

Fields

In fields list, you can quickly change the order by drag-n-drop action.
For specific settings, click the pen-icon button to edit each field.

We offer Default fields and Custom fields which are suitable for multiple purposes.
Default fields: basic fields required for a form, including Name, Email address, Subject, Message.
Custom fields: advanced fields for further purposes, for example: checkbox, radio...
Field settings
Field name
The field name only shows up in submission email, it's different from Field label - which shows up on form interface.
Field name is not available to change in Default fields (Name, Email, Subject, Message)

Field label/placeholder
Field label/placeholder are presented in forms and viewed by customers.
You can switch between Label (show up out of field) or Placeholder (show up inside field) in Style > Fields style.
Field types

Contact Information Fields
Your Name: Allows users to enter their name (Mandatory)
Your Email: Collects the user’s email address (Mandatory)

Subject: A short field for users to input a topic or subject line.
Message: A multi-line text area for users to type messages or inquiries.
Short Text: A single-line text input for brief responses.
Custom Email: Lets users enter a different email (e.g., for alternative contacts).
Paragraph: A larger text box for detailed responses.
Select Fields
These fields allow users to choose from a set of predefined options:
Dropdown List: Users can select a single option from a drop-down menu.

Radio Buttons: Users choose one option from multiple choices.

Checkboxes: Users can select multiple options.

Image Choice (Paid Feature): Allows users to select an image as an option.
Static Text Fields
These fields display information without user input:
Text Heading: A bold heading to categorize sections.
Text Block: Displays informative text within the form.
Divider: Adds a visual separator between sections.
Custom HTML: Allows you to embed custom HTML code.
Input Fields
These fields collect structured input from users:
Terms Checkbox: A mandatory checkbox for users to agree to terms before submitting.
DateTime Picker: Allows users to select a date and time.
Number: Restricts input to numerical values only.
Repeater: Lets users add multiple entries dynamically.
File Upload (Paid Feature): Allows users to upload up to 3 files.
Shopify Customer Sync Fields
These fields automatically sync with Shopify customer data:
Address: Collects the user's address.
Apartment, Suite, etc.: Additional address field for more details.
Phone: Collects the user’s phone number.
Country (Unavailable): Collect customer country.
City: Collects the user’s city.
Zip Code / Postal Code: Collects the postal code for the address.
Input options
Type your options name. Use "Enter" to separate each option.
Take the image below for example.

In case you want to have a default option (pre-selected option), type that option name.

Required field
You can choose a field to be "required". It means that customers have to fill out that field with right values to be able to submit form.

Conditional field

Enable the Conditional Field
Check the "Conditional field" box to activate the feature.
Select the Parent Field
Click on the dropdown under "Only show element if..."
Choose the parent field that will control the visibility of this element.
Set the Condition
In the "is" field, enter the value that the parent field must match for this element to be displayed.
Extra classname
This option is individually styling purpose, required coding experience.
Style
Field width
This indicates how much space each field will makes up for in a row.

If there're 2 fields with Half width next to each other, they will align to one row.

Radio/checkbox alignment
Horizontal: show options in horizontal order

Vertical: show options in vertical order

In Bubble layout, we recommend you choose Horizontal alignment if there are too many options.
Submit button
Edit the text of submit button

Success message
After customers send form successfully, the browser will automatically refresh and a thank you message appears above the contact form tab.


Updated on: 21/02/2025
Thank you!