Formclick

How to Add Forms to WordPress Websites

Add a contact form to WordPress with a plugin or with plain HTML and a form backend — no plugin bloat, no PHP mail problems, works with any theme or page builder.

FFormclick Team3 min read
A person typing on a laptop in a stylish home office with a glass of drink nearby.
Photo by cottonbro studio on Pexels
On this page
  1. Option 1: A form plugin
  2. Option 2: Plain HTML + a form backend
  3. Adding an HTML form in the block editor (Gutenberg)
  4. Page builders
  5. Showing a thank-you message
  6. Caching and security plugins
  7. Which should you choose?
  8. Getting submissions where you need them

WordPress powers a huge share of the web, and nearly every WordPress site needs a contact form. You have two main routes: install a form plugin, or paste a plain HTML form that posts to a form backend. Both work — here's how to do each, and how to choose.

Option 1: A form plugin

Plugins like Contact Form 7, WPForms, Gravity Forms, Formidable and Fluent Forms add a form builder to your dashboard.

Pros: visual builder, deep WordPress integration, many add-ons. Cons:

  • Email delivery problems. Plugins usually send mail through WordPress's wp_mail(), which on many hosts uses PHP mail — messages often land in spam or disappear. You typically need an extra SMTP plugin and email service to fix it.
  • More plugins to update and keep secure.
  • Extra scripts and styles on every page, which can slow your site.
  • Locked to WordPress — moving to another platform means rebuilding forms.

Option 2: Plain HTML + a form backend

Paste a normal HTML form into a page and point it at a form backend like Formclick. The backend receives submissions, filters spam, emails you with authenticated mail and stores everything in a dashboard.

Pros: no plugin, reliable delivery, light on page weight, works with any theme or builder, and the same form works if you ever leave WordPress. Cons: no drag-and-drop builder inside WordPress (though our templates give you finished designs to paste).

Adding an HTML form in the block editor (Gutenberg)

  1. Edit the page where the form should appear.
  2. Click + and add a Custom HTML block.
  3. Paste your form:
<form class="fc-form" action="https://api.formclick.io/submit" method="POST">
  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY">
  <input type="hidden" name="subject" value="New message from the website">
  <input type="checkbox" name="botcheck" style="display: none;">

  <p>
    <label for="fc-name">Name</label><br>
    <input id="fc-name" name="name" required>
  </p>
  <p>
    <label for="fc-email">Email</label><br>
    <input id="fc-email" name="email" type="email" required>
  </p>
  <p>
    <label for="fc-message">Message</label><br>
    <textarea id="fc-message" name="message" rows="5" required></textarea>
  </p>
  <p><button type="submit">Send message</button></p>
</form>

<script src="https://cdn.formclick.io/formclick.min.js"></script>
  1. Click Preview to check it, then Update.

Replace YOUR_ACCESS_KEY with the key from your free Formclick account. Your theme's styles apply to the inputs automatically; add a few CSS rules under Appearance → Customize → Additional CSS if you want to fine-tune them.

Page builders

  • Elementor: drag an HTML widget onto the page and paste the form.
  • Divi: add a Code module.
  • Beaver Builder: use the HTML module.
  • Classic editor: switch to the Text tab and paste.

Showing a thank-you message

You have two options:

  • Stay on the page: keep the formclick.min.js script — it shows a success message in place.
  • Redirect to a page: create a "Thank you" page in WordPress and add its URL as a hidden field (on Formclick's Free plan the page must be on the same website as the form):
<input type="hidden" name="redirect" value="https://yoursite.com/thank-you/">

A dedicated thank-you page is also handy for tracking conversions in analytics.

Caching and security plugins

Because the form posts directly to Formclick, page-caching plugins don't interfere with submissions. If you use a strict Content Security Policy, allow https://api.formclick.io for form actions and connections, and https://cdn.formclick.io for scripts.

Which should you choose?

You need Choose
Complex forms with payments, conditional logic inside WordPress A premium form plugin
Contact, quote and lead forms that just work HTML + form backend
A site you might move off WordPress HTML + form backend
Minimal plugins and a fast site HTML + form backend

Getting submissions where you need them

Beyond email, Formclick can send each WordPress submission to Google Sheets, Notion, Airtable, email marketing tools like Brevo and MailerLite, Discord, your own database, or any app via webhooks. See the integrations.

Want a design to start from? Our contact form template pastes straight into a Custom HTML block.

Found this useful? Share it.

All articles