🚀 REISS BUILDS - CLOUDFLARE FORM SETUP GUIDE

Status: Ready to implement - All code created!
Time Required: 20-30 minutes initial setup
Monthly Cost: $0 (uses Cloudflare free tiers)

📁 WHAT'S BEEN CREATED

✅ functions/api/contact.ts - Form handler with validation & email sending
✅ wrangler.toml - Cloudflare configuration
✅ contact.njk - Updated with Turnstile & proper form action
✅ thank-you.njk - Success page after form submission

🔧 CLOUDFLARE DASHBOARD SETUP (Required)

Step 1: Enable Turnstile (Anti-Spam)

1. Go to: Cloudflare Dashboard → Your Account → Turnstile
2. Click: "Add Site"
3. Configure:
   • Site name: REISS BUILDS Website
   • Domain: reissbuilds.com (or your actual domain)
   • Widget mode: Managed (Invisible)
4. Save and copy the Site Key and Secret Key

Step 2: Setup Email Routing & Email Workers

1. Go to: Cloudflare Dashboard → reissbuilds.com → Email → Email Routing
2. Click: "Enable Email Routing"
3. Add destination: jeff@reissbuilds.com (verify via email link)
4. Go to: Email → Email Workers
5. Click: "Enable Email Workers"
6. Note: This creates the SEND binding we use in the code

Step 3: Update Configuration Files

A) Update Contact Form Turnstile Key

Edit contact.njk line 177:

<!-- REPLACE THIS LINE: -->
<div class="cf-turnstile" data-sitekey="YOUR_TURNSTILE_SITE_KEY"></div>

<!-- WITH YOUR ACTUAL SITE KEY: -->
<div class="cf-turnstile" data-sitekey="0x4AAAAABCDEFGHijk1234567890"></div>

B) Set Turnstile Secret (Command Line)

From your project directory:

cd /Users/neilwhite/Projects/reiss-builds-html
npx wrangler secret put TURNSTILE_SECRET
# When prompted, paste your Turnstile SECRET KEY

C) Update Email Settings (Optional)

Edit wrangler.toml if needed:

[vars]
MAIL_FROM = "no-reply@reissbuilds.com"  # Must be your domain
MAIL_TO = "jeff@reissbuilds.com"        # Where to receive leads
# MAIL_BCC = "neil@agilemedia.agency"   # Optional backup recipient

🚀 DEPLOYMENT

Option 1: Git Push (Recommended)

npm run build
git add .
git commit -m "Add Cloudflare form submission system"
git push origin 11ty

✅ Auto-deploys to: https://reiss-builds-html.pages.dev/

Option 2: Manual Deploy

npm run build
npx wrangler pages deploy _site --project-name reiss-builds-html

🧪 TESTING THE FORM

Test Form Submission:

1. Go to: https://reiss-builds-html.pages.dev/contact
2. Fill out form completely
3. Submit → should redirect to /thank-you/
4. Check email at jeff@reissbuilds.com

Test Anti-Spam:

• Form without Turnstile = rejected
• Honeypot field filled = silently accepted (spam)

📧 EMAIL SAMPLE

You'll receive formatted emails like:

🏠 NEW CONTACT FROM REISS BUILDS WEBSITE

CONTACT INFORMATION:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Name:      John Smith  
Email:     john@example.com
Phone:     (555) 123-4567
Address:   123 Main St, West Palm Beach, FL

PROJECT DETAILS:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Type:      Kitchen Remodeling
Timeline:  Within 1 Month  
Budget:    $50,000 - $100,000
Source:    Google Search

SPECIAL INTERESTS:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
• Hurricane-resistant upgrades
• Insurance discount opportunities

PROJECT DETAILS:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Looking to remodel my kitchen with hurricane-resistant 
features. Interested in maximizing insurance discounts.

SUBMISSION INFO:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Submitted: Thursday, August 28, 2025 at 2:30 PM EST
Source:    https://reiss-builds-html.pages.dev/contact  
IP:        192.168.1.100

🔧 OPTIONAL: ADD KV STORAGE FOR BACKUP

If you want to store all form submissions:

1. Create KV Namespace

npx wrangler kv:namespace create LEADS_KV
# Copy the returned namespace ID

2. Update wrangler.toml

Uncomment and add your KV namespace ID:

[[kv_namespaces]]
binding = "LEADS_KV"
id = "your-actual-namespace-id-here"

3. Deploy

All form submissions will be stored in KV for 1 year as backup.

🆘 TROUBLESHOOTING

Form Not Working?

• Check Turnstile site key in contact.njk
• Verify TURNSTILE_SECRET is set: npx wrangler secret list
• Check Email Workers is enabled in dashboard

Email Not Sending?

• Verify MAIL_FROM uses your domain (@reissbuilds.com)
• Check Email Routing destination is verified
• Look at Cloudflare Worker logs: Dashboard → Workers → Functions

Build Issues?

rm -rf node_modules package-lock.json
npm install
npm run build

📊 SUCCESS METRICS TO TRACK

• Form submissions (via email notifications)
• Spam blocked (Turnstile + honeypot)
• Response time (goal: <24 hours)
• Lead conversion (consultations booked)

🎯 NEXT STEPS AFTER SETUP

1. Test form thoroughly on live site
2. Train team on new email format
3. Set response time goals (<24 hours)
4. Consider auto-responder (future enhancement)
5. Add form analytics (future enhancement)

Questions? Check the troubleshooting section or create an issue.

Form System: ✅ Production Ready
Cost: $0/month
Maintenance: Minimal
Scalability: Handles 100K+ submissions/month