Trouble with using variables with the Speech Box System

Twine Version: 2.3.16
Story Format: SugarCube 2.36.1

Hi everyone!

I’m trying to use the character macro with two different variables so a different image will be shown depending on the character’s gender and their mood.

This is what I have:

<<character ‘Sydney’ 'file:///C:/Projects/An Elemental Existence/images/Sydney/' + $sGender + $sMood + '.png'>>

The images inside the Sydney folder are named properly, I think? For example, I have “femalehappy”, “malehappy”, “femaleneutral”, etc.

However, I get this error instead of showing the image:

Firefox can’t find the file at /C:/Projects/An Elemental Existence/images/Sydney/undefinedundefined.png.

Could anyone pls tell me what I’m doing wrong? Thanks.

Welcome Beeanca,
I don’t know the Speech Box System, but from what I read, you got trouble trying to use two variables. May I suppose you already made it work while using only one variable? If so, have you tried to combine these two variables in one variable?

Also, please considere to use the </> button, this button allows to reproduce exact code, while a copy/paste outside of this button may modify certain signs.

1 Like

As explained in the Macro Arguments section of the documentation, when passing an expression as an argument to a macro you need to wrap that expression within back-quote characters so the expression gets evaluated first before its result gets passed to the macro.

You are using an Absolute (pathed) URL to reference the image being stored on your local drive, likely so that the image will appear within the Test and Play options of the Twine 2.x application.

The issue with doing that is that you’ll later need to edit all such URLs to remove the file:///C:/Projects/An Elemental Existence/ part before you build a “release” using the Publish to File option, because the end-users aren’t likely have such a path on their local drives.

