If your embedded calculator renders as a blank or zero-height area, or shows a "Content Unavailable" message, the cause is usually one of three things: the project was never published, your workspace isn't in good standing, or the iframe has no height to fill. This article covers each.
The calculator was never published
The embed code points at your project's live version. If you've never published, there's no live version for the embed to load.
- Open the project in the editor.
- Click Publish in the top-right and complete the publish step.
- Copy a fresh embed snippet from Share → Embed.
Until a project is published, the Share button stays disabled and there's no embed code to copy. See Publishing and Embed on your website.
You see "Content Unavailable"
If the embed loads but shows a centered Content Unavailable message with the prompt "Please contact the host regarding this issue," the published project couldn't be served. The usual reason is that the workspace that owns the project is no longer in good standing — for example, a billing issue has put the account on hold.
- Check your workspace billing status under Workspace settings → Billing.
- Resolve any outstanding payment or plan issue.
- Once the workspace is active again, the embed serves normally — no need to re-publish or re-copy the code.
A "Content Unavailable" message can also mean the project ID in the embed is wrong or pointing at a deleted project. Re-copy the snippet from the project's Share → Embed tab to be sure.
The iframe has no height (most common blank page)
Numio's embed snippet sizes the iframe to fill its container:
<div style="position:relative;overflow:hidden;">
<iframe frameborder="0" style="width:100%;height:100%;" src="https://…/calculator/YOUR_ID" />
</div>
Because the iframe is height:100%, it fills the wrapping <div> — but if that <div> has no height of its own, the iframe collapses to zero and the calculator appears blank.
Give the wrapper a height so the iframe has something to fill:
<div style="position:relative;overflow:hidden;min-height:600px;">
<iframe frameborder="0" style="width:100%;height:100%;" src="https://…/calculator/YOUR_ID" />
</div>
Adjust min-height to suit your calculator's length. If your site builder strips inline styles, set the height with your own CSS or the builder's iframe-height control instead.
Quick checklist
- Blank and never published → publish, then re-copy the embed.
- "Content Unavailable" → check workspace billing / good standing, then re-copy the snippet.
- Blank with a valid URL → the iframe container has no height; add a
min-height.