Embedding SOPs in other tools

An embed puts a live, read-only copy of one SOP inside another page: your website, an intranet, a help desk article, a Notion or Confluence page, or a Google Site. It is built on a share link, so everything you know about share links applies: anyone who can see the page can read the SOP, it always shows the current version, and revoking the link takes it down.

Get the embed code or link

1. Open the SOP and press Share.
2. Create a share link, or use an existing one. Label it after where it will live, such as Help center or Intranet, so you can tell your embeds apart later.
3. Under the link, choose one of:
   • Copy embed code for tools that accept HTML: websites, intranets, most help desks and some wikis. You get an <iframe> plus a short script that sizes it to fit.
   • Copy embed link for tools that embed from a URL, such as Notion’s embed block. You get an address that looks like https://app.sopcompass.com/embed/<token>.

Note: Use one share link per place you embed. Then you can revoke one embed without breaking the others, and each link’s open count tells you how much that embed is used.

What the embed code contains

The code has two parts:

<iframe src="https://app.sopcompass.com/embed/<token>" title="Closing the store"
  width="100%" height="640" style="border:0;max-width:100%" loading="lazy" allow="fullscreen"></iframe>
<script>/* listens for the SOP's height and resizes the iframe to fit */</script>

• The iframe shows the SOP at full width, 640 pixels tall to start, and loads only when it scrolls into view.
• The script listens for messages from SOPCompass that report the SOP’s height and resizes the iframe to match, so there is no inner scroll bar. It accepts messages only from SOPCompass and only resizes the iframe that sent them, so several embeds on one page each size themselves.

If a tool removes scripts, the iframe keeps its 640 pixel height and the SOP scrolls inside it. That is how Notion, Google Sites and many help desks behave. You can change height="640" in the code to suit your page before pasting.

What people see

• A slim bar with your workspace name and an Open in SOPCompass link, which opens the full share page in a new tab.
• The SOP’s title, each section, and every numbered step with its text, screenshots and highlight boxes. Videos in a card play in place.
• Links inside the SOP open in a new tab, so readers don’t lose the page they were on.

An embed shows less than the share page: no owner email, no checklist ticking and no text size control.

Revoking and expiry

An embed has no credential of its own. It works exactly as long as its share link does:

• Revoke the link in the Share window and every embed of it shows “This SOP isn’t available. The link may have expired or been revoked.” on its next load.
• Give the link an expiry of 7 or 30 days and the embed stops on that date by itself.

To move an embed to a new link, create the new link, replace the code on the page, then revoke the old link.

Security notes

• Only the /embed/ address can be shown inside another site. Every other SOPCompass page refuses to be framed, so the app itself can’t be embedded or overlaid by another site.
• The only thing an embed sends to the page around it is its height, never content.

Guides for specific tools

• A website or intranet (WordPress, Squarespace, Webflow, SharePoint and plain HTML)
• Notion
• Confluence
• Zendesk and other help desks
• Google Sites