Embed guide
Put any of the six tools on your own website with one line: the script tag, every attribute, and how the wallet pop-up works.
Each tool is reachable at /embed/<tool>/<token address>. The loader at /embed.js adds a responsive iframe where its tag sits, takes your colors, and resizes the frame to fit what is inside.
The script tag
<script src="https://iamnowutility.com/embed.js"
data-widget="stats"
data-mint="YOUR_TOKEN_ADDRESS"
async></script>Use one tag per widget. The Studio writes this line for you, with your token address and your colors.
Attributes
| Attribute | Values | What it does |
|---|---|---|
data-widget | buy, trust, burn, locks, split, stats | Which tool to show. Required. |
data-mint | A token address | The token the tool is for. Required. |
data-accent | A hex color such as ff9f0a | The accent color for buttons and highlights. |
data-bg | night, graphite, ink, ocean, forest, plum, ember, wine, a hex color or transparent | The background. A tone that is too light for our text falls back to night. |
data-radius | sharp, soft, round | The corner style. |
data-compact | 1 | A tighter layout. |
data-width | A CSS length, such as 100% or 480px | The width of the frame. Default 100%. |
data-max-width | A CSS length | A maximum width. |
data-height | A number of pixels from 40 to 4000 | The first height, before the widget reports its own. |
data-target | A CSS selector | Where to put the frame. Default: right after the tag. |
Sizes
| Tool | Starting height | Compact |
|---|---|---|
| Buy Button | 450 px | 320 px |
| Trust Badge | 1800 px | 60 px |
| Burn Wall | 790 px | 580 px |
| Lock Proof | 400 px | 380 px |
| Locked Split | 270 px | 220 px |
| Live Stats | 560 px | 170 px |
The frame resizes itself once the widget has loaded. These are only the first heights.
Single page apps
window.InuEmbed.mount(document.getElementById("slot"), {
widget: "buy",
mint: "YOUR_TOKEN_ADDRESS",
accent: "63e6be",
compact: true,
});It gives back the iframe, or null when an option is not valid. Errors are logged to the console as warnings and never thrown.
A plain iframe
<iframe src="https://iamnowutility.com/embed/stats/YOUR_TOKEN_ADDRESS"
style="width:100%;border:0;color-scheme:dark"
sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-forms"
loading="lazy"></iframe>It works the same, without automatic resizing. The theme goes in the address as ?accent=, &bg=, &radius= and &compact=1.
Wallets and the pop-up
An embed never connects a wallet inside its frame. Wallet extensions cannot be relied on inside another site's iframe, and Phantom's own documentation says it does not inject its provider into iframes. So an embed shows information, and every action opens a pop-up on our own site.
A visitor taps a button
The embed opens
/act/<tool>/<token address>in a small window, as part of the tap, so browsers allow it.The pop-up is a normal page of ours
Every wallet works there. It shows our domain, the token and where it was started from, then asks the wallet to sign.
The result goes back
The pop-up reports the result to the embed, and closes itself a moment after a success. If the visitor closes it first, the embed treats it as cancelled.
The chain has the last word
If a strict browser policy cuts the link back, or a phone switches apps, the embed reads the chain again to see what happened.
Safety
- The iframe is sandboxed. It can run scripts and open pop-ups, and it cannot navigate your page.
- The loader reads nothing from your page except its own tag and your page's origin, which it passes along so the pop-up can say where it was opened from.
- The loader only ever loads the site it came from, and it checks every value before it reaches the address or the style.
- A resize message is accepted only from the loader's own frame and from our origin, and only for heights from 40 to 4000 px.
- Only the embed paths on our site can be framed. Every other page of ours refuses framing.