Enable, customize, and embed a contact form directly into your website or customer portal. All submitted entries are automatically added as leads in your system.
The contact form is part of the Customer Portal option, but it doesn't necessarily require the Customer Portal add-on to be enabled in order to use it.
Follow these steps to enable and customize your form.
Step 1. Enable the Contact Form Add-on
Navigate to the Add-ons section, look for the 'Contact Form' addon, you can find it directly from the add-on list
OR you can open the Customer Portal add-on and look for the Contact power up.
Step 2: Customize your contact form
If you click on the Contact Form label, you’ll be taken to the Manage page.
On this page, a set of default form fields is already included. Some fields are required by default, while others are optional.
What You Can Customize:
Header Text
Update the message at the top of the form
Font Size
You can change the size of the header text. It only affects the header text but not the other content of the form.
Submit Button Color
Change the Submit button color to match you branch.
Form Fields
A variety of fields are included by default, such as:
First Name
Last Name
Email
Phone
Address, City, State, Zip
Message (e.g., How can we help?)
Toggle Required: Decide which fields are mandatory by enabling or disabling the Required switch next to each field.
Show/Hide Consent Box: For phone contact, you can show a consent message to comply with communication laws.
Add Custom Questions
Click + Add Custom Question to include a personalized fields.
Field Label
Field Type - you can choose from the available field type
Checkboxes: Allows customer to select multiple options
Short Answer: Ideal for brief responses such as names, phone numbers, or short phrases.
Long Answer: Suitable for more detailed responses, like special instructions or comments.
Dropdown: Allows customer to select a single selection from the dropdown options
Options
Please note that you can add up to 5 custom fields to your contact form.
Each custom field will appear as an additional column in Reports > Inbound Leads. To display it, open the Columns filter and check the box next to the column name.
All customer responses to the custom fields will be shown under their corresponding columns in the report.
Use the Preview button to see how your form will appear to users.
Click Update Form to save your changes.
Embed Contact Form
Click the 'Show Code' button to view the available options for embedding your contact form on your website.
Embed code for:
Widget
Copy the following code and add just before the closing<body>tag.
Note: Your website installation code works for both online booking and customer portal add-ons. There is no need to install it twice. Only embed this code if you are not using the customer portal embed.
Webpage
Switch to the 'Webpage' tab and copy the code.
Social
Switch to the Socials tab and copy the URL link.
Reports > Inbound Leads
All submitted forms will be added as leads.
All leads can be found under Reports > Inbound Leads.
Each leads will have different Source label depending on which platform they accessed the contact form
Portal / Contact Form – for leads who submitted the form through the customer portal.
Web / Contact Form – for leads who submitted the form embedded on your website using the webpage code.
Socials / Contact Form – for leads who submitted the form via a social media link (Social link URL).
All custom field columns are added at the end of the Columns filter selection list.
Custom field columns do not appear automatically in the report. You need to manually select them using the Columns filter to display them in Reports > Inbound Leads.
When you add a custom field, it will appear as a column in the report, even if no data has been entered yet.
FAQ
Q: Is it possible to increase the height of the iframe container so users don’t need to scroll?
A: Yes, you can adjust the height of the iframe container by modifying the height: 500px attribute in the embed code. Increasing this value will reduce or eliminate the need for users to scroll within the iframe.
Example:
<iframe src="https://portal-embed-v3.gorilladesk.com/?screen=contact&account_id=553" width="100%" style="border: 0;height: 500px;"></iframe>
---
Contact Form