Embedding

Embed an Ascend page, database, or form into any website or blog post using a single HTML snippet. Embed codes are managed independently from share links — they have their own dialog and their own menu item.

Overview

An embed code generates an <iframe> snippet you can paste into:

• A marketing website or landing page
• A blog post or article CMS
• An internal portal or wiki
• A Notion / Confluence / SharePoint page (anywhere that allows raw HTML)

The embedded view loads at /embed/{token} — a chromeless version of the public viewer with no Ascend navigation.

Embed codes are always public

Anyone who can see the snippet (or the page hosting it) can view the embedded content. There is no email gate or password on embed codes — use a regular Share Link if you need access control.

Opening the Embed Dialog

The Embed option lives next to Share in every entity that supports it.

Entity	How to find Embed
Page	Top-right … menu → Embed
Database	Top-right … menu → Embed
Form (designer)	Toolbar → Embed button (next to Share)
Form card in a database's Forms tab	Hover → … menu → Embed

Rows aren't embeddable — the dialog is hidden inside the row detail sheet.

Creating an Embed Code

1. Open the Embed dialog (see above).
2. Click Create embed code.
3. A new card appears with a configurable snippet.

You can create multiple embed codes for the same entity — useful when you need different settings (e.g., light vs dark theme) for different host sites.

Embed Settings

Each embed code has its own settings. Changes save automatically.

Theme

Option	Behaviour
Auto (system)	Matches the visitor's OS theme preference
Light	Forces light mode regardless of visitor preference
Dark	Forces dark mode regardless of visitor preference

Use Light or Dark when embedding on a site with a fixed colour scheme so the iframe doesn't clash.

Access

Level	Embedded behaviour
View only	Read-only — visitors can browse content but not change it
Can comment	Visitors can add comments (when comments are enabled)
Can edit	Visitors can edit content directly in the iframe

Forms only support Can edit — there's no read-only form designer mode.

Default view (databases only)

Pick which database view loads when the iframe opens. Defaults to the database's default view if not set. Useful for embedding a specific Kanban board or filtered table without having to switch views in the snippet's URL.

Show header / Show footer

Toggle on to show the entity title bar and footer ("Powered by…") inside the iframe. Both are off by default — most embeds want a clean, chromeless view.

Transparent background

On by default. When enabled, the embed renders with no background colour so the host page shows through. Useful when your site has a coloured or textured background and the embed's default card look would stand out.

Turn off if you want the embed to keep its own surface colour (matching the chosen theme) — for example, when floating the embed over a busy image or when the host site's colour scheme clashes with the embedded content.

The snippet sets both style="background:transparent" and the legacy allowtransparency="true" attribute so older browsers honour the setting too.

Height

Mode	When to use
Auto-resize (default for pages and forms)	Iframe grows with content. Uses a small helper script (included in the snippet) that listens for height messages from the embed and resizes accordingly.
Fixed height	Iframe stays at a fixed pixel height; content scrolls inside it.

Databases force fixed height

Database tables are virtualised — only visible rows are rendered, so the iframe never knows its "real" content height. The dialog locks databases to Fixed height (default 600 px) and lets you tune the pixel value.

The Snippet

Copy the snippet with Copy code and paste it into your site's HTML. It looks like:

<iframe
  src="https://your-app.example/embed/{token}?theme=dark"
  data-ascend-embed="{token}"
  width="100%"
  height="600"
  frameborder="0"
  allow="clipboard-write"
  loading="lazy"
  style="border:0;border-radius:8px;display:block;width:100%"
></iframe>
<script>
  (function() {
    var token = "{token}";
    window.addEventListener('message', function(e) {
      if (!e.data || e.data.type !== 'ascend-embed:height') return;
      if (e.data.token !== token) return;
      var f = document.querySelector('iframe[data-ascend-embed="' + token + '"]');
      if (f && typeof e.data.height === 'number') f.style.height = e.data.height + 'px';
    });
  })();
</script>

The <script> block is included only when Auto-resize is enabled — fixed-height snippets are iframe-only.

Strip the script if your CMS blocks <script>

If your host (e.g., Medium, Substack, some Notion plugins) doesn't allow inline scripts, switch to Fixed height and copy the snippet again. You'll get a script-free version.

Previewing an Embed

Click the ↗ open icon on any embed card to load the embed URL directly in a new tab — exactly what visitors will see inside the iframe.

Revoking an Embed Code

Click Revoke on the embed card. Confirm the prompt.

• The token immediately stops resolving — every iframe pointing at it shows an error.
• This is permanent. Revoked codes can't be reactivated; create a new one if you need to re-enable embedding.

Differences Between Share Links and Embed Codes

	Share Link	Embed Code
Where it opens	New tab at /shared/{token}	Inside an iframe at /embed/{token}
UI chrome	Full Ascend chrome (header, navigation)	Chromeless by default
Access control	Optional email reservation, expiration	Always public, no expiration
Configurable theme	Follows visitor preference	Auto / Light / Dark per code
Multiple per entity	Yes	Yes
Auto-resize	N/A	Yes (pages/forms), fixed (databases)

Use a Share Link when you want to send someone a clickable URL. Use an Embed Code when you want the content rendered inside another website.

Frequently Asked Questions

Can I have multiple embed codes for the same page?

Yes. Each generates its own token and can have different theme/header/access settings.

Can I password-protect an embed?

No. Embed codes are always public. If you need access control, use a Share Link with an email reservation instead.

Why won't my database iframe grow with content?

Database tables are virtualised — only visible rows are rendered, so the iframe doesn't know how tall the "real" table is. Use Fixed height and let the table scroll inside the iframe. Pages and forms support auto-resize.

My CMS strips the <script> tag. What do I do?

Switch to Fixed height mode and re-copy the snippet. The fixed-height snippet is iframe-only and works in any HTML host.

Does revoking an embed affect my share links?

No. Embeds and share links are separate systems with separate tokens. Revoking one never affects the other.

Can visitors edit my page through an embed?

Only if you set the embed's Access to Can edit. Default is View only for pages and databases.