0 votes
by (170 points)

Hi! I'm pretty new in twine and started out with Harlowe, but changed to SugarCube to have more options with CSS.

I'm re-writing my story now and I managed to understand how to replace the link-reveal I used in Harlowe replacing the immediate text like this:

<span id="this"><<click "this">><<replace "#this">>this is my example</span><</replace>><</click>></span>

What's happening now is that I had certain text to trigger another one a few words after. Right now in Harlowe it's something similar to this:

My (link-reveal: "hat")[(show: ?loveit)] is blue. |loveit)[I love it]

Is there a way to do the same thing with SugarCube?

2 Answers

+1 vote
by (2.2k points)
selected by
Best answer

I think maybe first example can be rewritten into simpler form using <<linkreplace>>:

<<linkreplace "this">>this is my example<</linkreplace>>
// or 
<<linkappend "this">> is my example<</linkappend>>

And second one can be implemented using <<link>> and <<append>>

My <<link "hat">><<append "#hat">>I love it!<</append>><</link>> is blue. <span id="hat"></span>
// or (it doesn't matter in this case)
My <<link "hat">><<replace "#hat">>I love it!<</replace>><</link>> is blue. <span id="hat"></span>


by (170 points)
Omg thank you so, so, so, so much! You saved me with this!
+1 vote
by (68.6k points)
edited by

A more or less direct translation would be something like the following:

My <<linkappend "hat">><<removeclass "#loveit" "hide">><</linkappend>> is blue. @@#loveit;.hide;I love it@@

Which requires the style:

.hide {
  display: none;


Alternatively, you could achieve the same effect without needing the style with something like the following:

My <<linkappend "hat">><<replace "#loveit">>I love it<</replace>><</linkappend>> is blue. @@#loveit;@@


SEE: <<linkappend>>, <<removeclass>>, <<replace>>, custom styles markup.

PS: The <<click>> macro has been deprecated for a while now, <<link>> is its replacement.