Title: Using Contact Forms
Category: website-editor
Where to find this: Services → Website Editor tab
Contact forms allow website visitors to contact you directly from your site. They automatically capture leads, send you notifications, and can sync with your CRM.
What Are Contact Forms?
A contact form is a component you add to your website to collect visitor information:
- Name and email (required)
- Department or inquiry type
- Custom message
- Any additional fields you configure
When someone submits a form, you're notified immediately and can follow up.
Why Use Contact Forms?
Capture Leads
Turn website visitors into potential customers:
- Collect contact information
- Understand their needs (message field)
- Qualify leads (department selection)
- Build your customer database
Professional Communication
Replace "email us at info@yourbusiness.com" with a structured form:
- Looks more professional
- Captures structured data
- Reduces spam
- Easier to track inquiries
CRM Integration
Forms can sync with HubSpot CRM:
- Automatically create contacts
- Track lead source (your website)
- Trigger follow-up workflows
- Measure conversion rates
Adding a Contact Form to Your Page
Step 1: Open the Website Editor
- Go to Services → Website Editor tab
- Select the page where you want the form (usually Contact page)
- Click Edit to open the editor
Step 2: Drag the Contact Form Component
- In the left sidebar, find the Components tab
- Scroll to the forms section
- Drag Contact Form onto your page
- Position it where you want (usually full-width in a container)
Step 3: Configure Form Fields
Click the form to open settings:
Default Fields:
- Name (text input, required)
- Email (email input, required)
- Department (dropdown: Sales, Billing, Support, General)
- Message (textarea, required)
Step 4: Customize Appearance
Style the form to match your branding:
Form Title:
- Set a title (e.g., "Get in Touch" or "Contact Us")
- Choose font size and weight
- Set title color
Button Style:
- Button text (default: "Send")
- Button color (use your brand color)
- Button shape (rounded, square, pill)
Layout:
- Full-width or contained
- Spacing between fields
- Background color (transparent or card-like)
Step 5: Set Up Notifications
Configure who receives form submissions:
- In form settings, find Notifications section
- Enter your email address (submissions sent here)
- Optionally add multiple email addresses (comma-separated)
- Choose notification format (immediate or digest)
Step 6: Save and Test
- Click Save Changes
- Click Preview to test the form
- Submit a test form entry
- Verify you received the notification email
Managing Form Submissions
Viewing Submissions
Access all form submissions:
- Go to Services → Forms
- See all submissions with:
- Submitter name and email
- Message content
- Submission date/time
- Department selected
- Filter by date range or department
- Export to CSV for analysis
Responding to Inquiries
For each submission:
- Click to view full details
- Click the email address to compose a reply
- Mark as "Responded" to track follow-ups
- Add internal notes (visible only to you)
Notification Email
When someone submits a form, you receive:
- Subject: "New Contact Form Submission from [Name]"
- Body: All form fields and their values
- Reply-to: Set to the submitter's email (easy to reply directly)
Customizing Form Fields
Adding Custom Fields
Beyond the default fields, you can add:
Phone Number:
- Input type: tel
- Validation: phone format
- Required or optional
Company:
- Input type: text
- Placeholder: "Your Company Name"
- Optional
Budget Range:
- Input type: dropdown
- Options: Under $1,000 | $1,000-$5,000 | $5,000-$10,000 | $10,000+
- Helps qualify leads
Preferred Contact Method:
- Input type: radio buttons
- Options: Email | Phone | Text
- Helps personalize follow-up
How Did You Hear About Us:
- Input type: dropdown
- Options: Google | Social Media | Referral | Advertisement | Other
- Tracks marketing effectiveness
Field Types Available
Field Properties
For each field, configure:
- Label: What the user sees ("Your Name")
- Placeholder: Example text in the field
- Required: Must be filled before submission
- Validation: Email format, phone format, minimum length
Integrating with HubSpot CRM
If you've connected HubSpot, forms can automatically create contacts.
Enabling HubSpot Sync
- Connect HubSpot from Services → Integrations tab
- In form settings, find CRM Integration section
- Toggle "Sync to HubSpot" ON
- Map form fields to HubSpot properties:
- Name → First Name / Last Name
- Email → Email
- Message → Notes
- Department → Custom property
What Gets Synced
When sync is enabled:
- New contact created in HubSpot (if email doesn't exist)
- Existing contact updated (if email already exists)
- Form submission logged as activity
- Lead source set to "Website Contact Form"
- All custom fields added to contact properties
Viewing in HubSpot
After submission:
- Log in to your HubSpot account
- Go to Contacts
- Find the contact by email
- View their timeline to see the form submission
- Contact properties include all form data
Form Success Messages
Customize what visitors see after submitting:
Default Success Message
"Thank you! We've received your message and will get back to you soon."
Custom Success Messages
Personalize by department:
- Sales inquiry: "Thanks! A sales rep will contact you within 24 hours."
- Support request: "We've received your support ticket. Expected response: 2-4 hours."
- General inquiry: "Thanks for reaching out! We typically respond within one business day."
Redirect Option
Instead of a message, redirect to another page:
- Thank you page with additional info
- Special offer page
- Booking page (for consultations)
- Download page (for lead magnets like PDFs)
Form Spam Protection
Forms include built-in spam protection:
Honeypot Fields
Invisible fields that bots fill out (humans can't see them):
- If filled, submission is automatically rejected
- No CAPTCHA needed
- Transparent to users
Rate Limiting
Prevents spam submissions:
- Max 3 submissions per IP per hour
- Prevents bot attacks
- Legitimate users unaffected
Email Validation
Ensures valid email addresses:
- Format checking (must contain @)
- Domain verification (MX record check)
- Disposable email detection (blocks temporary emails)
Form Analytics
Track form performance:
Submission Metrics
View in your dashboard:
- Total submissions (all time)
- Submissions this month
- Submissions by department
- Response rate (marked as responded ÷ total)
Conversion Tracking
If you have Google Analytics connected:
- Form submissions tracked as "conversions"
- See which traffic sources lead to form fills
- Track form completion rate
- Identify drop-off points
Multiple Forms
You can add multiple contact forms:
Different Forms for Different Pages
Homepage: General inquiry form
Services Page: Service-specific form with "Service Interested In" dropdown
Pricing Page: Quote request form with budget field
Support Page: Support ticket form with priority dropdown
Routing by Department
Direct inquiries to the right team:
- Sales forms → sales@yourbusiness.com
- Support forms → support@yourbusiness.com
- Billing forms → billing@yourbusiness.com
Configure email routing in form settings.
Best Practices
Keep It Simple
Ask only for essential information:
- Name and email (required)
- Purpose/department (helps routing)
- Message (what they need)
Too many fields reduce submissions.
Clear Labels
Use plain language:
- "Your Name" not "Full Legal Name"
- "Email Address" not "Electronic Mail"
- "How can we help?" not "Inquiry Type"
Mobile-Friendly
Forms are responsive by default:
- Fields stack vertically on mobile
- Large touch targets for buttons
- Easy to type on small screens
Test on your phone to verify.
Fast Follow-Up
Respond quickly to inquiries:
- Within 24 hours (ideally within a few hours)
- Personalize your response (reference their message)
- Set expectations (when they'll hear back, next steps)
Thank You Page
Consider redirecting to a thank you page that:
- Confirms submission received
- Sets expectations (response time)
- Offers next steps (book a call, browse services)
- Includes social proof (testimonials)
Troubleshooting
Not Receiving Notifications
Check:
- Email address is correct in form settings
- Emails not in spam folder
- Notification emails enabled (toggle in settings)
Solution: Send a test submission and check spam filter settings.
Form Not Submitting
Check:
- All required fields are filled
- Email format is valid
- Internet connection is stable
Solution: Check browser console for errors, contact support if issue persists.
HubSpot Not Syncing
Check:
- HubSpot connection is active (check Services → Integrations tab)
- Sync toggle is enabled in form settings
- Field mapping is configured correctly
Solution: Reconnect HubSpot and verify API permissions.
Spam Submissions
Check:
- Honeypot protection is enabled
- Rate limiting is active
- Email validation is turned on
Solution: All protection features are enabled by default. Contact support if spam continues.
Common Questions
Q: Can I export form submissions?
A: Yes, from Services → Forms, click "Export to CSV" to download all submissions.
Q: How long are form submissions stored?
A: Indefinitely, until you manually delete them.
Q: Can customers attach files in forms?
A: Not currently. For file uploads, direct users to email or use a third-party service.
Q: Can I customize the form design beyond the settings?
A: Yes, using custom CSS in the component settings (Advanced tab).
Q: Do forms work on all devices?
A: Yes, forms are fully responsive and work on desktop, tablet, and mobile.
Q: Can I require acceptance of terms before submission?
A: Yes, add a checkbox field with "I agree to the Terms of Service" and mark it as required.
Q: Can I send autoresponder emails to submitters?
A: Not built-in currently. Use HubSpot workflows for automated follow-ups after sync.