The Loop

« first day (3835 days earlier) ← previous day next day → last day (1124 days later) »

5:15 PM

Hi, I am facing this problem:

Q: Iframe disappears when author updates page

If a user has an author role and is listed as the author of a page, when they make changes to the page and click update, the changes are made but the iframe that was in the wysiwyg disappears and no longer shows on the back-end or front-end. If an administrator or editor makes the changes and sav...

Basically I want to embed my streamlit app: https://share.streamlit.io/rafisics/suvat_calculator/main/suvat_calculator.py
on a wordpress site.

I tried using the following way:

<iframe allow="fullscreen" height="700" src="https://share.streamlit.io/rafisics/suvat_calculator/main/suvat_calculator.py" width="900"></iframe>

But every time I update my post, this iframe HTML block gets disappears. What can I do?

I tried on my free site under wordpess.com domain. I am facing the same problem there too. But in my free blogger site under blogspot.com domain, this issue doesn't arise.

Howdy_McGee

Any JS errors in your inspector?

Tom J Nowell

5:40 PM

ofcourse it does, iframes in post content is highly undesirable

instead of focusing on the way you're achieving your goal, aka putting iframes in post content

ask about your actual goal instead, e.g. putting an embed in a post

now that question has a much easier answer

as well as lots of alternatives

aka How do I embed streamlit apps?

Nobody asks how to add iframe support so they can put Youtube videos in their content

they use a shortcode! Or the youtube block! Or OEmbed

also, unfiltered_html is a dangerous capability

you should be removing it from users, not adding it

e.g. I see no reason you can't add a Streamlit OEmbed provider that has a regex that matches URLs starting with https://share.streamlist.io/

raf

@TomJNowell yes, that's my current question actually. How can I embed streamlit apps in wordpress

Tom J Nowell

then you could just do the OEmbed trick of putting the URL as plaintext on a new line

Gutenberg might even auto-magically create a block for you

the [embed] shortcode would work with it automatically too

raf

@TomJNowell let me try.

Tom J Nowell

but even if you chose to ignore all of that, you could build an [iframe] shortcode, though it wouldn't work as well ( OEmbeds can give you previews and control over stuff like HTML )

e.g. it looks like the Streamlit URLs support ?embed=true which removes some pieces of UI chrome, with OEmbed you could auto-add that

raf

5:58 PM

can you provide me sample/example code.

I tried by pasting the url in embed block

but it didn't work

I want to embed this url specifically: share.streamlit.io/rafisics/suvat_calculator/main/…

and also want to embed this one in a seperate block: suvat-calculator.herokuapp.com

Tom J Nowell

you need to add en OEmbed provider, WP has a predefined whitelist

look into wp_oembed_add_provider, there's examples in there and info

and there's probably several questions asking how to add OEmbed providers