Squarespace · self-serve embed

Tóg widgets on Squarespace — no app, no developer.

Paste the official Tóg embed snippet and your tools appear on your Squarespace site — AI Chat site-wide via Code Injection, the inline widgets via a Code Block. You subscribe and manage everything in your Tóg account; your own origin-bound publishable key lives in your site HTML. Nothing is stored with Tóg.

No secret keysOrigin-bound & safeNothing stored with Tóg
How it works on Squarespace

Two ways to paste — pick by where the widget lives.

Squarespace has no Tóg app and no OAuth, so you embed the official Tóg loader yourself. There are exactly two places it goes, and the rule is simple: floating goes site-wide, inline goes on the page.

Floating · site-wide
Code Injection → Footer

For AI Chat, which floats in the corner of every page. Settings → Advanced → Code Injection, drop the one <script> into the Footer, Save. No mount element needed. (Business plan or higher.)

Inline · on the page
Code Block on a page

For the six inline widgets. Add Block → Code, and paste the <script> loader and its <div data-tog-mount> together, on exactly the page where you want it. The mount must sit beside its script.

Every widget renders inside an isolated Shadow DOM, so it never clashes with your template. Your publishable key is origin-bound and public-safe — it is not a secret — and nothing is stored with Tóg.

What you can switch on

Seven widgets, one tiny script.

The same Tóg loader powers all seven. AI Chat floats site-wide; the other six render inline wherever you place a Code Block. Swap the data-tog-plugin id to choose.

Floating
AI Chat

A friendly, on-brand AI assistant that floats in the corner of every page, answers visitor questions and hands off to your team.

data-tog-plugin="ai-chat"
Inline
Loyalty

Customers join your rewards programme, see their balance and tier, redeem rewards and share a referral link.

data-tog-plugin="loyalty"
Inline
Bookings

Pick a service, see live availability, and book or cancel — right on your page.

data-tog-plugin="bookings"
Inline
Reviews

Show your rating and recent reviews, and let happy customers leave one.

data-tog-plugin="reviews"
Inline
Lead Capture

A custom-field lead form that grows your list and feeds your Tóg account.

data-tog-plugin="capture"
Inline
Boost Offers

Surface promotions and deals — an upsell / cross-sell offers widget that converts.

data-tog-plugin="boost"
Inline
Contact Desk

An inline contact form that feeds your unified Tóg inbox.

data-tog-plugin="desk"
Set it up

Live in five steps — copy, paste, done.

Get your two values, paste each snippet where it belongs, allow-list your origin, and verify. No build tools, no developer.

  1. Get your two values from Tóg

    In your Tóg account mint a publishable key under Developers (it starts pk_ and is shown once), and copy your site id (the data-tog-site value on your integration's Embed snippet, under Integrations and on Sites).

  2. Add AI Chat site-wide via Code Injection

    In Squarespace go to Settings → Advanced → Code Injection, paste the AI Chat <script> into the Footer box, and Save. It floats in the corner of every page and needs no mount element. (Code Injection requires a Business plan or higher.)

  3. Add inline widgets via a Code Block

    On the page where you want a widget, click Add Block → Code and paste both lines together — the <script> loader and its <div data-tog-mount>. Leave any “Display Source” toggle off, then Save the page.

  4. Allow-list your site origin

    In your Tóg account open Sites → your site → Allowed origins and add your live origin (scheme + host, e.g. https://www.yourbrand.com) — and, while you test, your *.squarespace.com preview origin. The gateway only accepts your key from origins you authorise.

  5. Verify on your live site

    Open your site (or the Squarespace preview): the AI Chat bubble appears bottom-right and opens when clicked, and each inline widget renders exactly where you placed its Code Block. Manage everything — content, plans, replies — from your Tóg account.

The snippets

Copy a snippet, swap two values, paste.

Replace pk_live_YOUR_PUBLISHABLE_KEY with your publishable key and YOUR_SITE_ID with your site id. These are the exact placeholders — never paste a real or secret key here.

AI Chat · floating
Code Injection → Footer (site-wide). No mount element.
<script src="https://app.togs.ie/embed.js" data-tog-key="pk_live_YOUR_PUBLISHABLE_KEY" data-tog-plugin="ai-chat" data-tog-site="YOUR_SITE_ID" defer></script>
Inline widget · e.g. Reviews
Code Block on the page — keep the script and its mount together.
<script src="https://app.togs.ie/embed.js" data-tog-key="pk_live_YOUR_PUBLISHABLE_KEY" data-tog-plugin="reviews" data-tog-site="YOUR_SITE_ID" defer></script>
<div data-tog-mount="reviews"></div>

For the other inline widgets, swap data-tog-plugin and the matching data-tog-mount for the id you want — loyalty, bookings, reviews, capture, boost or desk. Place only one mount per widget per page.

Good to know

Keys, plans & troubleshooting.

Is it safe to put my key in my site HTML?
Yes. A Tóg publishable key (pk_…) is origin-bound: the gateway only accepts it from the site origin(s) you authorise under Sites → Allowed origins. It is public-safe by design — it is not a secret. Never paste a secret key (sk_…) into Code Injection; that would expose it in your page source.
Do I need a Squarespace app or a developer?
Neither. There is no Tóg app to install on Squarespace — you paste the official Tóg loader snippet yourself: site-wide via Code Injection for AI Chat, or a Code Block on a page for an inline widget. No code beyond copy-and-paste.
Where does my data live? Is anything stored with Squarespace?
Nothing is stored with Tóg by the snippet itself — your publishable key simply lives in your own Squarespace HTML. All widget behaviour, networking and data handling are performed by the Tóg loader and gateway, governed by Tóg Studio's terms and privacy policy. You subscribe to and manage the tools in your Tóg account.
Will the widgets clash with my Squarespace template?
No. The loader renders each widget inside an isolated Shadow DOM, so it never collides with your template's CSS or scripts. Drop it in and it stays on brand and self-contained.
I see a 401 / 403 in the console — what&apos;s wrong?
Your site's origin isn't in the allow-list yet. Open Sites → your site → Allowed origins in your Tóg account and add your live origin (and the *.squarespace.com preview origin while testing), exactly — scheme + host.
An inline widget is floating instead of sitting inline — why?
Its <script> ran without its mount. An inline loader that finds no matching <div data-tog-mount> falls back to a fixed floating panel — always keep the script and its mount together in the same Code Block, and don't put an inline widget's script in the site-wide footer.
I don&apos;t have Code Injection — what now?
Code Injection needs a Squarespace Business plan or higher. Code Blocks are available on most plans, so you can still place the inline widgets that way. (AI Chat is the only widget that wants site-wide injection.)
Your tools, on your Squarespace site

Embed your Tóg widgets today.

Subscribe and manage your tools in your Tóg account, copy your snippet, and paste it into Squarespace. Keys stay origin-bound, your data stays yours, and it's live in minutes.