Most free websites have their own way to create web pages, script files and
images. To get an idea of how to copy some of our projects into a real website,
we’ll take a look at putting one of our 3D animations on Tumblr.21.3 Putting Your Code on Another Site
This section assumes that you already have a Tumblr account (or an account
on a similar service). The instructions should work for most sites, but all
posting services have their own quirks that you may have to debug on your
own. Also note that the Tumblr controls may change over time and may not
look or work exactly as shown here.Posting our code to Tumblr is pretty easy. Start a post like normal, but be
sure to click the <html> button in the post’s toolbar:The <html> button should be blue when enabled (but it might be a different
color, depending on your Tumblr theme).Next add some HTML and a place for your simulation to go. The following
creates a short paragraph, followed by a spot for your 3D game, followed by
another short paragraph:<p>I made this!</p>
<div id="ice-code-2013-06-06">
<p>It's in the first chapter of
<a href="http://gamingjs.com">3D Game Programming for Kids</a>.
</p>It’s important that the id= attribute for the <div> be unique—that there are
no other tags with the same id= anywhere on the page. A good tagging scheme
to use is a combination of the purpose (ice-editor) and today’s date (2013-06-06,
for example). You can change the words inside the <p> tags to be whatever
you like.Next, copy your code from ICE and paste it into the Tumblr post. When
copying code from ICE, be sure to skip the first line that contains <body></body>.
Only copy from the first <script> tag to the end.Paste this into the Tumblr post below the HTML that we added earlier. (See
Figure 10, The Tumblr Post, on page 214.)We’re not quite done. The code we’ve been writing in this book takes up the entire
browser window. In these posts, we want to take up only a small portion of the
post. We also want to attach our animations to the <div> that we added earlier.report erratum • discussPutting Your Code on Another Site • 213
Prepared exclusively for Michael Powell