Every service business needs a way for visitors to ask for a quote. The standard advice is to install a dedicated contact form plugin, and that works, but it also means one more plugin to update, one more settings screen to learn, and one more upgrade prompt to ignore. 🙄
If your site already runs on the block editor, there’s a leaner path. Otter Blocks is a free plugin (300,000+ active installs, 4.7 out of 5 on WordPress.org) that adds a library of extra blocks to Gutenberg, and one of those blocks is a proper Form block: custom fields, email routing, spam protection, and an autoresponder.
Quick honesty check: yes, Otter is still a plugin, so “no plugin at all” would be a fib. The win here is skipping a single-purpose form plugin when a general blocks plugin you may already want can cover the job too. One less thing to maintain. 👍
This guide walks through building a quote-request form for a service business, step by step: picking the right fields, routing submissions to the right inbox, stopping spam, and sending an automatic reply. It also covers the cases where a dedicated form plugin genuinely is the better tool, because sometimes it is.
⚖️ DISCLAIMER: Otter Blocks is made by ThemeIsle, the same company behind this blog. The tutorial below sticks to what the free and Pro versions actually do, and the honest-limits section tells you when a different plugin wins.
What you need before starting
- A WordPress site using the block editor. Any modern theme works. If you’re new to Gutenberg, this WordPress block editor tutorial covers the basics.
- The free Otter Blocks plugin. Everything in steps 1 through 4 and step 6 works in the free version. Pro-only extras are marked clearly as they come up.
- An email address where quote requests should land.
- About 15 minutes. Less if you skip the styling step. ⏱️
Step 1: Install Otter Blocks and insert the Form block
From your WordPress dashboard, go to Plugins → Add New, search for “Otter Blocks,” then click Install and Activate. That’s the whole setup; there’s no wizard to fight through.
Next, open the page where the form should live (Pages → Add New, or edit your existing contact page). Click the + button to open the block inserter, search for “Form,” and insert the Form block. Otter immediately asks which variation you want to start with: Contact Form or Subscribe Form. Pick Contact Form. (Clicking Skip also gives you the contact form, since it’s the default.)
You now have a working form with Name, Email, and Message fields. Technically, you could publish right now. But a quote request deserves better fields, so keep going.
Step 2: Build the quote-request fields
Click any field in the form and the sidebar shows its settings. You can add new fields, reorder them, and edit each one: change the label, hide the label, set a percentage width (handy for putting Name and Email side by side at 50%), add placeholder and help text, and toggle whether the field is required.
For a service-business quote form, a solid field lineup looks like this:
- Name (Text, required) and Email (Email, required): the defaults, keep them.
- Phone (Text, optional): some clients prefer a call back.
- Service needed (Select or Checkbox): your main services as options, so requests arrive pre-sorted.
- Budget range (Select): awkward question, useful answer. 💰
- Preferred start date (Date): separates the “next week” leads from the “someday” ones.
- Project details (Textarea, required): rename the default Message field and you’re done.
Free field types cover text, email, textarea, checkbox, radio, select, number, date, and URL. Hidden fields, file uploads, and Stripe payment fields are Pro-only. Webhooks, which push submissions into other apps in real time, are also part of Otter Pro’s advanced form features.
💡 PRO TIP: If staring at a blank form feels like work, Otter’s AI Form option can generate a starting set of fields from a plain-language prompt (“a quote request form for a landscaping company”). There’s one catch: Otter’s AI features need an AI provider connected, meaning your own OpenAI API key or the WordPress AI connector. No bundled AI credits. Also note that Regenerate replaces the current form rather than saving versions, so keep a result you like before rolling the dice again.
Step 3: Route submissions to the right inbox
Select the whole form and open Form Options in the sidebar. This is where submissions go and what the notification email looks like:
- Email To: defaults to the site admin. Point it at the inbox that actually answers quotes.
- Email Subject: something scannable like “New quote request: landscaping.”
- CC and BCC: loop in a colleague or a shared sales address.
- From Name: the sender name on the notification.
- Reply-To Email: leave this empty and replies to the notification go straight to the address the visitor typed in. For a quote workflow, that little default saves real time. ✉️
Two reassuring details. First, every valid submission is saved to the database before the email goes out, so a grumpy mail server can’t silently eat a lead. Second, you can review all submissions (including any delivery errors) under Otter Blocks → Submissions in the dashboard, and viewing them is free. Exporting submissions is an Otter Pro feature.
💡 PRO TIP: Building a subscribe-style form instead? Otter has marketing integrations for Mailchimp and Brevo, so new signups can flow straight into your mailing list.
Step 4: Turn on spam protection 🛡️
Public forms attract bots the way picnics attract wasps. Otter handles this with a dedicated Captcha block that sits inside the form: click the + button within the form, search for “Captcha,” and add it. Then pick a provider, either Google reCAPTCHA or Cloudflare Turnstile, and paste in the matching site key and secret key. You can enter the keys directly in the Captcha block or centrally under Otter → Settings → Integrations. hCaptcha works too, through its own integration.
One gotcha worth knowing: the captcha only appears on the published form once the provider’s keys are saved. If the live form looks exactly the same before and after you add the block, missing keys are the usual suspect. 🆘
Step 5: Set up the autoresponder
An autoresponder is the “got it, talk soon” email the visitor receives after submitting. In the free version, you can customize the subject and body of that message in Form Options, so write something warm, set expectations (“replies within one business day”), and you’re set.
Otter Pro adds Reply with AI to the autoresponder: instead of one static message, it generates a personalized reply for each submission. You write a prompt describing the reply you want, insert the visitor’s actual answers with magic tags, and set a static fallback message on a separate tab for the moments an AI reply can’t be generated. It’s a nice touch for quote requests, since the confirmation can reference the service the person asked about.
Otter Pro starts at $69 per year for a single site at introductory pricing ($139 list, renewals at full price), with a 30-day money-back guarantee. The Otter pricing page has the full plan breakdown.
Step 6: Style the form and publish
The Style tab handles the looks: colors for labels, input text, and backgrounds, submit button styles for normal and hover states, label sizing and spacing, field padding, and border radius. If you’ve configured Otter’s global defaults, the form can inherit those colors so it matches the rest of the site without extra fiddling.
Before hitting publish, two finishing touches:
- Submit messages: enable them from the Form Options three-dots menu and write a friendly success message (“Thanks! Your quote request is in.”) plus an error message for server hiccups.
- Redirect on Submit: optionally send visitors to a thank-you page after submission. Useful if you track conversions.
Publish the page, then send yourself a real test submission. Check that the notification email arrived, the autoresponder landed, and the entry shows up under Otter Blocks → Submissions. Here’s the kind of finished form visitors will see (this example from the Otter docs includes the Pro-only file upload field at the bottom):
Done and done. 🎉
When a dedicated form plugin is the better tool
Otter’s Form block covers contact forms, quote requests, and subscribe forms well. It’s not trying to replace the heavyweights, and pretending otherwise would be a disservice. A dedicated form plugin earns its install when you need:
- Conditional logic: showing or hiding fields based on earlier answers (“if they pick Wedding, ask for the venue”). Otter’s form fields don’t do this.
- Multi-step forms that split long applications across pages.
- Calculations: instant price estimates that update as the visitor fills the form in.
- Serious entry management: Otter stores every submission and lets you view them free, which covers most small businesses, but exporting entries requires Pro. If your workflow lives in exported spreadsheets, a form plugin with free export (or built-in reporting) fits better.
- Polls, surveys, and quizzes with results analysis.
If that list describes your needs, look at WPForms or Fluent Forms, both built specifically for complex forms. For everything simpler, one less plugin is one less thing to break on a Tuesday. 😅
Wrapping up
The whole build, in recap form:
- Install the free Otter Blocks plugin and insert the Form block (Contact Form variation).
- Shape the fields around what a quote request actually needs: service, budget, timing, details.
- Point submissions at the right inbox and leave Reply-To empty for easy follow-ups.
- Drop in the Captcha block so bots bounce off.
- Write an autoresponder (Pro can personalize it with AI).
- Style it to match the site, test a real submission, publish.
The bottom line: for a service business that needs a clean quote-request or contact form, Otter’s Form block does the job without adding a dedicated form plugin to the maintenance pile. For conditional logic, multi-step flows, or calculations, a purpose-built form plugin is worth the extra install.
Once the form is live, Otter can keep earning its keep elsewhere on the site: there’s a slider block for showcasing work and even a live search feature if the site grows into one. What kind of form are you building first? Drop it in the comments section below! 👇
FREE GUIDE
4 Essential Steps to Speed Up Your WordPress Website
Follow the simple steps in our 4-part mini series and reduce your loading times by 50-80%. 🚀
