-
Notifications
You must be signed in to change notification settings - Fork 0
/
Twine-Intro-Game-Archive.html
72 lines (61 loc) · 5.33 KB
/
Twine-Intro-Game-Archive.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<tw-storydata name="Intro-To-Twine" startnode="1" creator="Twine" creator-version="2.2.1" ifid="F5A7346D-23DE-43B3-B7EE-C10F1EC21F53" zoom="1" format="Harlowe" format-version="2.1.0" options="" hidden><style role="stylesheet" id="twine-user-stylesheet" type="text/twine-css">@import url('https://use.fontawesome.com/releases/v5.5.0/css/all.css');
body, tw-story {
background-color: white;
color: black;
}
code {
font-family: monospace;
background-color: #f9f9f9;
border-radius: 4px;
border: 1px solid #969696;
padding: 2px;
}
h1{
font-size:16px;
}
h2{
font-size:14px;
}
a{
text-decoration: none;
}
.example{
border: 1px black solid;
border-radius: 3px;
margin: 10px;
}</style><script role="script" id="twine-user-script" type="text/twine-javascript"></script><tw-passagedata pid="1" name="Get Started" tags="" position="541,167.5" size="100,100">**Getting Started with Twine and Harlowe**
What do you want to learn how to do?
[[Add links to other passages]]
[[Create simple programming]]
[[Change the styling->Format text]]</tw-passagedata><tw-passagedata pid="2" name="Add links to other passages" tags="" position="390,332.5" size="100,100">**Adding links to other passages**
While editing a passage, you will often want to link to other passages. Links in Twine are surrounded by <code>`[[ ]]`</code>.
**Linking by passage name**
If you already have other passages created, when you type <code>`[`[</code> a menu will pop up where you can choose from those existing passages. You can also create a new passage by typing the new passage's name within the <code>`[[ ]]`</code> tags. When you return to the story map, you will see the new passage linked to the original one with a directional arrow. You can then open and edit it. One thing to note is that if you use this method, then later go back and change the link text, it will become unlinked from the first passage and create a new one titled with the new link text.
**Linking with other text**
If you want the text of the link to be different from the passage name, you can denote that with <code>`[[link text->passage name]]`</code>. This could be useful if you want all your passages to have unique titles but have multiple places where the link text would be the same. This is also useful if you have multiple passages linking out to the same one using different text.
**Examples**
<code>`[[Go to the next page->next page]]`</code> = [[Go to the next page->next page]]
<code>`[[Example passage]]`</code> = [[Example passage]]</tw-passagedata><tw-passagedata pid="3" name="Format text" tags="" position="688,334.5" size="100,100">Individual text can be formatted using in-text notations or [[macros->Create simple programming]].
**In-text notations**
<code>`//`Italics`//`</code>= //Italics//
<code>`''`Bold`''`</code> = ''Bold''
<code>`~~`Strikethrough`~~`</code> = ~~Strikethrough~~
<code>Super`^^`Script`^^`</code> = Super^^Script^^
To change the styling of the entire story, you'll need to know a little CSS. </tw-passagedata><tw-passagedata pid="4" name="next page" tags="" position="390,482.5" size="100,100">This passage is titled "next page".
[[Go back->Add links to other passages]]</tw-passagedata><tw-passagedata pid="5" name="Example passage" tags="" position="280,482.5" size="100,100">This passage is titled "Example passage".
[[Go back->Add links to other passages]]</tw-passagedata><tw-passagedata pid="6" name="Create simple programming" tags="" position="517,381.5" size="100,100">**Hooks**
Special text in Twine is created using a functionality called Hooks. Wrap the section of text to be affected by the hook in <code>`[ ]`</code>.
**Macros**
You can affect hooks with functions called macros. These are created by writing the macro surrounded by <code>`( )`</code>, then the hook text (surrounded by <code>`[ ]`</code> as usual).
Macros can be used for many purposes. One is to add special styling to one piece of the passage, such as turning text a certain color or changing the font.
Example: <code>`(color:green)[This text is green]`</code> = (color:green)[This text is green]
**Naming Hooks**
You can name a hook using the <code>`[hook text]<`name`|`</code> syntax (this is meant to look like a gift tag). Naming a hook means that you can keep the main text of your story clean, then add functionality at the bottom of each passage.
Naming also allows you to reference hooks in other places. For example, you can turn a hook into a link that will show more text on the page when clicked.
**Example**
<code>`[Click me!]<clickable|`
`(Click: ?clickable)[Then I show up]`</code> =
[Click me!]<clickable|
(Click: ?clickable)[Then I show up]</tw-passagedata><tw-passagedata pid="7" name="footer" tags="footer" position="247,206.6666717529297" size="100,100">
[[Return to Home->Get Started]]
Alex Brenon, 2018</tw-passagedata><tw-passagedata pid="8" name=" " tags="" position="170,484.5" size="100,100">Double-click this passage to edit it.</tw-passagedata></tw-storydata>