How to create a clean iframe

Hello,

I made a small code with p5js and I want to insert it with an iframe on my webpage.

<iframe frameborder="0"style="height: 300px; width: 300px; margin: 0 auto; display: block;" src="https://editor.p5js.org/sanson01/embed/HkHdFYAsm"></iframe>

But it has a header and scroll bar and I don’t know how to delete them.
Here is a screen with my iframe
Screenshot_1

Any idea?

Thank you!
Santiago

OpenProcessing.org still supports banner-less embeds:

2 Likes

Can’t you just have the sketch in your own webpage?

Just have a file named “sketch.js” for your code and these 2 <script> tags inside your HTML file:

<script async src=https://cdn.JsDelivr.net/npm/p5></script>
<script defer src=sketch.js></script>
3 Likes

I think they only do this if you pay, right?

imagen

Seems it was so for a time. But now share embeds have been re-activated for non-paid users too. :wink:

I don’t see it. When I try to use OpenProcessing.org and enbeds my code it appears with banner and everything.
And the option to edit the embed code is only for Plus+ member (paying for it)
Or I didn’t find the option that you said.
Thanks

There’s an OpenProcessing.org forum embed <iframe> example in the post below:

Yes, thanks for your reply. I know that you can embed and iframe from OpenProcessing or P5js, but I don’t know how this example could help me.
Because what I want to do deletes all the information (banners, etc.) of my iframe, and all the examples on that reply have banners and thinks. So I don’t understand how it could be possible with OpenProcessing, P5 or any other.

If I try to use P5 I have this banner
imagen

And if I try to use OpenProcessing I have this one
imagen

And I don’t have any free option on these pages to delete that and I don’t know if I can do that in my iframe code (and if I can do that).

Sorry I didn’t realize these were paid features (I have a paid account, so I have access to them).

As GoToLoop suggests, I recommend hosting your sketch on your own website (if you don’t have an existing host you can use GitHub Pages quite easily).

1 Like

Thanks again,

I created a Github project and I could embed an ifame from that.
It was a problem to do that at the beginning because I am using Google Pages and I can’t modify the code, I can only insert elements and modify them, but it worked to create a Github Page and create a clean iframe from this.

:slight_smile:

1 Like