[✅ Solution] How to embed an iframe or a website

Hi all,
I am wondering how can we get another website into Tape. How can we embed a website and/or an iframe? I tried various different things but the further I got was getting a mini-view of my own workspace.

By the way I tried as well to follow the pdf embed guide to adapt it but it didn’t work here.

Thanks a lot.
R.J.

1 Like

Hi @R.J,

first of all: A warm welcome to the Tape commmunity! :blue_heart:

Regarding your question: This should work out of the box and rather easy, you simply need to return an HTML string that renders the iframe. Note that you need to reference at least one field in your calculation field (this limitation is currently in place again, it may be removed in the future. The reason is that there were unforeseen issues with calculation fields that had no reference, we will most likely resolve that in the future)

Note, that not every website can be embedded via an iframe. It is up to the maintainer of that website to decide and configure their website respectively.

I just tried with an open street map embed and it works like a charm:

Note the reference inside a comment that is only needed due to the limitation, the field value is not used in this case.

Hope this helps - let me know how it goes. :eyes:

Cheers
Tim

Hi @Tim,
Thanks for your lightning fast reply and warm welcome! :smiling_face:
It is a pleasure to talk back to you all!

Alright, going to have some tests trying this (although I feel like I already tried this). I forgot to mention widget embed as well. I am currently trying a weather widget, and it is not working. I tried several different widgets for weather from different sites but here is one I tried:

<a class="weatherwidget-io" href="https://forecast7.com/en/40d71n74d01/new-york/" data-label_1="NEW YORK" data-label_2="WEATHER" data-theme="original" >NEW YORK WEATHER</a>
<script>
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src='https://weatherwidget.io/js/widget.min.js';fjs.parentNode.insertBefore(js,fjs);}}(document,'script','weatherwidget-io-js');
</script>

I see the thing with the calculation fields, now I understand… Do you know when will this be solved? (approx.) Is there any implication if we create a dummy hidden field to reference to? Although inconvenient and clunky this may help “bypass” the limitation.

Thanks.
R.J.

1 Like

Fully understood! And happy to see you here as well. :slight_smile:

Script tags may not work properly, but iframes should. Let me know how it goes!

Regarding the calc field, will follow up in your thread:

Cheers
Tim

Ok so I managed to get the iframe kind of working. I got the osmaps working but couldn’t make work another data platform iframe. I tried a couple of browsers but I noticed one is actively blocking it and the other one is not rendering anything just a blank space. Do you know how can we solve this?

It would be awesome to find a way to display little widgets as the weather one. Is there any way to run something like this?

Thanks a lot.

1 Like

@R.J i think you have to find another source where iframes a are available.

1 Like

Glad to hear the basic case works now!

Not every website will be embeddable in an iframe though, see my note from the previous post:

Note, that not every website can be embedded via an iframe. It is up to the maintainer of that website to decide and configure their website respectively.

Unfortunately we cannot control that from Tape side.

Hope you find a way! Let me know if you have further questions regarding this topic.

Cheers
Tim

Hi @tomaz and @Tim,
Sorry because I couldn’t get back here before. Thanks a lot for your input, I finally manage to kind of find a workaround by generating iframes directly for certain sites (weather…), although there is one that is still blocked.

I have another related question about the record window size but I’m going to create a separate question so we can better keep things organized. :smiley:

1 Like

Hey @Tim I’m hoping maybe you can help me with this. I am trying to get an iFrame working in a Tape calculation field but it’s just not working.

I am trying to embed a Procfu mini app but it’s just showing a blank space. I know this is a website that is capable of being in an iFrame, because it’s a special setting in Procfu AND please see the test I did on a website that confirms it’s capable of being in an iFrame.

Is there something I’m not doing correctly? It seems from your first reply that the ‘iframe’ tag is the only thing required (and that the site will allow it).

Thanks!!

Screenshot 2023-11-27 at 3.45.25 PM

1 Like

My bad @Tim, everything is working now, not sure what changed but it seems to work fine now. Thanks!

1 Like

I was just about to investigate - thanks for the update and glad to hear it is working :tada::raised_hands: