Embed a diagram in Microsoft Teams: the Website tab changed, and what works now

The Website app still appears in the tab gallery, and it still accepts a URL. What changed is the behaviour. Microsoft announced on the Microsoft 365 developer blog, in a post titled Upcoming updates to loading websites in Teams tabs, that websites would stop loading inside the new Teams desktop and web clients, rolled the change through 2024, cited web security and reliability, and left education tenants out of it. The guidance in that post was to pin the corresponding app rather than a URL: for a SharePoint page, the SharePoint app. Custom Teams tab applications, packaged and installed by an admin, continue to render in place.

Two consequences follow. A pinned diagram URL is still useful as a shortcut everyone in the channel can find, and it is no longer an in-channel view. Anyone telling you to fix this with framing headers is answering a question Teams no longer asks: the target site is not being framed at all.

Framing itself is not the blocker on the Datadef side. The embed page is served with frame-ancestors set to allow any parent, so it renders wherever framing is permitted, which is what the SharePoint route below relies on.

Paste or upload an image into a channel message and Teams stores the file in the SharePoint document library behind the team, then shows that stored file in the conversation. It is a copy with a filename and a folder, and it will still be there, unchanged, long after the architecture has moved on.

Paste a link instead and Teams shows a preview card built from the page metadata. The card is a pointer, so it does not go stale in the way a posted picture does, and it is the safer thing to pin to the channel.

Every work tool forces that split. What is particular to Teams is where the copies land: a year of architecture screenshots quietly becomes a SharePoint folder of contradictory pictures that site search will happily surface to someone who was not in the conversation.

Every standard Teams channel is backed by a SharePoint site, and a SharePoint page can be added to a channel as a tab. That is the route that survives the Website tab change: build a page in the team site with the Embed web part pointing at the interactive diagram URL, then pin that page as a channel tab.

The gate is tenant-level. SharePoint only frames external content from domains an admin has allowed under HTML Field Security, so the domain has to be on the allowlist before the web part renders anything. The mechanics of that allowlist, and the two web parts involved, are covered in embed diagrams in SharePoint.

The payoff is a channel tab that shows the current diagram with pan and zoom, inside Teams, for everyone in the team, with no per-viewer sign-in to a third-party tool.

SharePoint page (team site) -> Embed web part -> https://datadef.io/embed/my-platform-a1b2c3d4
Teams channel -> add tab -> SharePoint -> pick that page

For the recurring post rather than the permanent tab, an incoming webhook or a Workflows flow can send an Adaptive Card into the channel, and an Adaptive Card Image element takes a URL. The card fetches that URL when it renders, so a card posted after a deploy shows the diagram as it stands at that point, without anyone exporting a file.

Keep the message narrow: one image, one line of context, one link to the interactive view for people who want to zoom. A release bot that posts the architecture after each production deploy is the cheapest documentation habit a platform team can adopt, and it costs one webhook.

To be exact about the boundary: Datadef has no Microsoft Teams application. What Teams renders here is an ordinary image URL and an ordinary framed page, which is why the routes above work at all without an integration.

A channel tab is a promise that the picture is current. Back it with a repository connection: read-only access to GitHub, GitLab or Azure DevOps, a branch or tag of your choice, and a daily sync that regenerates the diagram and an architecture.md. Azure DevOps support matters here in particular, since it is the repository host most Teams-centric organizations already run.

If that repository holds Terraform, the sync reads it rather than runs it. Each .tf file is parsed as text, so no terraform init happens, no state file is opened and no cloud credential is involved at any point. Directories of .tf files become module units, a unit nobody calls as a module source is a root stack, and references inside expressions resolve to the declared resources they reach, which is the edge set of the real architecture. Variables and locals are followed rather than evaluated. A count of three shows on the node as a multiplicity of three, and a for_each driven by a variable your environments/DEV and environments/QUAL tfvars files set differently becomes an honest per-environment label instead of one number that is wrong in both places.

A commit that changes nothing structural leaves the diagram alone, so the tab does not shuffle its layout every morning. See repo to diagram for what the sync reads.

• Embed diagrams in SharePoint
• Share diagrams in Slack
• Embed a diagram in Confluence
• Live embeds: one URL, always current
• Repo to diagram: how repository sync works