Blogger
Published: 27-Jul-2026 Updated: 12-Aug-2026

How to Add an HTML Email Contact Form in Blogger

Blogger is older but still widely used — add a proper contact form with email alerts, spam protection, and optional Kit.com newsletter sync without PHP or broken gadgets.

MFC

MyFormConnect Team

Blogger (Blogspot) is a fully hosted platform — Google runs the servers, you edit themes and pages in the dashboard, and there is no PHP, no plugins folder, and no way to run your own backend code. It is an older platform in internet years, but millions of blogs still live on it, and many owners keep theirs active because it is free, reliable, and easy to maintain.

Most Blogger sites are blogs first: posts, archives, and a simple About page. That same site can also work as a lightweight landing page or a satellite property that links back to your main website — useful for niche topics, personal brands, or SEO backlinks without spinning up a whole new stack. Equipping it with MyFormConnect turns a basic contact page into something much more capable: email alerts, spam filtering, a submission dashboard, and optional integrations (Telegram, Discord, Kit.com) with no server-side code on Blogspot.

The built-in contact gadget is limited and often breaks after theme updates. This guide shows how to add a proper HTML contact form that emails you on every submission using only embeddable HTML.

What Blogger does and doesn't support

Blogger hosts your site on Google's infrastructure and renders your theme templates. You can customise the HTML and CSS of your theme, and embed raw HTML into individual pages and posts. What you can't do:

  • Run PHP, Python, or Node scripts
  • Install server-side plugins
  • Use mailto: reliably — it opens the visitor's local email client, which many people don't have configured
  • Use client-side email APIs safely — secrets in JavaScript are visible to anyone

The solution is a standard HTML form that posts to an external endpoint. The endpoint runs on MyFormConnect's servers; your Blogspot theme only needs the form HTML.

Step 1: Create your form endpoint

  1. Sign up for MyFormConnect — there's a free plan to start
  2. Create a new form and give it a name (e.g. "Blog contact form")
  3. Go to Notifications and add your email address to receive alerts for new submissions
  4. Enable spam protection (honeypot is sufficient for most blogs)
  5. Copy the form endpoint URL

Step 2: Add the form to a Blogger page

The easiest way is to create a dedicated Contact page — or a landing-style page that links visitors to your main site after they reach out:

  1. In your Blogger dashboard, go to Pages → New Page
  2. Give the page a title (e.g. "Contact")
  3. Switch the editor to HTML view (the icon in the toolbar)
  4. Paste the form code below
  5. Publish the page and add a link to it from your blog menu or sidebar
<form action="https://myformconnect.io/f/YOUR_FORM_UUID" method="POST" style="max-width:500px;">

  <p>
    <label for="cf-name"><strong>Name</strong></label><br />
    <input id="cf-name" name="name" type="text" required
           style="width:100%; padding:8px; border:1px solid #ccc; border-radius:4px;" />
  </p>

  <p>
    <label for="cf-email"><strong>Email address</strong></label><br />
    <input id="cf-email" name="email" type="email" required
           style="width:100%; padding:8px; border:1px solid #ccc; border-radius:4px;" />
  </p>

  <p>
    <label for="cf-message"><strong>Message</strong></label><br />
    <textarea id="cf-message" name="message" rows="6" required
              style="width:100%; padding:8px; border:1px solid #ccc; border-radius:4px;"></textarea>
  </p>

  <p>
    <button type="submit"
            style="padding:10px 24px; background:#3b82f6; color:#fff; border:none; border-radius:4px; cursor:pointer;">
      Send message
    </button>
  </p>

</form>

The inline styles are there because Blogger themes often don't style form elements by default. Once you confirm the form works, you can move the styles to your theme's CSS if you prefer.

Setting up a thank-you page

Create a second Blogger page titled "Thank you" and set its URL to something like /p/thank-you. Then set that full Blogspot URL as the Redirect URL in your form settings (not a hidden field in the HTML). On that page you can thank the visitor, link to your main website, and invite them to subscribe or follow your blog — a natural fit when the Blogger site acts as a landing page or backlink hub.

Confirming email notifications work

  1. Publish the contact page and visit it
  2. Fill in the form with a real email address you can check (not a test address — spam filters may flag it)
  3. Submit and confirm you're redirected to your thank-you page
  4. Check your inbox — allow a minute or two on the first send
  5. Check spam or junk if it doesn't arrive, and mark it as not spam
  6. Check the submissions dashboard to confirm the entry is there

Add contacts to your Kit.com newsletter

Every submission that includes an email address can do double duty: notify you by email and add the person to your newsletter on Kit.com (formerly ConvertKit). Connect Kit once under Integrations, then on the same Blogger contact form enable the Kit integration, pick a Kit form, and map the email field (and optionally name). Only clean (non-spam) submissions are synced, so your list stays healthy.

This works for contact forms, not just dedicated signup boxes — someone who writes in from your Blogspot page can land in your welcome sequence or tagged audience automatically. See our Kit.com integration guide for the full connect-and-map steps, or the Kit integration overview for use cases and FAQs.

Spam on public Blogger blogs

Blogspot blogs indexed by search engines will attract form spam relatively quickly. Enable honeypot protection in your form settings before promoting the contact page. If spam becomes a persistent problem, you can configure CAPTCHA and embed the form with Loader.js instead.

A working contact form on Blogger

Once the form is in place and you've done a successful test submission, there's nothing else to maintain on the Blogger side. The form HTML sits in your page and posts to the endpoint; submissions accumulate in the dashboard and arrive in your inbox. If you want Telegram or Discord alerts, or Kit.com newsletter sync, those are dashboard changes — no edits to the Blogger theme required.

The one thing to keep an eye on is spam, particularly if the blog has good search visibility. Enable honeypot protection from the start and revisit the settings if spam submissions start getting through.

Ready to collect form submissions?

Create a free MyFormConnect form endpoint and skip building your own backend.

Start Free Trial

No credit card required · 5-minute setup