Can I use Inform 7 with Wordpress? If so how?

Hi all,

I hear from a knowledgeable source that this is the place to go for wisdom and know-how. Thanks in advance to anyone who has information for me!

My situation and question:

I have a site hosted on “my” server (actually Blue Host’s) using Wordpress.

Would it be possible to have users run an interactive fiction game built in Inform 7 and using something web-based (like Quixe or Parchment?) that would run from the site? If so, how would we do it?

We’d prefer to stay inside the Wordpress environment and existing theme (a child theme of Twenty Ten) if at all possible. But not closed to other possibilities - the main thing is we want this as integrated with our site as possible, and able to be played on the web but site visitors.

I have to keep in mind that my technical know-how is self-taught based on need, and very spotty.

In case it is of any use, the site itself (a satire site) is here: Thatz Effed Up

Again, thanks in advance for any advice, info etc.

Michelle

1 Like

I’m on it!

Looks like you’d have to use an Iframe plugin without modifying WP and/or the template files.

Note: Iframes are evil.

Also Note: There would be zero communication between the game and Wordpress. So WP couldn’t automatically grab a player’s score for a leaderboard or anything.

I think creating a WP template file for Parchment would be the only good way. I haven’t tried it, but I see no reason it couldn’t be made to work.

And as I4L stated, without getting really fancy, there is no communication between WP and the game, so it would just be a stand-alone game.

Interesting idea though… I may give it a shot when I have a bit more time. I have a WP site that could use an IF game for instructional purposes. In fact I had planned on writing one, but running it outside of WP. This could be an interesting challenge.

You’d have to add the JS to the header of your template files, or possibly to the PHP files themselves. (I don’t remember anymore how WP is built and I’m too lazy to look at the moment.) You can’t call it from inside a page or post for security reasons, though there might be a plugin for that as well.

I don’t think it would be extremely difficult to do. But if you’re trying to keep it basic, something like an Iframe embed is the only way to really go with it. Plus if you add your JS includes to the template, you’re calling them from every single page, even if that page isn’t game related. This in itself isn’t necessarily a bad thing, just kinda sloppy.

I do wish there was some kind of output for the score. Maybe in the save…?

The easiest way is to use an

Actually, you can just create a new template, and only use it for your Inform games. I had to do this for a purchasing system in WP. All of the scripting is hidden on the page itself at the bottom. Then when you create a WP page where you want to embed a Parchment game, you change to that template and use the standard template for all of your normal pages.

There is a plugin that allows you to run script files from within a page, but I have never tried it so I can’t say how well it works.

That does sound like an easy way. Any drawbacks to the iframe approach?

I’ll have to give it a try once I get done creating the site I am working on. Ironically, it is a WordPress site. :wink:

There are a LOT of drawbacks to iframes in general, but I don’t think there’s any real harm in this instance, since the IF is the only thing that would be running in it and you wouldn’t really be able to navigate anywhere else.

I’m really appreciating the info flowing in here.

Thank you all! Keep it coming as you have it, please!

Much of this is beyond my current knowledge level but feels quite possibly learn-able (at least some of it). I’m sure I’ll have more questions as this project proceeds.

Michelle

And now that I’ve thought about it, the first avenue I’m going to try is what Seeker suggested:

Of course I haven’t ever created a new template (just made a child theme of something already existing and in that just messed with the css side), let alone tried to have it apply only to a specific page, but all of this is a learning curve for me. I know I’ll have questions.

If that doesn’t work I’ll look at Iframe.

Onward… and with appreciation,
Michelle

Okay, I had to give it a try… and iframes seem to work well. Except Parchment uses a wide enough gameport that you have to scroll right to be able to read an entire line of the game.

I am “self-hosting” Parchment and using individual HTML pages to load different games.

Maybe Dannii can help here… is there a way to shrink the window of Parchment down so it fits in a narrow window? I tried playing with this line in the HTML file that loads the game:

By changing the “width=device-width” part and adding literal values…

But nothing seemed to change. Is it in the CSS file maybe? This kind of a cool idea, and I would like to get it working without the scroll bar at the bottom if possible.

Thanks for any help.

Edit to add: I am going to try the template method also at some point. Iframes was just a quicker test. :smiley:

Seeker, do what I said and add the options parameter to the end of the iframe’s URL. Then there will be no need to self host it (though you still could if you wanted to.)

I am not sure where to put this to make it work. Is this to pass a parameter to Parchment to shorten the lines it outputs? My first test was using:

As the iframe call. This works, but the text output is too long per line. I know I can change the iframe width by changing the width command. I tried adding ;options=%7B%22width%22%3A30%7D (should be a width of 30) at various places, with and without removing the existing width command. At best it just changes the iframe width, the text from the game is still longer than the iframe window and there is a scroll bar at the bottom.

I am trying to get Parchment to shorten its output lines. As it is now, Zork (which I am using as a test) displays this no matter what width or option I choose:

You are standing in an open field west of a white house, with a boarded front door.
(all on a single line with a scroll bar to scroll right to see what does not fit in the iframe)

What I need it to display is:

You are standing in an open field west of a white house, with a
boarded front door.
(line wraps after “with a” so it ends up being 2 lines)

Am I just missing where to put the “;options=%7B%22width%22%3A30%7D” command so that it is passed to Parchment correctly?

It is a 3 column WordPress install, so the center window, where this plays, is narrow. Maybe 68 characters max.

<iframe src="http://iplayif.com/?story=http://www.batmantis.com/zorks/zork1.z5;options=%7B%22width%22%3A30%7D"></iframe>

Should do what you want.

That code works great! Loads up perfect. But I can’t load any files from my own server. In my HTML files (the index.html from the Parchment download, altered and renamed) I am using:

To auto load a file, and that loads the file fine. But if I try:

I get a red box that reads:

I know the path is correct…

Is it maybe using a non-standard port that I need to open on the firewall? Something other than port 80? Or is there a way to add the “options=%7B%22width%22%3A30%7D” to the auto load line in the html file? That would be the best solution, at least for me. I tried several variations, but none worked.

And by the way, thanks for the help. I know it isn’t your problem. I appreciate your time on this.

It’s very hard to help without knowing the actual file you want to load… can you just post the actual URL?

What I’m thinking about is AJAX. Just ajax the interpreter onto the page, and modify it so that everything is an accessible variable. Then have a script somewhere else on the page which would regularly grab saves, scores and suchlike and store them server-side. This would require much work, but if you just want score, then it’s doable. No iframes involved. Also, with enough CSS, you could restyle the console so that it wraps the content nicely.

Here is the URL of a game file…

seekerspath.org/parchment/stories/curses.z5

There is also a curses.z5.js file in the same folder if you would prefer to use it. And if you enter the URL with the .js extension into a browser, the code comes up, so I know the folder is accessible and it probably isn’t a permissions issue.

Not my game of course, but I chose it for the test since I had both versions of it available in the stories folder.

Thanks.

That URL gives me a 404 error.