Collect client feedback on a Squarespace site

Paste one line into the site’s footer code injection and your client can click anything on the site and leave a note. It works on version 7.1 and on 7.0 templates.

<script src="https://YOUR-ADDRESS.clicknote.io/l.js" data-project="PROJECT_ID" async></script>

Copy the real one from the project’s Install and settings page in your dashboard: it already has your address and the project’s id in it.

Add it to the whole site

1. In the site’s main menu open Website, then Pages.
2. At the bottom of the Pages panel click Custom Code, then Code Injection. On a version 7.0 site the same options are under Website Tools.
3. Paste the snippet into the Footer box. Squarespace adds it before the closing </body> tag on every page.
4. Click Save.

Feedback before launch

A site that is not public yet needs a site-wide password before anyone else can see it: set one under Site Availability, Password Protected, and give it to your client with the review link. Squarespace does not run injected code on the password screen itself, so ask your client to enter the password first and then open the review link.

Use the site’s built-in squarespace.com address as the project’s site in ClickNote until its own domain is connected, then add the domain under Other addresses of the same site on the project’s Install and settings page.

Where it runs, and where it does not

• The site as a visitor sees it: yes, on every page.
• While you are logged in to Squarespace: the editor can switch scripts off in its preview. To see the site with ClickNote on it, open it in a private window.
• Checkout pages: no. Squarespace does not allow added code there.
• Version 7.0 templates that load pages without a full reload (the Brine family and a few others): yes. ClickNote follows the change of page by itself.

What each note tells you on Squarespace

• The version (7.1 or 7.0) and the page, by Squarespace’s own id.
• Which section of the page the element is in, counted from the top, such as “section 2 of 5”. Squarespace’s editor does not show ids, so position is how you find it there.
• The kind of block: text, image, button and so on.
• The section and block ids, for when you are writing custom CSS.

Check it works

1. Open the project in your ClickNote dashboard, go to Review link and people and press Copy review link.
2. Open the link. You land on the site and are asked to confirm your email.
3. Click any element and write a note. It appears on the project’s Notes page in your dashboard.