Square Online
Install the Yaplet chat widget on a Square Online site from the Tracking Tools settings in the Square Dashboard. No app and no coding.
Overview
Square Online lets you add your own code to every page of a site from the Square Dashboard. Adding the Yaplet code there and publishing the site puts the chat widget on the whole site. No app 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 Other website. Copy the code with the copy button on the code block.
The browser runs the code as a script only if it sits between a <script> line and a </script> line. With Other website chosen, the code already has these lines. If the tab didn't ask, the code is plain JavaScript that starts with !function (Yaplet, and you add the lines when you paste it.
Open Tracking Tools in Square
Sign in to your Square Dashboard and go to Channels → Square Online. Then select Settings → Tracking Tools.
Add the Yaplet code
Select Add new code and, in the pop-up window, enter a name (for example Yaplet chat). Paste the Yaplet code into the code field. It 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.
For the placement, select End of body, then select Save.
Publish your site
The code goes live only after you publish. Go to Website → Editor and click Publish. In the confirmation pop-up, click the link to your live site: Square confirms a newly published version only after it has been opened in a browser once.
Check your site
Reload your live site. The Yaplet chat button appears in the bottom-right corner. Click it to check that the chat opens.
Troubleshooting
- The site wasn't published after adding the code — publish it from the editor and open the link in the confirmation pop-up.
- The code shows up as text at the bottom of the pages — the
<script>tags are missing. Edit the code in Tracking Tools, put<script>on a new line before it and</script>on a new line after it, save, and publish again. - The code was added as an Embed code section — Embed code sections show content inside one section of one page, like a calendar. Delete that section and add the code in Tracking Tools instead, so it runs on every page.
- Code can't be added in Tracking Tools — outside the United States, check that the plan is Plus or Premium.
- The browser shows an old copy of the page — reload, or open the site in a private browser window.