Squarespace install guideAdd your instant price calculator to Squarespace

Before you start

• Code Injection and code with JavaScript need a Core, Plus or Advanced plan (Business or Commerce on older billing). On Basic or Personal, use your price link as a button instead.
• You need to be the site owner or an administrator.
• Your code from the Share page, copied.

The 3 steps

1. In Squarespace open Pages → Website Tools → Code Injection.

   In the left menu click Pages, scroll down to Website Tools and open Code Injection. (Older sites: Settings → Advanced → Code Injection.)

   install-squarespace-injection16:10

   Squarespace: Website Tools → Code Injection

   image1600×1000

2. Paste the code below into the Footer box and click Save.

   There are two boxes, Header and Footer. Paste your code into Footer and click Save.

   install-squarespace-footer16:10

   Squarespace: paste in Footer

   image1600×1000

3. Open your site in a private window (code doesn’t always run while you’re logged in): the button shows bottom right.

   Squarespace doesn’t always run added code while you’re logged in. Open your site in a private window (or log out): the “Instant price” button shows bottom right.

Your code

Copy it from your Share page: it has your calculator’s name filled in where this example says your-calculator. Paste it exactly as it is, in one piece.

<script async src="https://w.pricemywash.com/loader.js" data-widget="your-calculator" data-mode="button"></script>

<div data-pricemywash="your-calculator"></div><script async src="https://w.pricemywash.com/loader.js"></script>

Show it inside a page

1. Edit the page (like “Get a quote”), click Add block (or +) where you want it and choose Code.
2. Click the pencil on the block, paste the inside a page code from your Share page and save.
3. Check it logged out: code blocks show a placeholder in the editor. They may not show inside an Index page.

If it doesn’t show up

• You see an error in the editor preview. That’s normal for added code: turn on Disable Scripts in Preview in Code Injection. It only affects the editor.
• Open the live site, not the editor. Most builders don’t run added code in their editor or preview. Open your real address in a private window.
• Button and inline on the same page? Use one way per page. The floating button hides itself on a page that already shows the calculator inside it.
• The button covers a chat bubble or a bar. It moves above cookie and chat bars by itself. If it still sits on top of something, add data-position="left" (bottom left) or data-offset="80" (80 px higher, up to 200). The Share page has these under “If the button covers something”.
• Your web person set a strict security policy (CSP). Ask them to allow w.pricemywash.com in script-src and frame-src.
• Check it worked: the Share page shows Live on your-site.com within a minute of someone opening the page, or press Check install.

Stuck? Use the hosted link instead

Your calculator also lives on its own page, pricemywash.com/q/your-name. Any site builder can link to it: add a menu item or button called “Instant price” that opens that address. It works the same on your Google Business Profile, your Facebook page and as a QR code on door hangers. Copy it, or download the QR, on your Share page.