#twine code

Hey Veirse!

That's totes possible. And there different ways of going at it (depending on what you want to do with your page, and how far you want the description to appear).

As always, the code below can be found on my PasteBin account.

How To Toggle a Description!

Chapel's Message Macro

The MVP of SugarCube custom macros has something to help: the << message >> macro. It allows you to toggle a part of text by clicking on a link. Click once, it appears. Another time and it disappear. It's pretty much the << linkappend >> macro, but you can hide the text again.

You just need to add the Macro code to the JavaScript, and use the macro as such:

<<message "Clickable Text">> Description Text/Message to appear <</message>>

Note: by adding btn after the "Clickable Text", the links become a button instead.

This method is nice if you want the text to appear just below the link. If you want a working example, check the Drawers section in Scene 1 of CRWL.

CyCy's Liveupdate Fix

Technically, not specific to your case, but still works. I've used it for the toggable menu of Exquisite Cadaver (which uses the Simple Book Template). This method is similar to Chapel's macro, but the toggled text doesn't have to be just below the link.

You can find CyCy's Liveupdate Custom Macro here, just need to add that to your JavaScript. Then it is just a matter of creating a link and some conditions:

<<link "Clickable Text">> <<if not $trigger>> <<set $trigger to true>> <<else>> <<set $trigger to false>> <</if>> <<update>> <</link>> <<liveblock>> <<if $trigger>>Description Text/Hidden Message<</if>> <</liveblock>>

Note: if you have multiple << liveblock >> on the page, the << update >> macro will trigger them all.

Maliface's On/Trigger Macro

Works like Cycy's but you can target one block rather than all of them. You can find the JavaScript code here, and the manual there. And it goes something like this:

<<link "Clickable Text">> <<if not $trigger>> <<set $trigger to true>> <<else>> <<set $trigger to false>> <</if>> <<trigger 'blockname'>> <</link>> <<on 'blockname'>> <<if $trigger>> Description Text/Hidden Message<</if>> <</on>>

Note: Chapel's Event Macro uses the same macro name. These two macros cannot be used together, unless the name of one of them is modified in the JavaScritpt (Macroadd line)

Span, Link and Replace

And finally, if you want to go OG Sugarcube Code, here's the thing: using the << replace >> macro. It's essentially Maliface's On/Trigger Macro, but with the Base SugarCube Macros.

I have used this option in TTATEH (asking questions) and La Petite Mort (doing actions).

You will need: a span (div works too) with a defined ID/Class, a link, a conditional statement and the replace macro.

<<link "Clickable Text">> <<if not $trigger>> <<set $trigger to true>> <<replace "#target" t8n>>Description Text/Hidden Message<</replace>> <<else>> <<set $trigger to false>> <<replace "#target" t8n>><</replace>> <</if>> <</link>> <span id="target"></span>

Notes: the t8n adds a transition effect to make the new block appear. If you want to target a class instead of an idea, change the # into a . and the id into class.

Turns out that coming back a year after starting to learn this leaves you clueless as to what you did, why you did it, what it does, and how to do it again. Past-me learned and forgot.