How To Make Your Own Interactive Stories
I've had a number of people requesting instructions on how to make your own interactive stories. So I've dedicated this page to explaining how to write your own interactive story.
To make a story you need to have a bit of knowledge about HTML and JavaScript programming. It's hard to grasp at first, but after a while you soon understand it.
The whole story, prompts (the boxes that appear and ask you a question) and words that get inserted revolve around the JavaScript code that I'm going to explain. You need to view the HTML of the page you're doing the story on. Most, if not all, HTML programs and online site builders let you do this.
Inside the <BODY> of your page, first put:
<script
language="JavaScript">
<!-- ;
alert("Follow the instructions to
make up a story all about you and Blue!");
// end hide --></script>
That is the first pop up message that you see, where you press OK. You can change the text inside the speech marks to whatever you want. After that, begin to write your story. Carry on writing until you want a word decided on by the user. When you want a word decided on, like a name, place, colour, object, etc., insert this code:
<script><!-- iniciar
var blueboy = prompt("Name a Blue boy","")
document.write(" " + blueboy + " ") // finalizar -->
</script>
This will ask for a name of a Blue boy. You need to give the prompt a name. I've named this 'blueboy' as you can see, but you can change the name to whatever suits the question. You have to insert the name twice. The word that you've asked for will now be inserted into the story. If I wanted to ask the user for a name of a best mate in this sentence: 'As you walked down the stairs you saw your best mate (name) at the bottom...' the story so far would look like...
<script
language="JavaScript">
<!-- ;
alert("Follow the instructions to
make up a story all about you and Blue!");
// end hide --></script>
As you walked down the stairs you saw
your best mate <script><!-- iniciar
var bestmate = prompt("Give a name for your best mate","")
document.write(" " + bestmate + " ") // finalizar -->
</script> was outside
The word 'prompt' in the code is the little pop up window that asks you a question, and the 'document.write' writes that answer into the story. Carry on writing until you want to get another word from the user. Use the same code, but change the question and it's also important to change the name given to the question in the two places.
Now you know how to ask for questions and insert the answer into the story. If you want a word you've already used in the story to be repeated, here's how to do it. For example, if I asked for a Blue member's name and wanted to use it again and again in the story, I wouldn't have to bother with asking the whole question. Use this much shorter code:
<script><!-- iniciar
document.write(" " + blueboy + " ") // finalizar -->
</script>
This just writes the word that's already been asked again. I have 'blueboy' in the script because that was the name of the question asked. I said you needed to name the question, and that is why, so the answer can be included again later on. Carry on writing the story, inserting the code for prompts wherever they're needed, and the code for words already asked when they are needed.
And there you have it! I can't think of any other ways to explain it, you just need to know about HTML.