Adding Contact Forms to Your Website

Adding Contact Forms to Your Website

A contact form lets visitors send you messages directly from your website without exposing your email address. It’s more professional than a plain email link and helps reduce spam.

WordPress Contact Forms

Contact Form 7 (Free):

1. Install and activate the Contact Form 7 plugin.
2. Go to Contact → Add New.
3. Configure your form fields using simple markup:

   <label>Name [text* your-name]</label>
   <label>Email [email* your-email]</label>
   <label>Message [textarea your-message]</label>
   [submit "Send"]
   

4. Set the Mail tab to configure where submissions are sent.
5. Copy the shortcode (e.g., [contact-form-7 id="123" title="Contact"]) and paste it into any page or post.

WPForms (Free + Premium):

1. Install the WPForms plugin.
2. Create a new form using the drag-and-drop builder.
3. Choose a template (Simple Contact, Request a Quote, etc.) or start from scratch.
4. Add fields by dragging them into the form area.
5. Configure email notifications under Settings → Notifications.
6. Embed the form using the WPForms block or shortcode.

HTML Contact Forms

For static or custom-coded sites, create a form with HTML and process it server-side:

<form action="/contact-handler.php" method="POST">
  <label for="name">Name:</label>
  <input type="text" id="name" name="name" required>

  <label for="email">Email:</label>
  <input type="email" id="email" name="email" required>

  <label for="message">Message:</label>
  <textarea id="message" name="message" required></textarea>

  <button type="submit">Send Message</button>
</form>

You’ll need a server-side script (PHP, Node.js, Python) or a third-party service to process submissions.

Third-Party Form Services

If you don’t want to handle form processing yourself:

• Formspree: Add their endpoint as your form’s action URL — submissions are forwarded to your email.
• Netlify Forms: Built-in form handling for Netlify-hosted sites.
• Google Forms: Create a form and embed it via iframe.
• Typeform / JotForm: Full-featured form builders with free tiers.

Spam Prevention

• reCAPTCHA: Add Google reCAPTCHA to verify human submissions.
• Honeypot fields: Add a hidden field that bots fill out but humans don’t see.
• Akismet: WordPress anti-spam plugin that filters form submissions.
• Rate limiting: Restrict the number of submissions from a single IP.

Best Practices

• Only ask for information you actually need — shorter forms get more submissions.
• Show a clear success message after submission.
• Send an auto-reply to acknowledge receipt.
• Test your form thoroughly — send test submissions and verify you receive them.
• Ensure form data is transmitted over HTTPS for security.
• Include a link to your privacy policy near the form.