Sometimes you already have your user's information before they schedule with you. This could be because you've collected their information on your website or an external form before directing them to your Appointlet scheduling page. In these cases, it seems unnecessary to ask them to input information you already have, right?
This is where pre-filling form fields comes in handy. Pre-filling user information not only simplifies the scheduling process for your users, but it also reduces the chance of any input errors.
How Pre-filling Works
Pre-filling form fields works by adding specific form information into the query string of a scheduling page URL. This allows for certain fields on the page to be automatically populated when a user visits the link.
You can pre-fill the following fields using this method:
Attendee's First Name
Attendee's Last Name
Attendee's Email
Any custom intake form fields you've added
Pre-filling Built-in Form Fields (Name, Email, etc)
Pre-filling built-in fields is straightforward. The built-in fields available for pre-filling are first_name
, last_name
, and email
. You can append the values for these fields directly in the URL of your scheduling page like so:
https://appt.link/my-scheduling-page/my-meeting-type?first_name=Bob
This URL will pre-fill the name with "Bob". If you want to pre-fill more than one value, separate them with an &
like this:
https://appt.link/my-scheduling-page/my-meeting-type?first_name=Bob&last_name=Smith&email=bob.smith@example.com
This URL will pre-fill the "First Name" field with "Bob", the "Last Name" field with "Smith", and the "Email" field with "bob.smith@example.com".
As a best practice, you should URL-encode any values that are added to the URL. So instead of email=bob.smith@example.com
you should have email=bob.smith%40example.com
. This will ensure the entire value is pre-filled.
Important (Advanced): If you're collecting a user's information on an external page like your website and need to automate the redirect to the Appointlet scheduler, we recommend using an HTML form and Javascript to collect the form information and then URL encode it before redirecting to Appointlet.
Pre-filling Custom Form Fields
To pre-fill a custom form field, you'll use the API Identifier, also referred to as the slug, associated with the field. The structure of the URL should be:
https://appt.link/my-scheduling-page/my-meeting-type?field__API_IDENTIFIER=value
Replace "API_IDENTIFIER" with the API Identifier of the custom form field, and "value" with the information you want to pre-fill.
Hint: To locate the API Identifier for a given form field, please see our guide on locating and updating a form field's API Identifier.
Advanced: Formatting Complex or Non-Text Responses
Keep in mind that your custom values will need to be URL encoded in order to be formatted in a human-friendly manner once they've been applied to your form field(s). This is especially important for responses that include multiple words, spaces, punctuation, or other characters or symbols.
Formatting Text Fields
In the example below, we'll URL encode "Seattle, WA" to show how this response will need to be formatted.
We've started by creating a text field, prompting the attendee to provide a written response.
Note our API Identifier titled "residence".
β
If you're unfamiliar with URL encoding, we recommend visiting this website to automatically URL encode phrases. Simply copy and paste the phrase you'd like to format into the top field and click Encode below. You'll receive your URL-encoded phrase below.
β
You'll see that "Seattle, WA" has been converted to "Seattle%2C%20WA". Copy your formatted value and paste this into your URL to fulfill the value requirement as outlined in the instructions above.
β
Formatting Non-Text Fields
Some fields are a bit more complicated than text fields and require additional formatting. For the example below, we've used a "Multiple Choice" field, which allows attendees to check multiple boxes from a list of options.
These responses will need to be URL encoded as well, which includes concatenating multiple selections using "pipes" before encoding. We've configured an API Identifier titled "hours" and we're aiming to select the first two options: "Early Morning" and "Afternoon".
We've started by plugging the concatenated choices into the same URL encoder tool we used in the text example above:
β
Copy the formatted value and paste it into your URL as your pre-filled value. The encoded URL will recognize that we've selected two options from this list and select them both on the intake form.