Integration of webgl in wordpress

Unity Engine
1

Hi everyone.

I’ve been working on a WebGL app lately and end up with a nice result but when time comes to embed it on my website using wordpress, things get messy.

I managed to do a basic and it works fine but it is missing usefull things like a play button, a loading bar and a full screen button. These are the little things that make a product look professional. Right now, as you can see on my WebGL 3D page, I have an empty space while it’s loading and it looks more like a bug than a feature. :-/

I found a good WebGL template with decent base features to start with but it is for a full page distribution and I have trouble making it work within wordpress. In order to make it work, I had to modify my theme header and I ended up with a memory error message that doesn’t really help since I know the memory value is good.

Anyway, I was wondering if anyone had better results than me when it comes to embed WebGL content in wordpress or equivalent. WebGL have a very good potential right now but is let down by the lack of distribution tools, it might be worthwhile to work on it and make a plugin.

Thanks for all your help.

1 Like
2

Hello Marc Saubion.

The easiest way to embed WebGL content into another page without causing any conflicts is to use

1 Like
3

Thank you Alex.

As a matter of fact i was trying to avoid using iFrame from webmasters recommandations. That’s why I’m looking for a cleaner solution.

4

Iframes should indeed be used wisely in special cases, for example:

  • when you expect the text content inside the embedded iframe to be scanned and cached by a search engine, so that the link from the search results would point you to the main page to maintain its proper rating, and not to the iframe which might not even work correctly without the parent page (and WebGL does not have any text that needs to be scanned)
  • when the content of the iframe is hosted on another domain, as it might cause complications if the user disables 3rd party cookies or iframe needs indexedDB access
  • the end user is using a really really outdated browser which does not handle iframes properly (it will not handle html5 as well then)
    So, as you can see, none of this applies to the case of embedded WebGL content (assuming that it is hosted on the same domain), therefore you can use iframes freely, it works well.

P.S. Each time you embed a youtube video on your wordpress page you are using an iframe (unless you are using flash or object which is now deprecated), so there is nothing wrong with iframes.

1 Like
5

Thanks a lot for clearing that up. In my case, the WebGL page is on my own domain so I went back to an iFrame.

Here is the code I used for whoever need it:

I’m looking for a way to add a loading button so the iFrame would load only on user demand. I’ll add that up if I succeed but any help is welcome.

1 Like