[Sugarcube 2.31.1] Changing the formatting of one specific word/variable

Authoring Twine
1

Basically, I want to make it so every time a specific word is used (i.e. “red”), that word is formatted in a specific way (i.e. it’s red and in a different font). My plan was to use a variable for this, but I couldn’t really find anything about adjusting formatting in-text, much less for strings, so I’m open to suggestions. At the very least, I’d appreciate if someone could tell me if this is impossible, so I can stop wasting my time. Thanks!

2

Yep, it’s possible. Here’s how I would do it.
In Story Stylesheet:

span.red {
	color: red;
	font-family: cursive;
}

This way you can put @@.red;red@@ in any passage and the styling would apply.

However

If you want to shorten it further you could use the Template API

In Story JavaScript:

Template.add(["red", "green", "blue"], function () {
	return "<span class=" + this.name + ">" + this.name + "</span>";
});

Then you just have to write ?red in your passage and it would be very easy to add more colors (or any words) to style. In the example above I’ve added "green" and "blue". You’d have to add this to the Story Stylesheet:

span.green {
	color: lime;
	font-family: serif;
}

span.blue {
	color: blue;
	font-family: fantasy;
}

Hopefully, this satisfies.

3

This works great! But now I actually have a bonus question: is it possible to change the formatting on the fly? For instance, halfway through the game, the word red suddenly becomes blue.

4

At that point, you’re probably better off with a Macro.

In Story JavaScript:

Macro.add(["red", "green", "blue"], {
	handler() {
		$(document.createElement("span"))
			.addClass(this.args[0] || this.name)
			.wiki(this.name)
			.appendTo(this.output);
	},
});

(no changes to Story Stylesheet)

<<red>> would still be red-styled red but <<red "blue">> would be blue-styled red. Same deal with <<green>> and <<blue>>.

You could also use a variable; <<red $red>>.

5

Hmm. Looks like I’ve got a lot of work ahead of me. Thanks for all the help!