How to show Trello in an iFrame

iframe trello
Ben picture Ben · Apr 7, 2014 · Viewed 14.5k times · Source

I am putting together a dashboard to show project progress.

It's a dead simple page - basically divided into quarters, with an iframe in each quarter.

We use Trello for our KanBan board and I want to embed it in this dashboard - unfortunately I get the following message:

This content cannot be displayed in a frame

To help protect the security of information you enter into this website, the publisher of this content does not allow it to be displayed in a frame.

Looking around, they for this to prevent ClickJacker attacks, but wonder if there is a way round it.

My plan B is to write a c# app that will open 4 browsers and resized them all to fit into quarters of the screen, but this is obviously a lot more work!

Answer

ted.strauss picture ted.strauss · Oct 29, 2017

Here is a jsfiddle that shows code to iframe embed a trello board:

<iframe src="https://trello.com/c/OKVduwHL.html" frameBorder="0" width="340" height="220"></iframe>

Related questions

How to apply CSS to iframe?

I have a simple page that has some iframe sections (to display RSS links). How can I apply the same CSS format from the main page to the page displayed in the iframe?

Read More
Make iframe automatically adjust height according to the contents without using scrollbar?

For example: <iframe name="Stack" src="http://stackoverflow.com/" width="740" frameborder="0" scrolling="no" id="iframe"> ... </iframe> I want it to be able to adjust its height according to the contents inside it, without using scroll.

Read More
SecurityError: Blocked a frame with origin from accessing a cross-origin frame

I am loading an <iframe> in my HTML page and trying to access the elements within it using Javascript, but when I try to execute my code, I get the following error: SecurityError: Blocked a frame with origin "…

Read More