How do I change the color of links previously visited?

Authoring Twine
1

Twine Version: 2.6.6
I have tried so hard to change the colors of visited links, but nothing seems to be working. This is what I had before giving up:

a:visited {
    color: blue;
    text-decoration: none; 
}

Does anybody know how I can do this?

2

Hmm, it’s different in the different story formats. Are you using Harlowe (the default)? Or SugarCube? The first volume of G.C. Baccaris’s Twine Grimoire details how to do it in both formats (along with lots of other things), but we can just tell you the one you need, too.

1 Like
3

Just put this in your story’s Style Sheet and edit it as necessary:

tw-link, tw-enchantment.link { color: red; }
tw-link:hover, tw-enchantment.link:hover { color: yellow; }
.visited { color: blue; }
.visited:hover { color: cyan; }

…Harlowe has a great manual, but it doesn’t focus on basic HTML or CSS styling. There might be a way to do it with Harlowe’s own macros though, but since you’re using CSS, the above code will suit your needs.

Note: Harlowe features a pretty robust way to identify HTML elements for styling with it’s DOM View option when debugging. I believe the Debug is found under the Build menu in Twine. With the DOM View, you’ll see the exact HTML elements to target for styling your story. This will carry you quite far without having to get into advanced methods. Good luck on your project!

@JoshGrams That Grimoire is excellent. Thanks! The Harlowe Links styling starts on page 35. I think you just snuck in before me.

1 Like