Adventure Box Tips: Self-Publishing Part 1: Correct File Format

EmmyAdventure Box Tips, Tutorials

Hello!

So you have a game you’re super-proud of. So proud, in fact, that you want to share it with more people.

Well, there’s always social media, but there are also self-publishing sites!
Which is what we’ll be talking about today!
Now, there are loads of them to choose from, but to start with, I’ll go over two very easy and straightforward ones – Itch.io and Newgrounds.

To publish on these sites, the files need to be zipped HTML files named index. (Why? I don’t know, but just trust me, it’s needed)

So, first, copy any one of the codes below, depending on which website you choose, and paste them into a document like Notes or Notepad.
Here’s the code for itch.io:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Game Name - Itch.io Shell</title>
    <style type="text/css">
      html{border: none; overflow: hidden; height: 100%;}
      body{border: none; margin:0; padding:0;}
    </style>
  </head>

  <body>
    <script type="text/javascript">
	
    </script>
    <div id="contentdiv" style="top:0px; left:0px; width:100%; height:100vh; borders:none;">
    	<iframe id="content" frameborder="0" 
    	style="position:relative;top:0px;left:0px;border:0px none;padding:0px;width:100%;height:100vh;" 
    	src="*EMBEDDED GAME LINK HERE! PLEASE BEWARE DOUBLE QUOTATION MARKS!*&utm_source=itch.io&utm_medium=referral"></iframe>
    </div>
  </body>
</html>

And here is the code for Newgrounds:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Game Name - Newgrounds Shell</title>
    <style type="text/css">
      html{border: none; overflow: hidden; height: 100%;}
      body{border: none; margin:0; padding:0;}
    </style>
  </head>

  <body>
    <script type="text/javascript">
	
    </script>
    <div id="contentdiv" style="top:0px; left:0px; width:100%; height:100vh; borders:none;">
    	<iframe id="content" frameborder="0" 
    	style="position:relative;top:0px;left:0px;border:0px none;padding:0px;width:100%;height:100vh;" 
    	src="*EMBEDDED GAME LINK HERE! PLEASE BEWARE DOUBLE QUOTATION MARKS!*&utm_source=newgrounds.com&utm_medium=referral"></iframe>
    </div>
  </body>
</html>

Then, copy the game’s URL address.

… and paste it into this area (Make sure that the star symbols are gone, too – I just put them there to make it easier for you to see):

Don’t forget to name your name, too! Just write the game’s name by the title. (But don’t remove the Shell afterwards)

Then, save the file and name it index.html. This will turn the game into an HTML-file.

And finally, create a.zip file by right-clicking the file and selecting Extract To… and Compressed Folder (The little Folder symbol with a zipper on it):

There! Your file is ready to go!

Next post, I’ll show you how to actually publish these games!

For further questions, please send us an email at info@adventurebox.com

Or join our Discord server: https://discord.gg/eutfugR

Best Wishes,
The Adventure Box Team