Hello, I’m new with gdevelop. I need to embed a website on a game. I think it’s possible to do it with an iframe, but how I can do it?
There is no native support for iFrames in GDevelop.
The only option I can think of is that you’d need to understand enough Javascript to develop your own method to allow it in the middle of the renderer.
Thanks.
There is no way to do it easily?
It would be nice if gdevelop had a native function to embed websites…
Javascript event
create
const iframe = document.createElement(“iframe”);
iframe.src = “example .com”;
iframe.setAttribute(“width”, “500”);
iframe.setAttribute(“height”, “300”);
iframe.style.top = “200px”;
iframe.style.left = “600px”;
iframe.frameBorder = “no”;
iframe.scrolling = “no”;
iframe.style.position = “absolute”;
iframe.style.zIndex = “1000”;
iframe.id = “iframe1”;
document.body.appendChild(iframe);
delete
const myIframe = document.getElementById(“iframe1”);
myIframe.remove();
1 Like
As far as I know, Javascript or bust.
Jacks script above may work but you’ll need to know when/where to use it.
It doesnt shows anything.
Thanks for your response anyway
If you don’t need to get any data from the iframe you can always edit your index.html file before you export the game and add the iframe there. is not recommended to edit this file but it will work.
For instance in my case I edited the index.html to add my custom code for Gamedistribution API and show GameDistribution Ads.
Or for add fundinchoices concent.
C:\Users\YOURUSER\AppData\Local\Programs\gdevelop\resources\GDJS\Runtime\index.html
1 Like
A problem could be that the code tag in the forum replaces " with “.
And if you want to integrate a third-party website, they often block that.
https://workupload.com/file/2TeDPULaugd
The web is created by me and hosted on my server, so it seems that the web is not blocking the iframe. I will check and try the other method of editing the index.html file…
The index method will have exactly the same result.
What about my uploaded project? Does it work with your url? With the gdevelop url it works as you can see.
After several attempts I have found the problem: my website. Now its solved and shows it with both methods, but the best is with javascript events.
Thanks!!!
Is there any way to make it full screen?
Im sorry but i dont know anything about javascript, only python.
Delete the top and left lines(5&6) and use the same width and height(3&4) as the project resolution.
Thanks to all for the help.
I have created an extension to do it more easily through normal events: Iframe extension · Issue #165 · GDevelopApp/GDevelop-extensions · GitHub
1 Like
I updated the extension a bit on github
create and delete more than one iframe
border and scrolling as yes/no button
no longer necessary to type “px”
edited descriptions, labels and parameters to match with GD
2 Likes
Fixed freezing issue.
Now it is perfect, much better than at the beginning.
Thanks for your work!!
I think “Trigger once” should not be part of the extension so the user can decide for himself how often he run an action.
It is important that all actions work in the same way and to understand that events are executed millions of times if they don’t pay attention to it. But in that case it might be okay. Before it is integrated a Dev will check it and decide.