Add an AI ring builder to a Squarespace website

#1. Add a Code Block

For an inline ring builder or a popup button on one page:

1. In the page editor, click Edit, then Add Block (or +) where the ring builder should appear and choose Code.
2. Paste the snippet into the block. Leave the mode set to HTML.
3. Click outside the block, then Save.

<div data-showroompro-ring-builder="YOUR_TOKEN"></div>
<script src="https://www.showroompro.ai/embed.js" async></script>

For a popup button instead:

<div data-showroompro-ring-builder="YOUR_TOKEN" data-mode="popup"></div>
<script src="https://www.showroompro.ai/embed.js" async></script>

The editor preview may show a placeholder; the ring builder loads on the live page.

#2. Optional: floating button on every page

1. Go to Settings → Advanced → Code Injection (on newer dashboards: Website → Pages → Custom Code → Code Injection).
2. Paste the snippet into the Footer field and click Save.

<script src="https://www.showroompro.ai/embed.js" data-token="YOUR_TOKEN" data-mode="floating" async></script>

#3. Check it on your site

Open the published page on your real domain while logged out.

#Plan requirements

Squarespace only runs JavaScript in Code Blocks and Code Injection on plans that include custom code (Business and above on older plans, Core and above on newer ones). If your plan removes the script, use the iframe fallback in a Code Block:

<iframe src="https://www.showroompro.ai/embed/quiz?d=YOUR_TOKEN" width="100%" height="800" frameborder="0" style="border:none;"></iframe>