Skip to content

How to add Instaquote to your Squarespace site

This guide adds the Instaquote chat bubble to every page of your Squarespace site using Code Injection. Three steps: copy your code, paste it once in the site-wide footer, and add your website's address to your Sites list.

What you need:

  • Your Instaquote console login
  • Admin access to your Squarespace site
  • A Core, Plus or Advanced plan (see below)

There's also an inline version of the code for a single page, but this guide uses the floating bubble, pasted once for the whole site.


Before you start: check your Squarespace plan

Code Injection needs a Core, Plus or Advanced plan (or some older plans). The Basic plan won't work. If you're on Basic, you'll need to change plans first.

Use Code Injection, not a Code Block. A Code Block only puts code on one page, and the chat needs to be site-wide.


Step 1: Copy your Instaquote code

  1. Log in to your Instaquote console.
  2. Go to Install & origins.
  3. Under How should it show on your site?, leave Chat bubble (recommended) selected.
  4. Click Copy code.

Your code is two short pieces: a <div> and a <script>. Paste it exactly as copied. Don't edit it. It looks something like this:

HTML
<div id="instaquote" data-firm-id="YOUR_FIRM_ID" data-api-url="https://api.instaquoteai.app" data-mode="chat" data-locale="en-AU" data-environment="production" data-firm-name="Your Business" data-embed="bubble"></div>
<script src="https://widget.instaquoteai.app/v1/widget.js" defer></script>

Don't type it out. Your own code has your business details in it, so always use Copy code.


Step 2: Paste it into Code Injection (Footer)

  1. Log in to Squarespace and open your site.
  2. Go to Website > Website Tools > Code Injection.
  3. Paste your Instaquote code into the Footer box. Leave the Header box alone.
  4. Click Save.

That's it. Because it's in the Footer, it runs on every page. You only paste it once.

Why the Footer and not the Header? The chat bubble expects its code at the end of the page. The Header box loads code at the top, which isn't where it belongs. Leave the Header box as it is, including anything already in it for other tools.

Already got other code in the Footer box? That's fine. Paste the Instaquote code on a new line after what's there. Don't delete the existing code.


Step 3: Add your site to the Sites list

  1. In your Instaquote console, go to Install & origins.
  2. Check the Sites list has your site's address, exactly as people visit it (for example https://www.yourbusiness.com.au).
  3. If it's missing, go to Add a site, type the full address and click Add site.

Remember:

  • www and non-www are separate sites. If both work, add both.
  • Include the https://.
  • Each subdomain needs its own entry.

New sites can take up to a minute to start working.


Check it's working

The chat won't show in the Squarespace editor. Check your live site instead.

  1. Wait about a minute after saving.
  2. Open your live site in a private window (Incognito in Chrome, Private in Safari).
  3. Look for the chat bubble in the bottom-right corner.
  4. Click it and ask a test question, like "How much to hang a new internal door?"

What your customers see

Once it's live, visitors see a small chat bubble in the bottom-right corner of every page. They can ask about a job, add a photo, and get a quote from your own prices. If they're happy, they accept the quote and pick an arrival window, and you get a booking request to approve.


Troubleshooting

The bubble isn't showing

  • Are you looking in the editor? Check the live site in a private window.
  • Is your plan Core, Plus or Advanced (or an older plan that allows Code Injection)? Basic won't work.
  • Is the code in the Footer box of Code Injection, not the Header and not a Code Block?
  • Is your site's exact address on the Sites list? If it shows as Being blocked, click Add this site, wait a minute and reload.

The chat shows twice

The code's on your site more than once. Check Code Injection and any page-level code, and remove the extra copy.

The chat sits in the page, not the corner

You've got the inline version. In the console, pick Chat bubble (recommended), click Copy code, and replace the code in your Footer box with the new code.

Still stuck? Book a free 15-minute setup call and we'll walk through it with you.


Next steps

Your next job is already asking. Book a free 15-minute setup call