Help with Buttons

Authoring Twine
1

Twine Version: 2.36.1

Hi, I’d like to make it so that Button #4 is only revealed when 2 out of 3 buttons are opened/selected by the player. I believe the issue is that the temp variables aren’t updating in the same passage, does anyone know if this is possible, or have a different solution?

<<button 'Button #1'>>
	<<replace "#links">>
       CONTENT 1
       <<set _temp += 1>>
       <img src="image/img.jpg">
    <</replace>>
<</button>>

<<button 'Button #2'>>
	<<replace "#links">>
       CONTENT 2
       <<set _temp += 1>>
       <img src="image/img.jpg">
    <</replace>>
<</button>>

<<button 'Button #3'>>
	<<replace "#links">>
       CONTENT 3
       <<set _temp += 1>>
       <img src="image/img.jpg">
    <</replace>>
<</button>>

<<if _temp gte 2>>
<<button 'Button #4'>>
	<<replace "#links">>
       CONTENT 4
       <img src="image/img.jpg">
    <</replace>>
<</button>>
<</if>>

@@#links;
@@\

Also, another issue i’m having with buttons is that I don’t know how to use my above code with different button styles.

How do I use this…

<button class="button button1">TEXT</button>

…with the code I wrote above? Everything I’ve tried doesn’t work.

Here is the code for different button styles in my stylesheet:

button {
  background-color: black;
  border: none;
  color: blue;
  padding: 16px 32px;
  font-size: 16px;
}

.button1 {
  background-color: black;
  border: none;
  color: red;
  padding: 16px 32px;
  font-size: 22px;
}

Thank you for any help!

2

Yup. It doesn’t. And you can’t really “refresh” the page, since temporary variable do not stick.

One option is to use <<replace>> to make the button appear. Or use macros like this Custom one to “update” the page.

Howp this helps!

1 Like
3

Thank you, the custom macro works well! One minor issue is that the buttons with <<liveblock>> go on seperate lines, so it kinda breaks formatting… but I think I can work around that.

If anyone has any tips for my second question about different button styles please let me know :slight_smile:

4 
<span class="special-button">
   <<button>>/*your code inside the macro*/<</button>>
</span>

and in the CSS:
.special-button button {
    /*your formatting*/
}
2 Likes
5

Thank you!