There are four categories of field types in the form builder in our Customer Fields app. This article will cover the options available specifically within the Custom input fields section of the app's form builder. Custom fields allow you to collect virtually any type of information you desire from your customers. Please note that custom input fields are not available on the app's 'Lite' plan (see pricing details here), so be sure to upgrade to give these a whirl!
You can find the custom input fields section in the app's form builder by clicking on the icon shown in the screenshot below:
For the sake of this article, we're going to show how to use some custom input fields that gather information about a customer's dog. Of course this is just one example of a use case for custom fields, but hopefully it helps to provide some inspiration! 🐶
Read more below to find detailed descriptions for each custom input field
Purpose: This custom-input field allows you to provide a single-line text field for customers to type an answer into.
Example: For the field label, we have the question "What is your dog's name?" to prompt the customer to enter an answer.
Purpose: This custom-input field allows you to provide a text box suitable for lengthier responses from your customer.
Example: For the field label, we have the prompt "Tell us about your dog:". We put a couple of sentences in the placeholder to give the customer an example of what they could type into the field: "Fido is a 4 year old pug who loves to take long naps. His favorite treats are milkbones."
Purpose: This field makes it possible for the customer to enter a custom number in either integers or decimals, depending on which setting you select.
Example A: For the field label, we have the prompt "How old is your dog?". We have set the number type to "integer", which means the customer can enter any whole number. Our placeholder says "6" for an example.
Example B: In this example, we have the number type set to "decimal". Our field label has the prompt "How much does your dog weigh (pounds)?". The customer will be able to enter a decimal number such as 35.4, which is a number we put in the placeholder.
Purpose: This field is ideal for creating a list of options in a dropdown format for customers to choose from. If you have a lot of options for a field, this will be a neat and tidy way to store those options.
Example: For the field label, we have the prompt "Select your favorite dog breed".
Our example below shows just a few options for "Husky", "Poodle", "German Shepherd", and "Pug", but you can have up to 500 options for dropdown fields.
💪 Pro tip: if you have a large number of options, you can click the three dots and select "Import CSV" to import a list of field options in bulk! Learn more here.
Dropdown with search
Purpose: This field is a great way to have a large number of options available so that the customer can either scroll through the dropdown options or use the search tool to lookup an option.
Example: For the field label, we have the prompt "Select your dog's food brand".
Similar to the dropdown field, you can bulk import up to 500 field options via CSV. In addition, the dropdown with search field also includes a powerful feature that allows you to populate field options using a Google Sheet, which is great for cases where you have more than 500 options for a single field. Learn more here.
The dropdown with search field also includes some handy settings to control the search logic, along with a text customizable message for 'no search matches'.
Purpose: This field shows your list of options with radio buttons for the customer to choose from. This field is ideal when you only have a couple of options that you need the customer to choose one from, or just need to make a "yes or no" type of field.
Example A: In this example, we have "Select your dog's size" in the field label. We only have three options available for the customer to choose from (Small, Medium, or Large with the respective weight ranges).
Example B: When creating your radio choices field, you can either define your own list of options or you can use a number range. In this second example, our field label asks the question "How many dogs do you have?" and we're using a number range with a 'start' of
1 and an 'end' of
10, so the numbers 1 through 10 are available to choose from. Of course, you're welcome to edit the number range as you see fit (i.e. perhaps it makes more sense for your particular need to have a range of
Purpose: This field is a single checkbox perfect for things like "I agree to the Terms & Conditions" (click for a tutorial).
Example: In our example, our checkbox simply has the prompt "I own more than one dog.", which tells the customer to check the box if this statement applies to them.
Purpose: This field is great if you need your customer to be able to select multiple options at a time in cases where more than one value might apply. Each option will show up as individual checkboxes that the customer can select.
Example: In this example, our field label asks the question "What kind of pets do you have?" and there are multiple options available for the customer to choose (dog, cat, rabbit, fish, etc.).
Notice that we've used the description tool here! For fields like a multi-choice list, it can be useful to use the description tool if you want to add a note to make sure the customer knows they can or should select multiple choices; ours says "Select all that apply."
Purpose: This particular field is meant to collect a specific date from the customer filling out your form, most commonly their birthday. There are two formats for collecting a date: "Date picker" or "Dropdown fields"
Example: In our example, we're asking the question "How long have you been working?" We are using the "Dropdown fields" format so customers can select the appropriate Month, Day, and Year from the dropdown. You can customize the year range as needed, as it may make more sense to have a smaller or larger year range depending on the information you have to collect.
You'll also notice that our Date field will show an error message if the date has not been filled out completely.
Purpose: This field, as its name indicates, will allow the customer to upload a file (be it a photo or document). This is very useful for things like collecting permits or resumes.
Example: In this example, we're simply asking customers to upload a photo of their dog for their account.
There are several Error messages that will pop up to the customer if...
A) the file is too large, i.e. over 25MB.
B) the file doesn't have a valid file extension
C) the file is an executable file like a program or script (their file should be something non-executable like a document, photo, spreadsheet, etc.).
See the screenshot below for details:
Purpose: I know you might be wondering why there is an "email address" field available as a Custom input field! The reason for this is so you can collect one or more additional email addresses from your customers without it changing or otherwise affecting their Shopify account email. Our email address field also has a validation rule in place to make sure the customers can only input valid emails.
Purpose: Similar to the email address field, our phone number field is meant to collect additional phone numbers from your customer without changing/updating the main phone number they already have on their Shopify account. This field also has a validation rule in place so that only valid phone numbers can be entered by your customers.
Purpose: The group field is a super handy tool to group together fields on your form. This feature is particularly useful if you have several fields that you want to keep together, which makes the fields within a group easier to target when using custom CSS or a form rule.
Example: Let's say we've already collected standard info about our customer's dog (e.g. name, birthday, size, etc.), and now we want to collect information about the customer's other pets. In this example, we've added a group field to our form and we changed the group field label to "Other Pets Group Field". Within the form, we added a few fields to collect data about the customer's other pets and you can see several fields that we've already gone over in this article.
Repeating Group Fields
Purpose: Repeating group fields is a long-awaited feature now available in the Custom input fields section of the form builder. This is an easy way to collect multiple sets of related data from customers (i.e. multiple pets, students, businesses, etc.). Learn more about repeating group fields.
Questions, comments, or concerns?
Feel free to reach out to our support team via email or chat and we'll be happy to assist!