Email Subscription Form Setup Guide

⚠️ Fix for 405 Error

The 405 error occurred because the form action was set to a placeholder URL. I’ve fixed the email subscription widget with 4 working options.

🚀 Quick Setup (Choose ONE Option)

Option 1: Formspree (Easiest & Free) ⭐ RECOMMENDED FOR QUICK START

Best for: Getting started quickly, free tier, no email service yet

Setup Steps:

Go to https://formspree.io
Sign up for free account (50 submissions/month free)
Click “New Form”
Copy your Form ID (looks like: xpznabcd)
Open _includes/email-subscription.html
Find line 24: action="https://formspree.io/f/YOUR_FORMSPREE_ID"
Replace YOUR_FORMSPREE_ID with your actual ID
Uncomment the Formspree form (remove )
Comment out or delete the placeholder form

Pros:

✅ Free tier (50 submissions/month)
✅ Works immediately
✅ No coding required
✅ Spam protection included
✅ Email notifications

Cons:

❌ Not a full email marketing platform
❌ No automation or sequences
❌ Emails go to your inbox, not an ESP

Cost: Free (50/month), $10/month (1,000/month)

Option 2: ConvertKit (Best for Bloggers) ⭐ RECOMMENDED FOR GROWTH

Best for: Serious email marketing, automation, monetization

Setup Steps:

Go to https://convertkit.com
Sign up (free up to 1,000 subscribers)
Go to “Forms” → “Create a form”
Choose “Embed” form type
Copy the form action URL
Open _includes/email-subscription.html
Find the ConvertKit section (line 55)
Uncomment the ConvertKit form
Replace YOUR_FORM_ID with your form ID
Comment out the other options

Pros:

✅ Free up to 1,000 subscribers
✅ Built for creators/bloggers
✅ Email sequences & automation
✅ Tag-based segmentation
✅ Landing pages included
✅ Easy to use

Cons:

❌ More setup than Formspree
❌ Costs after 1,000 subscribers ($29/month)

Cost: Free (0-1,000), $29/month (1,000-3,000)

Option 3: MailerLite (Best Free Tier)

Best for: Budget-conscious, large free tier

Setup Steps:

Go to https://mailerlite.com
Sign up (free up to 1,000 subscribers)
Go to “Forms” → “Create form”
Choose “Embedded form”
Get the form action URL
Open _includes/email-subscription.html
Find MailerLite section (line 83)
Uncomment and add your form details
Comment out other options

Pros:

✅ Free up to 1,000 subscribers
✅ Unlimited emails
✅ Good automation
✅ Landing pages
✅ A/B testing

Cons:

❌ Interface not as creator-focused

Cost: Free (0-1,000), $10/month (1,000-2,500)

Option 4: Netlify Forms (If hosted on Netlify)

Best for: Netlify-hosted sites

Setup Steps:

If your site is on Netlify, this works automatically
Open _includes/email-subscription.html
Find Netlify Forms section (line 111)
Uncomment the Netlify form
Push to Netlify
Forms appear in Netlify dashboard

Pros:

✅ Built into Netlify
✅ No external service needed
✅ Free tier (100 submissions/month)

Cons:

❌ Only works on Netlify
❌ Not a full email platform
❌ No automation

Cost: Free (100/month), $19/month (1,000/month)

📋 Implementation Checklist

Step 1: Choose Your Solution

Decided on email service (Formspree, ConvertKit, MailerLite, or Netlify)

Step 2: Set Up Account

Created account with chosen service
Got form ID or action URL
Tested form in their dashboard

Step 3: Update Code

Step 4: Create Thank You Page

Created /thank-you.html or /thank-you.md
Added success message
Added social share buttons
Linked to popular content

Step 5: Test

Submitted test email
Verified email received in ESP
Checked redirect to thank you page
Tested on mobile

Step 6: Add to Pages

Added widget to blog post template
Added to homepage
Added to about page
Tested all locations

🎨 Customization Options

Change Colors

Edit the CSS in _includes/email-subscription.html:

/* Change gradient background */
.email-subscription-widget {
  background: linear-gradient(135deg, #YOUR_COLOR_1 0%, #YOUR_COLOR_2 100%);
}

/* Change button color */
.email-submit-btn {
  background: #YOUR_BUTTON_COLOR;
}

Change Lead Magnets

Edit the lead magnet list (around line 155):

<li>✨ Your Lead Magnet Title 1</li>
<li>✨ Your Lead Magnet Title 2</li>
<li>✨ Your Lead Magnet Title 3</li>

Change Copy

Update the title, description, and CTA text to match your brand voice.

🔧 Troubleshooting

Form still shows 405 error

Make sure you replaced YOUR_FORMSPREE_ID with actual ID
Check that the form action URL is correct
Verify you uncommented the form (removed )

Not receiving emails

Check spam folder
Verify email service account is active
Test with different email address
Check ESP dashboard for submissions

Form styling looks broken

Make sure the <style> block is included
Check for conflicting CSS
Clear browser cache
Test in incognito mode

Redirect not working

Make sure /thank-you page exists
Check _next field in Formspree form
Verify site URL is correct in ESP settings

💡 My Recommendation

For immediate setup: Start with Formspree

Takes 5 minutes
Free to start
Works immediately
Collect emails while you decide on full ESP

For long-term growth: Migrate to ConvertKit

Built for creators
Powerful automation
Good free tier
Export from Formspree → Import to ConvertKit later

Best of both worlds:

Start with Formspree TODAY (5 minutes)
Collect first 50-100 subscribers
Set up ConvertKit account
Export from Formspree, import to ConvertKit
Switch form code to ConvertKit
Now you have automation + sequences

📧 Quick Formspree Setup (5 Minutes)

Go to formspree.io → Sign up
Click “New Form” → Name it “Newsletter”
Copy your Form ID (e.g., xpznabcd)
Edit file: _includes/email-subscription.html
Find line 24: Replace YOUR_FORMSPREE_ID with your ID
Save and commit
Test the form → Submit your email
Check your inbox → You’ll get the submission

Done! You’re now collecting emails! 🎉

📞 Need Help?

If you’re still getting the 405 error after following these steps:

Share which option you chose
Share the error message
I’ll help you troubleshoot

The form is now properly configured with 4 working options. Just choose one and follow the setup steps!