How to embed your HTML5 games

  • Resolved Newby_Newby

    (@newby_newby)


    11 years, 3 months ago

    My kid makes HTML5 game with Construct 2.
    I have a webserver Apache, PHP, MySQL, WordPress.
    I would like to embed hes game project into a web page.

    It seem that it is possible with Iframe but I dont know how to create the script to make it work.

    The project is locate into the hard disk of my server at (C:/Program%20Files/Apache%20Software%20Foundation/Apache2.2/htdocs/HuguesVenture/index.html)

    I tried this script but it does work…

    [iframe src=”C:/Program%20Files/Apache%20Software%20Foundation/Apache2.2/htdocs/HuguesVenture/index.html” width=”360″ height=”480″]

    Someone can help me?

Viewing 7 replies - 1 through 7 (of 7 total)
  • Moderator James Huff

    (@macmanx)

    11 years, 3 months ago

    The source is always relative to the viewer.

    So, when my browser sees C:/Program%20Files/ it’s actually trying to find the file in the “Program Files” directory on my computer, which of course doesn’t exist at all.

    You will need to use the public-facing URL of that file instead.

    Thread Starter Newby_Newby

    (@newby_newby)

    11 years, 3 months ago

    Thanks MacManX.
    It should be possible to be able to upload the game files into WordPress so then the files will have an URL address??? Do I need a plugin to store files or it’s embeded into WordPress???

    Moderator James Huff

    (@macmanx)

    11 years, 3 months ago

    No, WordPress doesn’t support uploading that file type, but since you have server access you can drag the files over to the web root instead. Place them in WordPress’s uploads directory, that way you know what the public facing URL will be. 🙂

    Thread Starter Newby_Newby

    (@newby_newby)

    11 years, 3 months ago

    It’s a really good idea 🙂
    I’m very biginner but I like to learn.
    I guess, if I put the files into the upload directory, the URL will be:
    http:\\myaddress\upload\index,html
    If I create a folder into the upload directory it works?
    http:\\myaddress\upload\GAME\index,html
    I’ll try that this evening and I give you an update.
    I really appreciate your help !!!!

    Moderator James Huff

    (@macmanx)

    11 years, 3 months ago

    So, WordPress’s upload directory is at /wp-content/uploads/ and there are further directories down in the structure of /wp-content/uploads/[year]/[month]/[uploaded-files.whatever]

    To keep things organized, with non-WordPress uploads separated from WordPress uploads, I recommend creating a special directory in there, like /wp-content/uploads/other/ where you’d put /wp-content/uploads/other/[game]

    That way, you know your game’s public-facing URL will be http://myaddress/wp-content/uploads/other/[game] (remember, public-facing URLs use forward slashes) and so your iframe would be:

    <iframe src="http://myaddress/wp-content/uploads/other/[game]" width="360" height="480"></iframe>

    (remember, HTML uses greater-than and less-than symbols around elements, not brackets)

    Thread Starter Newby_Newby

    (@newby_newby)

    11 years, 3 months ago

    Thank you very much!!!!

    I add the game folder into:
    ../wp-content/uploads/games/FirstGame/

    And I put this script into the web page:
    [iframe src=”http://MyWebSite/wp-content/uploads/games/FirstGame/index.html&#8221; width=”320″ height=”480″]

    It works!

    I learn a lot about the URL vs folder and IFRAME.

    I’m very happy!!!

    Thanks!

    Moderator James Huff

    (@macmanx)

    11 years, 3 months ago

    You’re welcome! 🙂

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘How to embed your HTML5 games’ is closed to new replies.