Customizable Contact Forms are a great way to generate new leads and expand your contact list.
MessageDesk makes it quick and easy to create high-quality forms.
If you haven't made a form yet, go check out our Contact Forms Overview and come back when you are ready to customize.
Step 1: Form Fields
Within the Form Fields tab, you have 4 different categories to customize.
Contact Fields
Contact Fields allow you to choose what information you want to obtain from the recipient.
To make changes to fields, click on the drop-down arrow on the desired field. You have the ability to choose from some of the following options: Default Phone, Title, Middle Name, Full Name, Company, Email, Shipping Address, Billing Address, and more (including any custom fields you make).
Label
The label is the text that is prepopulated in the forms. This text prompts customers on what information to input into a particular field.
It is defaulted to the Contact Field that you insert initially. When I chose the "Last Name" Contact Field, the Label will be Last Name as a default.
To edit labels, delete the pre-populated text and type in a new label.
Field Types
A Field Type is the type of input that will allow the individual to complete that step of the form.
Most of these will be a standard text field that allows individuals to type in their information. However, some field types that may be used with a Custom Field include Text, Date, Phone, or a Dropdown.
When creating a new custom field, you will be prompted to select what type of field you want to use.
You can create a Custom Field directly from your form by clicking the "Create new field" button.
Required
The required column allows you to decide whether or not the specific field on the form is mandatory.
Clicking the checkmark means that the recipient must fill out the information in order to submit the form.
Step 2: Form Styling
The form styling tab allows you to customize the appearance of your forms.
Background
The background tab allows you to either set the background color or select a background image.
The form will default with a background color of white.
Clicking the circle under "Background Color" opens up a full spectrum of colors to choose from. In the color selector, you can type in a hex code, or switch to RGB or HSL with the double arrows to the right of the text box.
Clicking the "Select background image" button allows you to drag and drop, or select a file directly from your computer.
Form Page
The Form Page allows you to change the title, image, inputs, and button on your form.
Title:
In the Title section, all of the things you can edit will affect this part of your form:
You can edit the text of the title, the size of the text, the spacing of the letters, and the actual text color.
Image
With the image section, you can change the default image that appears on your form. The default image appears as this when you first open your form:
You can change it by clicking on "Select image."
Inputs
To apply inputs to your form, check the boxes of desired inputs. You can apply multiple inputs at once and they will change the way the inputs of your forms look.
Dark Input: The dark input option turns the text within the input fields white. This is useful when using a dark background color.
Dense Input: The dense input option condenses the input fields.
Filled Input: The filled input option expands the input fields.
Outlined Input: The outlined input option expands and outlines the input fields.
Rounded Input: The rounded input option rounds the corners of the input fields.
Shaped Input: The shaped input option changes the shape of the input fields.
Input Options
Columns: Adjusting the number of columns will divide your inputs among the number of columns you select. The default number of columns is 1, the image below depicts the number of columns as 2.
Width: Adjusts the width of the form fields.
Height: Adjusts the height of the form fields.
Position: Adjusts the position of the form fields.
Background Color: Changes the color that is displayed inside of the form fields.
Control Color: Changes the color that outlines the form fields when clicked on.
Button
The button option allows you to customize the button that appears at the bottom of your form.
To edit the text within the button, type your own text in the text box
To edit the border radius, click the drop-down arrow next to "border radius" and select an option.
Click the circle under "Button Color" to change the color of the button.
Click the circle under "Text Color" to change the color of the text inside the button.
Success Page
The Success Page is the last thing the individual filling out your form will see. To edit the page, you can change the title, the image that is displayed, and the subtitle.
Title:
Editing the title is very similar to the previous sections in this article.
To change the Title text from "Success", type your own title in the text box
The size of the text can be edited with the "Size" dropdown.
The spacing of the letters can be edited with the "Spacing" dropdown.
The color of the text can be changed with the "Text Color" selector.
Image:
You may want to change the default image that is displayed on the success page (shown below).
To change the image, click the "Select Image" button.
Subtitle:
The default message in the subtitle is "Thank you for updating your information."
To change the Title text from "Thank you for updating your information", type your own title in the text box
The size of the text can be edited with the "Size" dropdown.
The spacing of the letters can be edited with the "Spacing" dropdown.
The color of the text can be changed with the "Text Color" selector.
Step 3: Form Messages
The messages that will get sent depend entirely on the form you are looking at.
A form is automatically generated when you first start your account which is the Anonymous Contact Form.
This automatically sends a form to someone who texts you when they are not in your contacts. For this form, there is a message that is sent to the person prompting them to fill out the form and a thank you message.
For all other forms, there will only be a "Thank You Message."
You can edit these messages in their message compose boxes. They can have all of the same features of a regular message sent from the inbox such as tags, emojis, pictures (MMS), etc.
Step 4: Share Form
To share your form, simply use the clipboard icon on the right side of the link to copy it. Once you have the link copied, you can paste it anywhere you want.
To embed the form on your website, use the "Embed Form on Website" link, and paste the link where you want it on your website.
