Skip to content
FormSubmit

WordPress

How to add a WordPress contact form without a plugin

Add a fast, spam-protected contact form to WordPress with a Custom HTML block — no Contact Form 7, WPForms or SMTP plugin required.

2 min readUpdated Sep 28, 2026

You can add a contact form to WordPress without a plugin by pasting an HTML form into a Custom HTML block and setting its action to a FormSubmit endpoint. Submissions are emailed to you, stored in your FormSubmit dashboard and filtered for spam — no Contact Form 7, WPForms, SMTP plugin or PHP mail configuration required.

Why go plugin-free?

Contact form plugins are among the most common sources of WordPress bloat and vulnerabilities, and they depend on your host's ability to send email — which is frequently the reason "my contact form doesn't work". Moving the form's backend off WordPress means:

  • nothing to update or patch,
  • no extra database tables or admin screens,
  • reliable email delivery,
  • spam filtering that doesn't require yet another plugin,
  • submissions you can export or forward to Slack, Google Sheets or Mailchimp.

Step 1: Create the endpoint

Sign in to FormSubmit, create a form called "WordPress contact" and copy the endpoint URL.

Step 2: Add a Custom HTML block

In the block editor (Gutenberg), open the page, click +, search for Custom HTML and add the block. In Elementor, use the HTML widget; in Divi, the Code module; in classic themes, the Text tab of the editor or a Custom HTML widget.

Step 3: Paste the form

This version includes a small stylesheet so it looks tidy in most themes:

Custom HTML block
<!--
  WordPress: add a "Custom HTML" block (Gutenberg) or an HTML widget (Elementor / Divi / Classic editor)
  and paste this form. No plugin required.
-->
<form action="https://formsubmit.app/f/YOUR_FORM_ID" method="POST" class="fs-form">
  <div class="fs-field">
    <label for="fs-name" class="fs-label">Name</label>
    <input id="fs-name" type="text" name="name" placeholder="Jane Doe" required class="fs-input">
  </div>
  <div class="fs-field">
    <label for="fs-email" class="fs-label">Email</label>
    <input id="fs-email" type="email" name="email" placeholder="jane@example.com" required class="fs-input">
  </div>
  <div class="fs-field">
    <label for="fs-message" class="fs-label">Message</label>
    <textarea id="fs-message" name="message" rows="5" placeholder="How can we help?" required class="fs-input"></textarea>
  </div>
  <!-- Honeypot: leave this hidden field empty to catch bots -->
  <input type="text" name="_gotcha" tabindex="-1" autocomplete="off" style="display:none">
  <!-- Optional: where to send people after submitting -->
  <!-- <input type="hidden" name="_redirect" value="https://yoursite.com/thanks"> -->
  <button type="submit" class="fs-button">Send</button>
</form>

<style>
  .fs-form { max-width: 32rem; margin: 0 auto; display: grid; gap: 1.1rem; font-family: system-ui, sans-serif; }
  .fs-field { display: grid; gap: 0.35rem; border: 0; padding: 0; margin: 0; }
  .fs-label { font-size: 0.875rem; font-weight: 600; color: #18181b; }
  .fs-input { width: 100%; box-sizing: border-box; border: 1px solid #d4d4d8; border-radius: 0.5rem; padding: 0.6rem 0.75rem; font: inherit; font-size: 0.9rem; }
  .fs-input:focus { outline: 2px solid #6366f155; border-color: #6366f1; }
  .fs-choice { display: flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; }
  .fs-help { font-size: 0.75rem; color: #71717a; margin: 0; }
  .fs-button { background: #18181b; color: #fff; border: 0; border-radius: 0.5rem; padding: 0.7rem 1rem; font-weight: 600; cursor: pointer; }
  .fs-button:hover { background: #27272a; }
</style>

Replace YOUR_FORM_ID with your id, then Preview — the form inherits your theme's fonts.

Step 4: Send people to a WordPress thank-you page

Create a page called "Thank you" and add a hidden field pointing at it:

html
<input type="hidden" name="_redirect" value="https://yoursite.com/thank-you/">

Or set the redirect URL once in the FormSubmit form settings.

Step 5: Test and protect

Submit a test message. Then, in FormSubmit settings, add your domain to the allowlist. WordPress sites attract a lot of bots; the honeypot and heuristics handle most of them, and you can add Cloudflare Turnstile in a few minutes if needed.

Can I keep my existing plugin's design?

Yes. Many form plugins let you change the form's action URL; if yours doesn't, recreate the fields in the form generator and export WordPress-ready HTML.

Multiple forms

Create one FormSubmit form per purpose (contact, quote request, job applications) so each can have its own recipients, autoresponder and integrations. The free plan includes one form; Starter includes two and Pro ten.

Frequently asked questions

Why avoid contact form plugins?

Plugins add PHP code, database tables, update chores and a larger attack surface, and still rely on your host's mail setup. A hosted form backend removes all of that from your WordPress install.

Does this work with Elementor, Divi and Beaver Builder?

Yes. Use the builder's HTML or Code widget and paste the same form.

Will emails land in spam?

FormSubmit sends through a transactional email provider with proper authentication, so deliverability doesn't depend on your WordPress host's PHP mail.

Keep reading

Your form backend is 60 seconds away

Sign in with Google, create a form, paste the endpoint. Free forever for small sites — no credit card.