Loving this template, thank you so much for providing it!
One issue I'm having, for some reason since I upgraded to Unity 2021.1 the Minimal presets seem to no longer have a loading bar at the beginning and there's no feedback to tell the user that my game is loading in the background, but I am trying to wrap my head around tutorials on how to reimplement a loading bar, or a loading percentage or anything that just says loading, into this template and I'm really struggling - I'm incredibly bad at HTML and CSS.
If anyone has a solution to help with this, that would be amazing.
the default template included in Unity (the non-minimal one) should include a loading bar; taking a look at the source for that would probably be the easiest way to start
Hello, great template by the way, works perfect on desktop and is pretty much compatible on mobile which is awesome, however I'm having an small issue, on chrome and opera mobile browsers I'm getting an aspect ratio distortion on the vertical axis, it looks perfect on firefox.
Hi Sean, great work on this, however I am having an issue.
The build works on itch however when I try to host it on GitHub Pages, it causes a 404 error, I think because there is no templateData folder after building. Do you know what can be done to fix this?
I don't know why the choice of host would make a difference for this; are you sure you've included all the same files and deployed correctly in both cases? If you're getting a 404, my initial guess would be that the GitHub pages deployment is missing one or more files from the build output.
there's info on how you can add a loading indicator at the bottom of the page here (you can also use the built-in unity template with a loading bar as a reference)
hey there, I tried to reproduce this using the latest version (v2.2 + Unity v2020.2.0b13), but it seemed to work fine. without more info to debug with, i'd suggest trying to use one of the default templates and see if the problem persists as a way to narrow down whether it's actually a bug with the template or with something else
EDIT: My mistake. I was using the wrong zip file. I'll leave this here for anyone else who makes the same mistake.
Using Unity 2019.2.11. Changed to the BetterMinimal template in Player Settings but the options don't appear. Also, it appears the template tags aren't being replaced on build. Any Help would be appreciated. Thanks.
I had an issue earlier with the template regarding my project becoming distorted, as if the scaling had done something squiggly to all the graphics. To fix this - I removed all of the 'image-rendering' and 'interpolation-mode' values in the CSS.
It would be nice if this was an option, something such as 'optimise for pixel art'.
tested it out in 2020.1.0b5 and can reproduce the issue: looks like unity isn't replacing any of the template tags when creating a WebGL build. looks like they've changed how that build process works, unfortunately without updating the documentation; will dig into it some more and try to have a fix up soon
It's true that I have content blocking enabled as per default in Firefox. This makes the game start take a couple of seconds longer. I assume this is because the template tries to contact Google in vain. As most players are pretty hectic nowadays, some of them might think the game doesn't work and close the browser so it would be great if you could add a check for potential content blocking. Thanks!
i believe that's unfortunately outside the scope of this template: it's just a very thin wrapper around the bundle Unity is injecting into it, and Unity is managing any and all tracking code
I see. That is unfortunate. I'm not sure who is contacting Google analytics in itch.io. Is it Unity or Itch itself? Or someone else? Let's hope it works better in the future.
Wow, this is really useful! Setting 'scale to fit' to false would be perfect for me, but it doesn't seem to actually change the dimensions & aspect ratio of the camera the way it should. The boarders of the screen get cut off. Likely a problem with Unity itself.
Thanks for the amazing template! It works great in Chrome and saved the day for my project.
I was wondering if focusing the canvas element after entering fullscreen mode would help Estecka's issue. I noticed for me as well that after going into fullscreen you need to click on the canvas element to resume the game loop.
Would be nice to have the auto-detection working. Does adding the "width" and "height" properties in the style attribute of the "gameContainer" div work?
Would be nice to have the auto-detection working. Does adding the “width” and “height” properties in the style attribute of the “gameContainer” div work?
Works great ! Though for some reason, when enabling Itch.io's fullscreen on firefox, the game remains scaled down until you click it again. (No issue on chrome)
Another thing that is not an issue but worth noting: Whereas Itch.io can usually find the canvas' size for Unity games automatically, this template requires setting the canvas size manually.
Hey, thanks for the feedback! I'll try to take some time to look into those issues.
Edit: looks like the first issue is on Unity's end (the canvas does in fact resize, but Unity's not updating till it's been focused). RE the auto-detect size, I spent a bit of time tinkering to see if I could figure out where they're pulling the size from without success; I've submitted a feature request on itch.io's github about it though, and will update this if more info on the auto-detect becomes available.
← Return to Unity WebGL Template
Comments
Log in with itch.io to leave a comment.
It solved all the size problems of my project at once, thanks a lot!
Still works on 2020.3
It works in 2020.2.3f1.. thanks for this
Loving this template, thank you so much for providing it!
One issue I'm having, for some reason since I upgraded to Unity 2021.1 the Minimal presets seem to no longer have a loading bar at the beginning and there's no feedback to tell the user that my game is loading in the background, but I am trying to wrap my head around tutorials on how to reimplement a loading bar, or a loading percentage or anything that just says loading, into this template and I'm really struggling - I'm incredibly bad at HTML and CSS.
If anyone has a solution to help with this, that would be amazing.
the default template included in Unity (the non-minimal one) should include a loading bar; taking a look at the source for that would probably be the easiest way to start
Hello, great template by the way, works perfect on desktop and is pretty much compatible on mobile which is awesome, however I'm having an small issue, on chrome and opera mobile browsers I'm getting an aspect ratio distortion on the vertical axis, it looks perfect on firefox.
Thanks in advance for any help with this.
Hi Sean, great work on this, however I am having an issue.
The build works on itch however when I try to host it on GitHub Pages, it causes a 404 error, I think because there is no templateData folder after building. Do you know what can be done to fix this?
Thanks
I don't know why the choice of host would make a difference for this; are you sure you've included all the same files and deployed correctly in both cases? If you're getting a 404, my initial guess would be that the GitHub pages deployment is missing one or more files from the build output.
Hi Sean,
looks like it just took a while for the GitHub Pages to set up, its working perfectly now, thanks for the reply.
Will this work on 2020.3? I'm sorry I haven't tried it, but since you parted 2020.2 and 2020.1, I think I might ask first
I've used it in 2020.3.4f1 without issues; lmk if it's not working for you
Okay, thanks!
hello, it doesn’t seem to work with Unity version 2020. I get a black screen when I try to build with it :’)
have you double-checked you're using the correct version of the package for your version of unity? there are different versions for 2020.1 and 2020.2
if you have, can you let me know what specific version of unity you're using?
ohhhh! Thank you! That fixed it :D
Thank you for making this, I spent way too much time trying to get this to work and you have even more customizable than I ended up with!
Works for mobile!
Five Stars! Beautifully simple to add and build.
Thank you!!
I'm not sure, but I think this gets rid of the loading screen as well? Any way to re-enable it?
there's info on how you can add a loading indicator at the bottom of the page here (you can also use the built-in unity template with a loading bar as a reference)
Dude, THANK YOU ! This simplifies my workflow by A LOT !! I'm donating a few bucks.
I seem to be struggling. I followed the steps and when I uploaded my zip to itch.io I get this error in itch "No dimensions provided or detected"
I have the embed in page option selected. When I change it to click to launch in fullscreen the game works but the scaling doesn't work on mobile.
Any tips or am i missing something? :)
what version are you using?
OMG thanks it just saved my life ahah
Thank you so much!
Great stuff :) Using this, thanks.
hey there, I tried to reproduce this using the latest version (v2.2 + Unity v2020.2.0b13), but it seemed to work fine. without more info to debug with, i'd suggest trying to use one of the default templates and see if the problem persists as a way to narrow down whether it's actually a bug with the template or with something else
Thanks you so much! Works great.
Cool stuff, short, sweet, and super useful! Thanks!
EDIT: My mistake. I was using the wrong zip file. I'll leave this here for anyone else who makes the same mistake.
Using Unity 2019.2.11. Changed to the BetterMinimal template in Player Settings but the options don't appear. Also, it appears the template tags aren't being replaced on build. Any Help would be appreciated. Thanks.
same happens to me, i'm using 2019.4.13
have you double checked you're using the correct version of the template?
Yeah, i changed the template (i was using the 2020.2), now the build works but the options didn't show yet.
this is really handy.
Fantastic, thanks for providing this! $10 winging its way to you now.
I love you. My chibi maker can be played on the phone now
I had an issue earlier with the template regarding my project becoming distorted, as if the scaling had done something squiggly to all the graphics. To fix this - I removed all of the 'image-rendering' and 'interpolation-mode' values in the CSS.
It would be nice if this was an option, something such as 'optimise for pixel art'.
Ah, good suggestion! I'll add that in the next update.
oh this works splendidly!
THANKS!
Really helpful! Thanks so much.
Seems to be broken in Unity version 2020.1.0b5.
tested it out in 2020.1.0b5 and can reproduce the issue: looks like unity isn't replacing any of the template tags when creating a WebGL build. looks like they've changed how that build process works, unfortunately without updating the documentation; will dig into it some more and try to have a fix up soon
updated with a version that supports 2020.x. thanks for the bug report; feel free to lmk if you have any other issues!
I tested it and it works. Thank you for your work!
I'm getting the following error using the template on Firefox:
The resource at “https://www.google-analytics.com/analytics.js” was blocked because content blocking is enabled."
It's true that I have content blocking enabled as per default in Firefox. This makes the game start take a couple of seconds longer. I assume this is because the template tries to contact Google in vain. As most players are pretty hectic nowadays, some of them might think the game doesn't work and close the browser so it would be great if you could add a check for potential content blocking. Thanks!
i believe that's unfortunately outside the scope of this template: it's just a very thin wrapper around the bundle Unity is injecting into it, and Unity is managing any and all tracking code
I see. That is unfortunate. I'm not sure who is contacting Google analytics in itch.io. Is it Unity or Itch itself? Or someone else? Let's hope it works better in the future.
Thanks a lot. I was wondering how I could achieve pixel perfect webGL games in unity for a long time. I can finally make sharp pixel-art games.
This is nice, Ill use this from now o
Awesome! Thank you very much for your time and efforts!
Thanks for a great little template! I am sending $20 can your way for this! Much appreciated.
Thanks for sharing this. Saved me a lot of headache.
I just found this and it's great. I'm going to link to this from the itch.io documentation for HTML5 games.
oh awesome!
Thank you so much! This does exactly what I've struggled to do over the last few days.
This is fantastic! Auto-include in every Unity game I make now. Thank you!
Wow, this is really useful! Setting 'scale to fit' to false would be perfect for me, but it doesn't seem to actually change the dimensions & aspect ratio of the camera the way it should. The boarders of the screen get cut off. Likely a problem with Unity itself.
What kind of license is this under? I plan to release the source code of my game... Do I need to mention you somewhere?
MIT license; attribution is appreciated but not required
(updated the metadata to reflect this)
Thanks for the amazing template! It works great in Chrome and saved the day for my project.
I was wondering if focusing the canvas element after entering fullscreen mode would help Estecka's issue. I noticed for me as well that after going into fullscreen you need to click on the canvas element to resume the game loop.
Would be nice to have the auto-detection working. Does adding the "width" and "height" properties in the style attribute of the "gameContainer" div work?
Yes. That’s exactly what is needed.
Works great !
Though for some reason, when enabling Itch.io's fullscreen on firefox, the game remains scaled down until you click it again. (No issue on chrome)
Another thing that is not an issue but worth noting:
Whereas Itch.io can usually find the canvas' size for Unity games automatically, this template requires setting the canvas size manually.
Hey, thanks for the feedback! I'll try to take some time to look into those issues.
Edit: looks like the first issue is on Unity's end (the canvas does in fact resize, but Unity's not updating till it's been focused). RE the auto-detect size, I spent a bit of time tinkering to see if I could figure out where they're pulling the size from without success; I've submitted a feature request on itch.io's github about it though, and will update this if more info on the auto-detect becomes available.
Late reply, but I just came across this template and ran into the same issue as you with itch not being able to detect the canvas size.
But the good news is I found the solution.
Near the bottom of the index.html included in the template, change the line with
to
and itch.io will then be able to automatically find the canvas size.
Thanks for figuring this out! I've updated the template with the suggested change now.