Embedding in Squarespace

Standard embed

1. Edit the page in Squarespace.
2. Click + to add a section → choose Code (requires Business or Commerce plan).
3. Paste the iframe code from Dashboard → Embed.
4. Make sure Display Source is unchecked.
5. Click Save.

Floating widget

For a site-wide floating button:

1. Go to Settings → Advanced → Code Injection.
2. Paste the floating widget code (from the floating widget guide) into the Footer section.
3. Save.

The floating widget will now appear on every page of your Squarespace site.

Common Squarespace issues

"I don't have a Code block option"

Code blocks require Business or Commerce plan. The Personal plan doesn't include them. If you're on Personal, your options are:

• Upgrade to Business (worth it if you're running a real business site)
• Use a link to your subdomain instead of an embed — paste https://yourname.calcwidgets.com/embed?widgets=loan-repayment&view=single as a button link

"The iframe shows but is the wrong height"

Squarespace doesn't always preserve the inline <script> block that handles auto-resize. Two options:

1. Set a generous fixed height in your iframe code (e.g. height="1200").
2. Put the auto-height <script> block into Settings → Advanced → Code Injection → Header instead of inline with the iframe — that way it's loaded once site-wide and applies to every iframe with id="calcwidgets-frame".

"Display Source" warning

If the Code block shows raw HTML on the live page (instead of rendering the iframe), uncheck the Display Source option in the Code block settings.