Squarespace
Install the Yaplet chat widget on a Squarespace site with Code Injection. Needs the Core, Plus or Advanced plan, or an older Business or Commerce plan.
Overview
Squarespace's Code Injection adds code to every page of a site, and Squarespace names live chat as one of its uses. Pasting the Yaplet code into its Footer field puts the chat widget on the whole site. No extension or developer is needed.
Installation Steps
Copy your Yaplet code
In your Yaplet dashboard, go to Brand → Chat widget and open the Install tab. If the tab asks where your website runs, choose Squarespace. Copy the code with the copy button on the code block.
Squarespace asks for JavaScript to be wrapped in <script> tags, so the code you paste must have them.
Open Code Injection
In your Squarespace site, open the Pages panel. At the bottom of the panel, click Custom Code, then Code Injection. On a version 7.0 site, click Website Tools at the bottom of the panel instead, then Code Injection.
Paste the code into the Footer field
Paste the code into the Footer field. The code you paste must start with a <script> line and end with a </script> line; if what you copied starts with !function (Yaplet instead, type <script> on a new line before it and </script> on a new line after it. Code in this field goes just before the end of every page.
<script>
!function (Yaplet, t, i) { … your Yaplet code … }();
</script>
Click Save.
Check your site
Open your site in a private (incognito) browser window and reload it. While you edit, Squarespace can switch custom code off in its preview, so a private window shows what visitors see. The Yaplet chat button appears in the bottom-right corner. Click it to check that the chat opens.
Troubleshooting
- The code shows up as text on the site — the
<script>tags are missing. Add them in the Footer field and save. - There is no Code Injection — the plan doesn't include it. Code Injection needs the Core plan or higher.
- The chat doesn't show while you edit — if Squarespace says "Scripts have been disabled on your site preview", custom code is off in the editor only. Open the site in a private window.
- The chat is missing on the checkout page — expected: Squarespace doesn't run custom code on checkout pages.
- The site is on version 7.0 with Ajax loading on — Squarespace says Ajax loading can conflict with custom code. If the chat behaves oddly, try switching Ajax loading off.
- You still see the old version of the site — reload without the browser cache, or open the site in a private window.