It is generally advised to use the Publish to File option to create a Story HTML file when you want to test/view images, in your case you would save that file within the C:/Projects/An Elemental Existence/ folder on your local drive. Then you can use a Relative (pathed) URL (like to reference that image, which means the end-users will also be able to see the image in your “released” version of the project.

The following two examples show: a fixed version of your original code; as well as one using a Relative URL.

<<character 'Sydney' `'file:///C:/Projects/An Elemental Existence/images/Sydney/' + $sGender + $sMood + '.png'`>>

<<character 'Sydney' `'images/Sydney/' + $sGender + $sMood + '.png'`>>

note: some Authors will use a variable to store the “absolute” part during development, and then edit that variable’s value just before creating a “release” version of their project. One such way to do that is to add code like the following to your project’s StoryInit special passage…

<<set setup.path to "file:///C:/Projects/An Elemental Existence/">>

…then change the URL referencing the external media files to include that variable…

<<character 'Sydney' `setup.path + $sGender + $sMood + '.png'`>>

…making sure that the remember to change the variable’s value in StoryInit to the following before creating a “release” of their project…

<<set setup.path to "">>

The reason I’ve used a variable defined on the special setup object instead of a Story Variable is because that variable’s value doesn’t change during the playthrough of the project, so there is no need to persist that value in either the History or Save systems.

Thanks! I actually did use the back-quote just like in your examples, but I messed up when reproducing the code here lol

I’m a little confused, though. Is the error showing up because I’m using an Absolute URL? I actually have used the Publish to File and saved it in the exact path you said, but an error still showed up when trying to show images, which is why I’m using an Absolute URL.


I actually hadn’t tried only one variable. I just did and got the same error LOL Sorry for the silly question, but how exactly would I combine two variables in one?

I’m not sure where you stand right know. Have you fixed your problem with Greyelf’s excellent advices? Backquotes should work with most problems of combining strings of characters.

For the not-so-silly question, I incorrectly assumed you made the macro work with only one variable, because you were saying you had trouble with two variables. So, by combining the variables I intended something like adding them in a temporary variable:

<<set _gendermood to $sGender + $sMood>>

It would have fixed the trouble with two variables if there weren’t any with only one variable. Not very useful in the end as you didn’t previously managed to make the macro work with only one variable.

Unfortunately, no. I was already using backquotes in my original piece of coding, I just messed up when pasting it here.

And thanks for teaching me how to combine two variables into one! Might not help me with this specific problem but I’m sure it will be helpful in the future.

Could you, please, tell me the url to the page where you’ve seen the <<character>> macro? Maybe if I can paste it I may find how to.

Here you go! It’s a custom macro. :slight_smile:

Thank you Beeanca,
I’ll have to check at home, son don’t expect an answer for a few hours.

1 Like

If I understand correctly you have to put the <<character>> macro in the StoryInit passage. This macro will be read only once, so you can’t modify it later. If you need different portraits, say for different moods, you’ll have to create different characters.
For instance:

<<character "lisa" "Lisa" "Portraits/lisa.jpg">>
<<character "lisaangry" "Lisa" 'Portraits/lisaangry.jpg'>>

There I’ve set two versions of Lisa. One default mode, and one where she’s angry. I can call the default mode by the <<lisa>><</lisa>> macro, and the angry mode by the <<lisaangry>><</lisaangry>> macro. The displayed picture will not be the same, but the displayed name will be (in both cases Lisa).

For instance:


If I’m not sure what Lisa’s mood will be, that’s when I use the <<say>><</say>> macro:

<<set $mood to "">>
<<set _character to "lisa" + $mood>>

<<say _character>>So?<</say>>

In this case I chose the default Lisa. Of course, Lisa’s mood might have be defined way earlier maybe passages earlier.

In some cases the character with whom the main character will speak might not be always the same. No trouble:

<<set $npc to "lisa">>
<<set $mood to "angry">>
<<set _character to $npc + $mood>>

<<say _character>>You're sure? I might like it better than you!<</say>>

Both $npc and $mood may have be defined earlier than the current passage.

Bottom line: if you want to have portraits depending of the mood, you need one <<character>> macro by character and by mood. And you either call with <<nameofthecharacter>><</nameofthecharacter>> or <<say>><</say>>.

Ah, I see! Can’t believe I didn’t catch that.

Thank you very much!

1 Like

Twine: 2.3.16
SugarCube: 2.36.1

This doesn’t work for me. I put:

<<character "alice" "Alice" "img/people/avatar.png">>

in StoryInit, and

<<alice>>"Hello, can I help you?"<</alice>>

into a story passage. But when I try to run it, from the publish file html, I get a popup that tells me:

This page says
As error has occured. You may be able to continue, but some parts may not work properly,
Error [StoryInit]: macro << character>> does not exist

I click OK, and the page also gives me:

Error: macro << alice>> does not exist “Hello, can I help you?” Error: macro << /alice>> does not exist

Did I miss something in your answer? I am not very experienced with Twine, so there may be some simple answer, but I can’t find it. I tried substituting " " with ’ ', but that doesn’t help.

Isn’t there a part about something to copy and paste in your javaspcript? If so, did you copy and paste?

I’m sorry, but I couldn’t find anything about copying to the JavaScript. Which part do I have to copy/paste?

At the top of the linked page there’s a ‘Downloads’ link.

Got it, thank you.

One final thing, though. Do you know how to remove the visible lines in the text box? It stretches fully across the screen even if there is only a small amount of text. I am hesitant to make any change to the JavaScript without checking I am doing the right thing.

Sorry again, but I’ve just realized it isn’t responding to my $gender call. The initial code you supplied:

<<character 'Sydney' `'images/Sydney/' + $sGender + $sMood + '.png'`>>

didn’t work for me, but

<<character "you" "$name" "img/people/you/you_avatar.png">>

works if it’s a single image. But my character could be male or female, depending on player choice, and neither this:

<<character "you" "$name" <<if>> "$gender = male" "img/people/you/male_avatar.png" else "img/people/you/female_avatar.png"<</if>> >>

nor this:

<<character "you" "$name" "img/people/you/' + $Gender + '.png">>


This works for a regular image:

<img @src="'img/people/' + $gender + '.jpg'" class="float-left">My name is <<print $name>> <<print $surname>>. I am a <<print $age>> year old <<print $gender>>.

So I’m back to square one, I’m afraid. I’ve made a mess of it somewhere, but I struggle with variables.

You might want to read again the post noted as solution after a break, in order to have a fresh mind. It worked for Beeanca, so it should work for you too.