This guide walks you through creating a Contact Form in QuoteIQ and embedding it on your website. You can build a form in about 2 minutes, then embed it in three different ways depending on how you want it to appear on your site.
Available on: Pro ($149.99/mo), Elite ($299/mo), and Max ($699/mo) plans.
For a high-level overview of the Contact Forms feature, see Contact Forms — Capture Leads from Your Website.
Step 1: Open Contact Forms
In QuoteIQ, go to Settings → Form Submissions V2. This opens the Contact Forms dashboard.
The settings menu item is labeled "Form Submissions V2," but the feature itself is called Contact Forms. Both refer to the same thing.
Step 2: Create a New Form
From the Contact Forms dashboard, tap the + button in the top-right to create a new form. You'll be taken to a 3-tab editor: Details, Fields, and Settings.
Details Tab
This is where you set up the basics of the form:
Form Name (required) — Internal name for the form, e.g. "Quote Request Form" or "General Contact."
Description — Optional internal description.
Channel (required) — Which channel new submissions will be routed to. Pick from your existing channels (Email, Phone, Referral, Walk-in, Website, or any custom channels you've created).
Form Type — Choose Single Page (all fields on one screen — best for short forms) or Multi-Step (fields split into multiple steps — improves completion rates on longer forms).
Fields Tab
This is where you add and configure form fields. The left sidebar shows all available field types, organized into three groups:
Basic
Short Text — Single-line text input (names, titles, etc.)
Long Text — Multi-line textarea (messages, descriptions)
Email — Email address with validation
Phone — Phone number with formatting
Number — Numeric input only
Choice
Dropdown — Single-select dropdown menu
Radio — Single-select radio buttons
Checkboxes — Multi-select checkboxes
Special
Address — Full street address with city, state, zip
Date — Date picker
Section Header — Visual divider with heading text (helps organize long forms)
Click the + next to any field type to add it to your form. Drag fields by the handle on the left to reorder. Click any field to configure its label, placeholder text, required/optional status, and other settings.
Settings Tab
This is where you customize what happens after submission and how the form looks.
Form Layout
Multi-step form toggle — Organize fields into multiple steps. Use this on longer forms to keep them from feeling overwhelming.
After Submission
Choose what the submitter sees after they hit Send. Default is "Show thank-you message."
Headline — Top line of the thank-you screen (e.g. "Thank you!").
Message — Sub-message (e.g. "We'll be in touch within 24 hours.").
Notifications
Push notification on new submission — Toggle on to get a push notification the moment a new lead comes through this form.
Appearance
Theme — Pick from four built-in themes: Modern (deep navy), Minimal (gradient gray), Soft (warm orange), or Glass (light blue / translucent).
Appearance Mode — Light, Dark, or System (follows the visitor's OS setting).
Primary Color — Override the theme's accent color with your brand color. Enter any hex code (e.g. #1A2B55).
Tap Save in the top-right to save your form.
Form Templates (Save Time on Setup)
When creating a new form, you can pick from pre-built templates instead of starting from blank:
Quote Request — Standard contractor lead form (name, contact info, service requested, project details)
Appointment — Booking-style form with date selection
Job Application — Employee application form
Templates pre-populate field structure — you can still customize labels, add fields, remove fields, and change settings before saving.
Step 3: Embed Your Form on Your Website
Open the form you just made and tap the share icon (the </> icon in the top-right), or go to Quick Links → How to Integrate from the Contact Forms dashboard.
You'll see three embed options:
Option 1: Inline Widget (Embedded in Page)
The form embeds directly into your page content — visitors see it inline as they scroll.
Best for: "Contact Us" or "Request a Quote" pages
Setup: Two lines of HTML — works in any CMS
Embeds the form directly in your page content
Copy the snippet and paste it into your page HTML or your CMS's "Custom HTML" block at the spot where you want the form to appear.
Option 2: Popup Widget (Floating Button)
A floating button sits on your site site-wide. When visitors click it, the form opens in a modal.
Best for: Site-wide presence without taking up page space
Setup: Customizable label and brand color
Floating button that opens the form in a modal
Option 3: Direct Link (Shareable URL + QR Code)
A hosted version of the form on a shareable URL. Includes an auto-generated QR code for print and signage.
Best for: Email and SMS campaigns, business cards, yard signs, vehicle wraps, flyers
Setup: Auto-generated QR code for print and signage
No website required — send people directly to the hosted form
Step 4: Paste the Code Into Your Website
Drop the snippet into your page HTML, your CMS's "Custom HTML" block, or your popup builder. Most platforms accept this verbatim:
WordPress — Use the Custom HTML block in the Gutenberg editor, or paste into a Code widget in Elementor or Divi
Squarespace — Add a Code block to your page and paste in
Webflow — Add an Embed element and paste the code
Shopify — Edit the page HTML in the page editor and paste in
Any other CMS — Any HTML-accepting block, widget, or editor works
Publish your page. New leads start landing in your QuoteIQ Submissions inbox immediately.
Test Before Going Live
Every form has a Direct Link tab that gives you a hosted version of the form. Open that URL, submit a test entry, and watch it appear in your Submissions inbox before you embed the form on your live site.
Advanced: API Submissions
Need to post submissions from a custom backend or third-party tool like Zapier or your CRM? Use the Contact Forms API. Go to Quick Links → API Keys → Generate Key in the Contact Forms dashboard. Then POST submissions directly to the QuoteIQ endpoint using your API key.
FAQs
How do I create a Contact Form?
How do I create a Contact Form?
Go to Settings → Form Submissions V2 in QuoteIQ, then tap the + button to create a new form. Fill in Form Name, Description, Channel, and Form Type on the Details tab. Add fields on the Fields tab. Configure the post-submission experience and theme on the Settings tab. Tap Save.
What field types are supported in Contact Forms?
What field types are supported in Contact Forms?
11 field types across three groups: Basic (Short Text, Long Text, Email, Phone, Number), Choice (Dropdown, Radio, Checkboxes), and Special (Address, Date, Section Header).
Can I build multi-step forms?
Can I build multi-step forms?
Yes. On the Details tab, set Form Type to Multi-Step instead of Single Page. Or enable the Multi-step toggle under Form Layout on the Settings tab. Multi-step forms split fields into multiple screens, which usually improves completion rates on longer forms.
What are the three embed methods?
What are the three embed methods?
Inline Widget embeds the form directly in your page content — best for "Contact Us" pages. Popup Widget adds a floating button that opens the form in a modal — best for site-wide presence. Direct Link gives you a shareable URL plus auto-generated QR code — best for email/SMS campaigns or print materials.
Does the form work on WordPress, Squarespace, Webflow, and Shopify?
Does the form work on WordPress, Squarespace, Webflow, and Shopify?
Yes. The embed code is plain HTML that works on any platform that accepts custom HTML. WordPress (Custom HTML block or Elementor/Divi Code widgets), Squarespace (Code block), Webflow (Embed element), and Shopify (page editor HTML) all support it. Any other CMS with an HTML-accepting block works too.
Can I have multiple forms on the same page?
Can I have multiple forms on the same page?
Yes — each inline widget needs its own target div with a unique id. Match the script's data-target attribute to the div's id. The embed code generated for each form already accounts for this.
Will the form match my site's design?
Will the form match my site's design?
Yes. The widget inherits your site's base font and respects the brand color you set in the form's Settings → Primary Color. The four built-in themes (Modern, Minimal, Soft, Glass) plus Light/Dark/System modes give you wide design flexibility. For deeper styling tweaks, the widget exposes CSS classes you can override.
What about spam?
What about spam?
Contact Forms have built-in spam protection — submissions are auto-flagged as spam if they hit a hidden honeypot field. You can also manually mark anything as spam from the Submissions inbox.
Where do form submissions go?
Where do form submissions go?
Every submission lands in your Submissions inbox (assigned to whichever channel you set on the form). From there you can accept it, reject it, or convert it to a customer record with one tap — everything stays in QuoteIQ.
Can I test before going live?
Can I test before going live?
Yes. Open your form and go to the Direct Link tab — that gives you a hosted version of the form. Submit a test entry and confirm it lands in your Submissions inbox before embedding the form on your live site.
Can I change a form's theme or color after it's already embedded on my site?
Can I change a form's theme or color after it's already embedded on my site?
Yes. Theme and color changes are applied through your QuoteIQ form settings — the embedded widget pulls the current settings on every load. Edit the form's Appearance settings, save, and the changes show up on your live site without needing to re-embed.
Which plans include Contact Forms?
Which plans include Contact Forms?
Contact Forms is available on Pro ($149.99/mo), Elite ($299/mo), and Max ($699/mo) plans. Not included on Essentials or Beginner.
Need a hand setting up your first form? Contact us at support@quoteiq.io or text (912) 913-7154.