New User Questions [Harlowe page formatting]

Twine Version: 2.7.0

I am new to Twine and new to coding in general. I started a couple of days ago and I am having fun troubleshooting problems as they come up but I have a couple I have not been able to find answers for. Would anyone be able to speak to these?

1.) Is there a line of code that will let me add a background image for all of my passages in Harlowe? Google showed me a few examples that would use the Stylesheet but I haven’t been able to make any of them work.

2.) Is there a way to make it so that lines come together in a passage? What I mean by that is, I built an inventory page. And say I’ve made it so 3 choices appear:

Health Potion

Right now if the player only has a Sword and Health Potion, the Passage shows them the gap that would normally be occupied by Shield.

Edit:3.) (because I forgot to include it before) - Is there a way to change the name of a Passage (or at least what the player sees) if a certain condition is met? For example, if a player goes to a passage called North and discovers a cave there, is there a way to call the Passage cave each subsequent time they visit it?

I keep coming up with new questions, and I’ve managed to work out a solution to most of them myself so far but these couple have eluded me (I’m sure I’ll stumble across more). Thank you to anyone who can provide insight.

For your second question, Harlowe allows you to use \ at the end of lines to ignore the next line of code/content. It also uses { } to wrap around all content that should be one line. It’s really useful if you have text content and code mixed together so that your code can be on separate lines for readability.

This \
should appear \
as \
one line.

should appear
as one line
as well.

Note: Careful not to have anything (even a space) after the \.

I’ll look at your other questions later today and see if I can provide some answers for you.

Question 1: Google probably gave you something like background-image: url("blah"), but CSS stylesheets require a selector which identifies which part of the page the css rule applies to. Paste the following in the story stylesheet:

tw-passage {
	  background-image: url("LINK/TO/IMAGE");

This will set the background image for all passages, since they show up in a tw-passage element every time. If you want to set the background image for the entire screen (not just the bit where text shows up), change tw-passage to tw-story.

Question 2: Suppose we have some options:

(if: $inventory contains "health potion")[Use Health Potion]
(if: $inventory contains "shield")[Use Shield]
(if: $inventory contains "sword")[Use Sword]

A simple pattern is to create a newline inside the code hook (the part following the if: in square brackets) and then use a backslash as @HAL9000 wrote to cancel the newline outside the code hook. Therefore:

(if: $inventory contains "health potion")[Use Health Potion
(if: $inventory contains "shield")[Use Shield
(if: $inventory contains "sword")[Use Sword

That way, if the option is valid and the code hook is shown, the new line is also shown, otherwise it is hidden.

Question 3: Passage names are simply internal signifiers, and changing the name of the passage will also change the internal reference, so any code that uses the old passage name will fail. If, however, you want to make the description of a passage say “cave” rather than “north”, you can try this in the body of the passage:

(if: $cave_discovered)[**CAVE**](else:)[**NORTH**]

This is some description.

Hope this helps. I would also recommend checking the Harlowe manual here: . Have fun :smiley:

1 Like