Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Colouring Hyperlinks

I have seen the topic here: http://twinery.org/forum/index.php/topic,2517.0.html and the solution given, as far as I can see, links the colour clicked to the location that the link sends you to, (or I'm reading it wrong.) and that's not what I'm after.

Ok, I'm pretty sure I'm just awful at this stuff at the moment, but I've just started and I'm trying to reconcile:
[[Begin|Begin]]
and (text-colour: "Red") [Begin]
So that the begin that they press to move on is red.

I'm pretty sure this is very simple but I can't get it to work and I'm sorry.

It needs to not link the colour to the location it sends the reader to though, because at other points in the game I need there to be, for example:
Pooka
Redcap
Undine
Daoine-Sidhe
all in green, but all sending to a different location, but with a separate link on the same page that has all of those again in red which send the reader to other locations.

Comments

  • I know there's one way of doing it and it's the same way to apply fonts to certain lines of text.
    (set: $passageColor to (color: #htmlnumber))

    $passageColor[ [[Begin|Begin]] ]
    For your list, you could just find an HTML color code that's green and put it on all of them. Just change the passage pointer for each one.

    Try that out and see if it works.
  • Thank you for responding.

    I tried it with the code:
    (set: $passageColor to (color: #FE2E2E))

    $passageColor [ [[Begin|Begin]] ]

    But it still comes up as blue when I run it in the test...
  • Malkav wrote:

    Thank you for responding.

    I tried it with the code:
    (set: $passageColor to (color: #FE2E2E))

    $passageColor [ [[Begin|Begin]] ]

    But it still comes up as blue when I run it in the test...


    This is because the HTML generated for the $passageColor [ [[Begin|Begin]] ] code looks like the following:

    <tw-hook>
    <span class="" style="color:#fe2e2e">
    <tw-expression type="macro" name="link-goto" title="(link-goto:"Begin","Begin";)">
    <tw-link class="" passage-name="Begin" passage-id="2">Begin</tw-link>
    </tw-expression>
    </span>
    </tw-hook>
    The <span class="" style="color:#fe2e2e"> part represents your $passageColor[] usage and it is assigning the colour for <tw-expression> tag but there is built-in CSS related with the <tw-link> tag which is changing the colour back to blue.

    If I wanted to change the text colour of a single markup link I would do one of the following:

    a. Use in-line styling.

    [[<span style="color: #FE2E2E;">Begin</span>->Begin]]
    b.  Add a CSS rule like tw-passage .forest tw-link {color: #FE2E2E;} to the Story Stylesheet and wrap the markup link in a classed <span> tag

    <span class="forest">
    [[Begin->Begin]]
    </span>
  • Thank you very much. That has fixed my problem!
Sign In or Register to comment.