nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How to embed Confluence pages in other websites

Samuel_Roberts

Some of our Confluence pages are great reference resources that we would like to embed within our Intranet.

Even on ubiquitous WordPress, iframing the content appears not to be possible. Evidently, this is because several years ago Confluence included new headers in pages to prevent clickjacking. Described in this knowledgebase article: https://confluence.atlassian.com/confkb/confluence-page-does-not-display-in-an-iframe-827335781.html)

The article says there is a fix for server-based Confluence instances, but not for Atlassian Cloud (which is where we live). Does that mean there truly is no way to embed content in Confluence within other websites? Surely there must be a workaround for this.

Accepted answers

Tobias Anstett (K15t)

Hi @Samuel_Roberts,

I guess the browser console reports an error like:

Refused to display 'https://XXXX.atlassian.net/wiki/spaces/XXXX' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self'".

The only workaround that I am aware of is to use the Confluence REST API to render your content. But please note that you need to put a lot of efforts into this.

https://k15t-dev.atlassian.net/wiki/rest/api/content/{contentId}?expand=body.export_view.webresource.tags.all

This will return both the rendered content (export_view) and all the tags required to resolve the js and css webresources. However image src links have to be adapted and so on.

To summarize it - unfortunately there is no good and easy solution for this.

Best, Tobias

All comments

Tobias Anstett (K15t)

Hi @Samuel_Roberts,

I guess the browser console reports an error like:

Refused to display 'https://XXXX.atlassian.net/wiki/spaces/XXXX' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self'".

The only workaround that I am aware of is to use the Confluence REST API to render your content. But please note that you need to put a lot of efforts into this.

https://k15t-dev.atlassian.net/wiki/rest/api/content/{contentId}?expand=body.export_view.webresource.tags.all

This will return both the rendered content (export_view) and all the tags required to resolve the js and css webresources. However image src links have to be adapted and so on.

To summarize it - unfortunately there is no good and easy solution for this.

Best, Tobias

Samuel_Roberts

Thank you for this answer, Tobias!

Anand Inamdar_Amoeboids

@Samuel_Roberts just came across this question. You may want to give our app Embedder for Confluence a try. It is not perfect due to the API limitations, but it works.

Best,
Anand

Conrado Maggi

I just came across this question. You may want to give our new app DeskBase with it, you can create a website from your docs and embed one or multiple pages of it on any other app or website.

Best,

Conrado

Sam Ajami_wnbls1

Mmmmmhhh, I'm also looking for something like this.

We want to write our product manuals and descriptions in Confluence, and have those pages pop up on our website.