Website quote widget
Install Handlet's embeddable quote widget on your website and verify it is working.
The website quote widget lets visitors request a quote from your own site. Submissions arrive in Handlet with the same quote workflow as your inbox.
Open Quote Widget in the menu. The Get it on your website card at the top walks you through these steps in order and names the next one.
Before you start
- You need owner or admin access to the Handlet workspace.
- Decide what visitors get on What visitors get: collect details only, prices from your price list, or instant estimates from past jobs (Pro).
- Any option you can't use yet says why, with a link to fix it.
Your website
The widget only loads on the websites you add. This is an extra guard against casual misuse — your embed key and rate limits still protect the public API.
Add the exact host visitors see in the browser, for example:
example.comfor your live sitewww.example.comif that is the canonical host*.example.comto allow all subdomains
Sandbox and preview hosts
Online editors render your iframe from a preview host that differs from the editor URL. Add the preview host too:
| Platform | Editor host | Preview host to allow |
|---|---|---|
| CodePen | codepen.io | cdpn.io |
| JSFiddle | jsfiddle.net | fiddle.jshell.net |
Handlet detects the embedding host from browser signals such as ancestorOrigins and the referrer. If you strip referrers with a strict policy, allow-listing the preview host is still required.
Get your install code
- Open Quote Widget and create a widget if you do not have one yet.
- Open Put it on your website and add your website (above).
- Choose Get your install code and copy the code straight away. Handlet stores only a hash, so it shows the code once.
- If the code is already on your website, there is nothing more to do. If you lose it, Get a new install code makes a new one and the old one stops working, so paste the new code everywhere the widget is.
In the page or a floating button
Under How it shows on your website, choose before you copy the code:
- In the page: the form sits where you paste the code, for example on a "Get a quote" page.
- Floating button: a button in the bottom corner of every page that opens the form in a panel. Change its wording under Button text. Paste it once into a part of your site that appears on every page, such as the footer. It needs no script, and the form loads only when a visitor opens it.
Paste the code and switch it on
- Paste the install code into your page where the form should appear, or into your footer for the floating button.
- Switch the widget on under Switch it on. It takes effect straight away; there is nothing to save.
WordPress
- Custom HTML block: Add a Custom HTML block to your page and paste the snippet.
- Theme template: Paste the snippet into a page template or a reusable block. Avoid putting it inside a restrictive sandboxed iframe.
Squarespace
- Edit the page.
- Add a Code block.
- Paste the iframe snippet and save.
Wix
- Add an Embed HTML element.
- Paste the snippet.
- Publish the site and test on the live URL (not only the editor preview).
The code includes your widget's install key. Keep it out of public screenshots and support tickets.
Verify installation
After the code is live, open the page on your website. The Test it step shows when Handlet first saw the widget there.
If it does not update, refresh the Quote Widget page after loading your page once.
Send a test submission
Send the form once as a visitor would. The request appears in your inbox and Test it is ticked.
Replacing or turning off a code
- Get a new install code when the code may have been shared with someone who should not have it, or an agency handoff ends. The old code stops working at once.
- Turn this code off stops the widget wherever the code is pasted.
- You can set a widget up before it goes live; switch it on once your website is added and the code is on the page.