How to export your GameMaker game to HTML5
Pick HTML5, not GX.games, from GameMaker's Target Manager: GX.games publishes to Opera's GX.games site, while HTML5 gives you plain files you can host anywhere. Every licence tier, including Free, includes HTML5 export, though Free is non-commercial only. Run Create Executable to get a zip with index.html, test it on a local server, then re-zip it with index.html at the top and upload it.
Last checked
What you need
- A current GameMaker release (the monthly release or the LTS branch), installed and signed in.
- A licence that covers HTML5 export. Every tier, including Free, includes HTML5 export, but Free is non-commercial only. If you plan to make money from the game, including through your own Patreon, Ko-fi or Steam links, you need the Professional (one-time purchase) or Enterprise (subscription) licence for a commercial licence.
- A project that already runs in the VM or YYC compiler.
Your build runs inside an iframe on naughty.games, behind the site's own age gate, so nothing extra is needed inside the project for that.
Export for the web
- Select the HTML5 target. Open the Target Manager in the top right of the GameMaker IDE and choose HTML5, not GX.games. GX.games is a separate export that publishes to Opera's GX.games site; HTML5 gives you plain files you can host anywhere, which is what naughty.games needs.
- Test-run from the IDE. Click run as you normally would. GameMaker starts its own local test server and opens the build in your default browser, which may trigger a one-time firewall prompt.
- Check the Game Options for HTML5. Open the HTML5 Game Options and review the Graphics tab: Texture Page size defaults to 2048x2048 and can go up to 8192x8192, but a larger texture page means a bigger download and less browser and device compatibility. Set WebGL support to auto-detect rather than required, since requiring WebGL cuts out browsers that would otherwise run the game fine.
- Turn off unused built-in assets. Uncheck Use Built-In Particles and Use Built-In Font if your project uses its own particle sprites or fonts, so GameMaker does not package assets you never use.
- Create the executable. Click Create Executable and pick a save location. GameMaker compiles the project into a zip that includes
index.htmland the rest of your game's files.
Test it locally
GameMaker's own IDE test run already serves the build through its local server, which is the easiest way to check it works before you export a zip. If you unzip the Create Executable output separately and want to test it again outside the IDE, do not open index.html directly from your file system: browsers block the requests the game makes for its own data files over a file:// URL.
Serve it over HTTP instead. From inside the unzipped folder, run:
python -m http.server 8000
Then open http://localhost:8000 and play through the build.
Zip it for upload
- GameMaker's Create Executable output is meant to be unzipped and hosted, not uploaded as-is: unzip it to a folder first, confirm
index.htmlsits at the top next to your game's data files, then re-zip that folder's contents for naughty.games. - Stay under 250 MB unpacked and 2,000 files. Texture pages are the most common size culprit in recent GameMaker versions, so pack sprites into fewer, well-sized texture pages and compress source art before you import it rather than relying on the runtime to shrink it.
Common problems
- The game runs in the IDE but the exported zip shows a blank page. You likely tested it over
file://instead of a server. Serve it locally, or upload it and preview it on naughty.games directly. - Audio does not play or cuts out on the web. Audio support is more limited in HTML5 than on other targets. Check the
audio_system_is_availablefunction in the GameMaker manual for the standard workaround if sound refuses to start. - Save files do not seem to load.
file_existsonly checks local browser storage on the HTML5 target, not files on a remote server. Use GameMaker's own file and ini functions for saving, which read and write browser storage automatically on this target. - The download is huge for a small 2D game. Texture pages have grown in recent GameMaker versions. Make sure Use Built-In Particles and Use Built-In Font are off, and keep Texture Page size modest instead of maxing it out.
- The game feels slow or freezes compared to the desktop build. HTML5 is GameMaker's slowest target since it runs as JavaScript rather than native code. Limit blend modes, since they are expensive to run on this target unless you are using WebGL, and cut down heavy per-frame work, especially for phone players, since a large share of naughty.games traffic is on phones.
- A browser other than the one you tested in behaves differently. GameMaker's own setup guide recommends testing your HTML5 build across more than one browser before you ship, since WebGL and audio support both vary between them.
Publish it
Once your build runs cleanly from a local server, zip it with index.html at the top level (up to 250 MB unpacked and 2,000 files) and upload it to naughty.games, or send us an https URL if you would rather embed it. Review is usually about 2 working days, listing is free and non-exclusive, and any Patreon, Ko-fi, Steam or itch links inside your game earn you 100% of what they bring in. Head to /submit when you are ready.
Questions
- Which GameMaker licence do I need for HTML5?
- The Free licence includes HTML5 export but is non-commercial only. If you plan to earn money from the game, including through your own Patreon, Ko-fi or Steam links, you need the Professional or Enterprise licence for a commercial licence.
- What's the difference between HTML5 and GX.games?
- GX.games is a separate export that publishes to Opera's GX.games site. For naughty.games, or any other web host, use the plain HTML5 target, which gives you files you can host anywhere.
- Which GameMaker version does this guide use?
- Any current GameMaker release, monthly or LTS. HTML5 export steps have been stable across recent versions.
- Will player saves work in the browser?
- Yes. GameMaker's file and ini functions write to the browser's local storage automatically on the HTML5 target, so progress stays on that browser and device.
- Why is my HTML5 build so much bigger than my desktop build?
- Texture pages take up more space on the HTML5 target in recent GameMaker versions. Keep Texture Page size modest and turn off unused built-in particles and fonts to bring the download size down.
Sources
Free hosting, real players on phone and desktop, and a stats console.