📖 Verystep Guides

How to Embed a Verystep Tool on Squarespace (Code Block, Core Plan or Higher)

The Code Block takes the snippet — but only if your plan lets code run.

Published November 4, 2026 · A Verystep guide

Illustration: a precise grid of thin-lined rectangles with one framed widget card in the centre cell

On Squarespace you embed a Verystep tool by pasting its snippet into a Code Block set to HTML. The catch is the plan: iframe code in a Code Block is a premium feature that needs the Core plan or higher. On the Basic plan the block accepts your code and displays it as text — the tool never runs. Upgrade aside, the steps themselves take two minutes.

First, check your plan

Squarespace lists “JavaScript and iframes in Code Blocks” among its premium features, available on Core, Plus and Advanced (and the older Business and Commerce tiers). On Basic, a Code Block still exists — it just won’t execute iframe code; visitors see the raw snippet printed on the page, or nothing useful at all. If you are on Basic and the embed matters, the plan is the blocker, not the code. The embed overview keeps the full list of platforms and their gates in one place.

Step by step (Core plan or higher)

  1. Open the tool and copy its embed code — the example below is the Random Password Generator.
  2. Edit the Squarespace page, click an insert point, and add a Code Block.
  3. Make sure the block’s mode is HTML (not CSS or Markdown) and paste the snippet.
  4. Apply, then save the page and view it as a visitor — Squarespace sometimes shows code blocks differently inside the editor.
  5. If the frame looks short, raise the height value in the snippet (520 is the default) in steps of 40.

Worked example

The exact snippet from the password generator’s embed box:

<iframe src="https://verystep.com/embed/password/" title="Random Password Generator" width="100%" height="520" loading="lazy" style="border:0"></iframe>

Paste it exactly as copied. Squarespace’s editor occasionally “helps” by reformatting long lines; if the preview breaks, delete the block and paste again rather than patching it by hand.

If something looks wrong

Visitors see the code itself as text. Classic Basic-plan behaviour — the block stored your snippet but your plan does not run iframes. Either upgrade to Core or swap the embed for a link to the tool.

The frame renders but is blank. Check the block is in HTML mode and that the src still begins with https://. A snippet pasted into a Markdown block will also misbehave quietly.

The tool is cut off at the bottom. Raise the height in the snippet; password-type tools with several options often want 560–620 on narrow columns.

Keep going

Other builders, same idea: Wix uses an HTML iFrame element with no plan gate, Webflow has its own paid-plan wrinkle, and Shopify takes the code through Custom Liquid.

The example on this page, live

The worked example below embeds the Verystep Random Password Generator — handy if your site covers security basics. Its embed box sits under the FAQs, like every tool page here.

Open the Random Password Generator →

Frequently asked questions

Which Squarespace plan do I need to embed a tool?

Core or higher (Plus, Advanced, or legacy Business/Commerce). Squarespace classifies iframe and JavaScript code in Code Blocks as a premium feature; on the Basic plan the snippet displays as text instead of running.

Why does my Code Block show the raw snippet on the page?

That is the Basic-plan limitation, not a typo in your code. The block saved the HTML but your plan does not execute iframes, so visitors see the text of the snippet itself.

Should I use the Embed Block instead of the Code Block?

The Embed Block is for services Squarespace recognises from a URL. A Verystep tool is a raw iframe, so the Code Block in HTML mode is the reliable route.

How do I make the embedded tool taller?

Raise the height number in the snippet — start from 520 and add 40 at a time until the full tool fits your column.

More guides