Note that these instructions also appear here in expanded form.

First, I prepared my files:

• Before I exported my applet, I gave my sketch a good name, like “golan-demo”.
• This project name is good because it contains no caps, no spaces,
  and because it includes my name and project title.
• I edited my applet’s HTML file so that the div margins were 0 (zero).
• I also renamed my applet’s HTML file to “golan-demo.html” instead of “index.html”.

Then I uploaded the files to the blog, and edited the post:

• I uploaded the applet’s HTML file. I copied the URL that was generated by WordPress for the uploaded asset: https://ems.andrew.cmu.edu/2010spring/wp-content/uploads/2010/01/golan-demo.html
• I also uploaded my project’s .jar file, the “loading.gif”, and the Archive zip of my project.
• Then I inserted the IFRAME HTML code, in the post’s HTML editing mode.
  It looked like this:

  <iframe frameborder=”0″ src=”https://ems.andrew.cmu.edu/2010spring/wp-content/uploads/2010/01/golan-demo.html” width=”600″ scrolling=”NO” height=”350″></iframe>

and it produced this:

Here are some important last notes:

• I gave my uploaded Post the Category, “Project-0”, so that it could be found alongside its sister projects!
• If I didn’t feel like using the IFRAME, I could also just have created a link to the uploaded HTML file (as long as I also uploaded the other assets, like the .jar file):
  https://ems.andrew.cmu.edu/2010spring/wp-content/uploads/2010/01/golan-demo.html
• Once you add the IFRAME code, It’s important to never edit this post again in “Visual” mode (non-HTML), or else the IFRAME code will get accidentally clobbered by WordPress, which is sucky.