HomeDocumentation

Contact Forms

Create professional contact forms that integrate seamlessly with your chatbot and include built-in spam protection.

Overview

Contact Forms in ChatReact allow you to:

  • Collect structured information from visitors
  • Automatically filter spam submissions
  • Receive notifications for new submissions
  • Review and manage submissions in the dashboard

Availability

Contact Forms are available on:

  • Starter plan and above

Creating a Form

Step 1: Navigate to Forms

  1. Go to Forms in the sidebar
  2. Click Create Form

Step 2: Configure Basic Settings

SettingDescription
NameInternal name for the form
DescriptionOptional description for your team
ActiveToggle form on/off
Notification EmailWhere to send submission alerts

Step 3: Add Fields

Drag and drop to add fields:

Field TypeDescription
TextSingle line text input
EmailEmail with validation
PhonePhone number input
TextareaMulti-line text
SelectDropdown selection
CheckboxYes/no toggle
NumberNumeric input

Field Options

For each field, configure:

  • Label: Display name
  • Placeholder: Hint text
  • Required: Must be filled
  • Options: For select/dropdown fields

Spam Protection

AI-Powered Spam Filter

Every submission is analyzed by AI for:

  • Suspicious patterns
  • Known spam content
  • Bot-like behavior
  • Quality signals

Spam Threshold

Set sensitivity (0-100):

  • Low (25): Catch obvious spam only
  • Medium (50): Balanced filtering
  • High (75): Aggressive spam blocking

Auto-Reject

Enable automatic rejection of spam submissions:

  • Rejected submissions are logged but not sent
  • Review rejected submissions anytime

Managing Submissions

Submission List

View all form submissions with:

  • Submission date and time
  • Submitter information
  • Spam score and status
  • Review status

Submission Actions

ActionDescription
ViewSee full submission details
Mark as SpamFlag as spam for future filtering
Mark as Not SpamApprove falsely flagged submission
DeleteRemove submission permanently

Filtering

Filter submissions by:

  • Date range
  • Status (pending, reviewed, spam)
  • Search by content

Embedding Forms

Widget Integration

Forms can appear in the chat widget:

  1. Configure form trigger in chatbot settings
  2. When triggered, form appears in chat

Standalone Embed

Embed forms directly on your website:

<div id="chatreact-form"></div>
<script 
  src="https://www.chatreact.ai/embed/form.js" 
  data-form-id="YOUR_FORM_ID"
  async
></script>

Styling

Forms automatically inherit your widget's styling:

  • Primary and secondary colors
  • Border radius
  • Font family

Notifications

Email Notifications

Receive instant emails for new submissions:

  • Configurable recipient
  • Full submission content
  • Quick action links

In-App Notifications

See new submissions in the notification bell:

  • Click to navigate to submission
  • Mark as read/unread

Best Practices

  1. Keep forms short: Only ask for essential information
  2. Use clear labels: Avoid jargon
  3. Test spam filter: Submit test entries to calibrate
  4. Respond promptly: Quick responses improve satisfaction
  5. Review spam folder: Check for false positives

Next Steps