Link

Links are the main navigation element in Hypstory. They enable the readers to move from one card to another. Hence, links make a story interactive and, potentially, nonlinear.

Create a link

In its most basic form, a link starts with the :LINK: tag followed by the unique name of the card it connects to.

In this example there are two cards, each with a unique name. The card named first contains a link that leads to the card with the name next. That name is also displayed as the link's text.

Practice tip: Try changing the word "next" in line 3 to "second", hit the update button and click on the link. Do you see why the link didn't work? Now change the name of the card on line 4 to "second", hit update again and click the link.

Link text

In many situations you will want links to display text other than the name of the target card. For that, simply write the link text before adding the unique card name. Separate the two blocks with a pipe character: |.

In this example the :LINK: elements have two building blocks separated by a pipe (|) character. The first one is the text that will be displayed to the readers. The second one is the unique name of the target card.

Links in paragraphs

In the examples above each link has its own line. There is no text before or afterwards on the same line.

But you can also use links inside text paragraphs. Just mark the end of the :LINK: element with a double colon (::).

The double colon is the closing tag for a number of tags in Hypstory.

Link shorthands

There are two handy alternatives for the :LINK: tag: the short generic :L: tag and the double pipe tag ||.

Everything you can do with the first can be accomplished with the other two in the exact same way. The only difference: The closing tag for a || element is another double pipe.

Workflow tip: As with all Hypstory tags, you can choose between uppercase and lowercase letters. :LINK: and :link: work just the same. You can even use :Link: or :LiNk: if that's how you like it.