Embed widget on your existing site

Most tradies already have a website, even if it's been sitting there since 2017 and the photos are blurry. Adding a Karven embed widget turns that existing site into a quote-capture machine without rebuilding it.

What the widget does

A small iframe-based form that lives on any HTML page. Customers fill it in, the lead lands in your Karven inbox with all the context, and Karven either auto-generates a draft quote (if the trade is set up for it) or sits in the inbox for you to action.

Form fields are configurable. The minimum is name, mobile, and a "tell me about the job" text box. You can add fields for the trade, the suburb, and any custom questions that help you triage faster.

Installing it

Settings → Growth → Embed widget → Get code.

You get two lines of HTML:

<div id="karven-embed"></div>
<script src="https://karven.com.au/embed/v1.js" data-handle="your-handle"></script>

Paste those into your existing website's HTML wherever you want the form to appear. That's it. No build step, no framework dependency, no theme conflict.

The widget is fully isolated in an iframe so it can't break your site's styles and your site's styles can't break the widget.

Customising the look

Settings → Growth → Embed widget → Theme.

Pick:

• Light or dark: match your site's overall palette.
• Accent colour: for the button and focus states. Karven defaults to the safety-orange used on the main site, but use your brand colour if you have one.
• Border radius: sharp, rounded, or pill-shaped buttons.
• Font: system stack by default; you can specify a Google Font.

Changes preview in real time. Once saved, they apply to the live embed within ~5 minutes (cached).

Fields you can add or remove

Default fields:

• Name (required)
• Mobile (required)
• Email (optional)
• Job description (required, multi-line)

Configurable fields:

• Suburb / postcode
• Trade (if you offer multiple), dropdown
• "When are you looking to start", date or dropdown ("ASAP / 1-4 weeks / 1-3 months / Just researching")
• "Budget", optional, dropdown of ranges. Use with care; some customers feel uncomfortable revealing this upfront.
• Custom, any free-form field with a label you set.

Add fields under Settings → Growth → Embed widget → Form fields.

Multiple widgets per site

If you've got service pages on your site (e.g. one page for decking, one for fencing, one for landscaping), you can embed a different pre-configured widget on each, with the trade dropdown pre-filled so the customer doesn't have to pick.

Generate trade-specific embed codes from Settings → Growth → Embed widget → Per-trade codes.

Tracking

The widget submission includes the URL of the page it was submitted from. So if you've got widgets on five different pages, you can see which page is generating the most leads.

This lands in your Karven inbox metadata and surfaces in Reports → Lead sources.

Spam protection

The widget includes:

• An invisible honeypot field that bots fill in but humans don't (rejection on submit).
• A rate limit per IP (5 submissions per hour).
• Optional reCAPTCHA for sites that are seeing heavy spam.

For most trades, the honeypot + rate limit is enough. If you start seeing spam, turn on reCAPTCHA from settings.

What happens after submission

1. Customer sees a "Thanks, we'll be in touch within 24 hours" confirmation.
2. You get an SMS and email notification.
3. The lead appears in your Karven inbox under Quotes → New requests.
4. If you've configured auto-acknowledgement, the customer gets an SMS back within 30 seconds with a personal touch ("Cheers, we'll text you in the morning with a time").
5. You open the lead in Karven, generate a quote (the calculator pre-fills based on what they wrote), send.

Working with WordPress

The widget works on WordPress out of the box. Just paste the two lines into a Custom HTML block (Gutenberg) or use the Karven for WordPress plugin for slightly richer integration, pre-filling fields from the WP user context, syncing to Karven's customer record.

Working with Squarespace, Wix, Webflow

All work. Each has a "Custom HTML" or "Embed" block, paste the code in.

For Webflow specifically, place the script in your before </body> custom code area (Project settings → Custom code) and the <div> wherever you want the form. Squarespace and Wix want both in the same block.

Mobile responsive

The widget is responsive by default. On mobile it stacks fields, on tablet it uses a 2-col layout, on desktop it uses your configured layout (single column or 2-column).

If your site is already mobile-responsive (it should be), the widget will adapt to whatever width its container provides.

Disabling

Remove the two lines of HTML from your site. The widget stops appearing immediately. Anyone who'd already opened your page can still submit (the form is loaded), but no new visitors see it.

If you want a soft disable, accept submissions but pause notifications, use Settings → Growth → Embed widget → Pause inbound in Karven instead.

A common gotcha

Don't embed the widget twice on the same page. The script handles it gracefully (you'll see two forms) but submissions get attributed weirdly. One widget per page is the rule.