Support Log in

Recipe: Building a Contact Form with Notifications

User Guide
Prefer video? Watch the Fillin Forge tutorials 9 short guides covering every feature Watch

This walkthrough creates a professional contact form from scratch, complete with admin notifications, auto-reply, and spam protection. By the end, you will have a working form embedded on your website that collects visitor inquiries and sends you an email for each one.

Step 1: Create the Form

  1. Go to Fillin Forge > New Form
  2. Enter the title: “Contact Us” (this is for your reference only and does not appear on the public form)
  3. You start with an empty builder canvas

Step 2: Add the Fields

Drag the following fields from the left panel into the center area, in this order:

#Field TypeLabelRequiredPlaceholderDescription
1NameYour NameYesJane Smith—
2EmailEmail AddressYes[email protected]We will respond within 24 hours
3PhonePhone NumberNo(555) 123-4567Optional, for faster follow-up
4SelectSubjectYes——
5TextareaMessageYesTell us how we can help…—

Step 3: Configure the Subject Dropdown

  1. Click on the Subject field in the center area
  2. In the right panel, add these options:
– General Inquiry

– Sales Question

– Technical Support

– Partnership Opportunity

– Other

  1. Set the placeholder to “Select a subject…”

Step 4: Configure the Message Textarea

  1. Click on the Message field
  2. In the Validation section of the field panel, set Min length to 10 (prevents one-word submissions)
  3. Set Max length to 2000

Step 5: Set Up the Submit Button and Success Message

  1. Find the Form Settings card in the builder
  2. Change the Submit button text to “Send Message”
  3. Set the Success message to: “Thank you for reaching out! We have received your message and will get back to you within 24 hours.”

Step 6: Configure Admin Notification

  1. Find the Email Notifications card
  2. Toggle on Notify admin on submission
  3. Enter the email address where you want to receive submissions (e.g., [email protected]). For multiple recipients, separate with commas: [email protected], [email protected]
  4. The admin email subject is fixed (“[Site name] New submission: Form title (#id)”), so there is nothing to set here

Step 7: Configure Auto-Reply

  1. In the same Email Notifications card, toggle on Send auto-reply to submitter
  2. Under Email field (for auto-reply address), select the Email field
  3. Set the Subject to: “Thanks for contacting us!”
  4. Write the body. It is sent as written, so it takes no placeholders such as {name}:
> Hello, thank you for your message. We have received your inquiry and will respond within 24 hours during business days. If your matter is urgent, please call us at (555) 000-0000. Best regards, The Team

Step 8: Enable Spam Protection

The honeypot, time check, and token validation are enabled by default. If you want stronger protection:

  1. Go to Fillin Forge > Settings and find the Google reCAPTCHA v3 card
  2. Enter your reCAPTCHA v3 Site Key and Secret Key
  3. Set the threshold to 0.5
  4. Save settings

Step 9: Save and Embed

  1. Click Save Form at the top of the builder
  2. Copy the shortcode shown (e.g.,

    Form not found.

    )
  3. Edit the page where you want the form (e.g., your Contact page)
  4. Paste the shortcode into the content area
  5. Publish or update the page

Step 10: Test Everything

  1. Visit the live page as a visitor would
  2. Fill out every field and click Send Message
  3. Confirm the success message appears
  4. Check your email for the admin notification
  5. Check the test email address for the auto-reply
  6. Go to Fillin Forge > Submissions and verify the submission is saved

—

Forge AI Assistant Online

Hi! I'm the Fillin Forge AI assistant. Ask me anything about the plugin — setup, features, troubleshooting, or development.

Just now
Powered by Forge AI · Browse docs