Last updated: 19 Jan 24 20:10:40 (UTC)
Textbox or form entries, such as Enter Player Name
FIRST, this is a rather advanced option for your game that requires use of VARIABLES. If you’re not comfortable with these, you might want to save this Twine trick for another day.
In the passage, type the following code:
Name: <<textbox "$name” “">>
Name:
<<textbox "$name” “">>“Name” is the label for the input box. “<<textbox” tells Twine to create a box the user can type in. “$name” defines a variable.
“” is the default value in the box. Leave it as-is if you want the box blank; fill it in if you want a pre-entered value (e.g., “firstname”)
“>>” closes the code.
Make sure you have a link away from this passage.
Then, anywhere in the story you want your player’s name to appear, you use: $name
If you want to REQUIRE the textbox to be filled out, on the link to submit or go to the next passage (ALL of them), use (you can use <> or <>):
<<button "SUMBIT">> <<set $name to $name.trim().toLowerCase().replace(/\s\s+/g, "")>> /% trim() removes leading and trailing whitespace, toLowerCase() convert to lower case, replace turns multiple spaces between words into single spaces. you may want to omit some or all of these methods. %/ <<if $name == "">> <<replace "#textbox-reply">>\ Enter the text of your error message here.\ <</replace>> <<else>> <<goto [[linked passage]]>> <</if>> <</button>> <span id="textbox-reply"></span>
<<button "SUMBIT">>
<<set $name to $name.trim().toLowerCase().replace(/\s\s+/g, "")>>
/% trim() removes leading and trailing whitespace, toLowerCase() convert to lower case, replace turns multiple spaces between words into single spaces. you may want to omit some or all of these methods. %/
<<if $name == "">>
<<replace "#textbox-reply">>\
Enter the text of your error message here.\
<</replace>>
<<else>>
<<goto [[linked passage]]>>
<</if>>
<</button>>
<span id="textbox-reply"></span>