Hyperlink Hover Highlight Color

Hey all,

Creating a course in Storyline. Using hyperlink text. When you hover over the hyperlink text, the text has a highlight/background color. I am trying to figure out how to remove/change this color. I've already read through this discussion:

http://community.articulate.com/forums/p/12786/76336.aspx#76336

and I am confused because according to that discussion, the hyperlink highlight color is the text colour, but at 80% opacity. However, this doesn't seem to be accurate because I have black hyperlink text but the highlight hover color is a bright lavender. (Not the grey you would expect if it was 80% opacity of the black text).

If anyone has any suggestions, ideas? I don't want to use a transparent shape or another type of trigger, I'd just like to find out how this hyperlink hover-highlight color is selected and how/if I can change it

Thanks

43 Replies
Rebecca Fleisch Cordeiro

Hi Ragunathakrishn,

I see that you just posted here...prior post was in June. I've changed hyperlink colors using the Design theme and it seems to be working OK.

Once you've selected a theme from the Design tab (or even if you've left the default theme), click the Colors drop-down from the Design tab. You'll either need to create a new theme or edit an existing one.

You'll see a Hyperlink color option in the Create New Theme Colors dialog box. Change the color here and save the theme (you may want to name it something other than Custom #).

If that doesn't resolve your issue, please let the community know.

James McLuckie

Yes, I too have found this to be a bit of an issue. 

I have set up a menu which is white text on a black ground. The hyperlink colour is white, so when the learner puts their mouse over it they can't read the text.

I changed the hyperlink colour to black (thinking that hover colour would then become a dark grey). I then manually changed the text in the text box to white. However, the hover colour default was a light grey which, again, makes the white text very difficult to read. 

I am now think the only way I can get around this is draw hotspots over each bit of text, and set up the hyperlinks that way.

ivan be

For those who are still searching about this topic:

In Storyline 2, empirically find out the following:

  1. hyperlink glow/highlight is not 80% alpha (transparency), but solid color (see hyperlink-hover.png in attachment)
  2. this color is brightest tone of the theme hyperlink color (see hyperlink-color.png in attachment).
  3. Looks like it is not possible to change it.
Alyssa Gomez

Hey Katherine!

The hyperlink color in Color Themes is for both the underlined hyperlink and its hover color. The hover color is a lighter percentage of the actual hyperlink color. 

If you want to remove the hover effect altogether, you could try removing the link from the textbox and adding a hotspot over the link, instead.

Katherine Deese

Thanks, Alyssa! This is a good solution that will work for me at this point. I appreciate it. A question - the hover effect sometimes appears as a solid block that covers the hyperlink text, and sometimes just highlights the text so it can still be seen. If it would consistently highlight that would be fine and I would continue to use the hyperlink tool. Do you know what's causing the inconsistency? Thanks again!

Alyssa Gomez

Hm, that's odd! I can't say I've seen a solid black hover, but it sounds like an issue we'd want to look into. Next time you run across it, could you share the sample file with us? It's likely dependent on certain font colors, but in any case, we would never want a black hover to make the text illegible. 

Sara Davies

Adding my comment to follow this, as I"m experiencing the same problem. I have blue hyperlink text (via a color scheme) and the hover color is solid lighter blue over it, so the hyperlink is obscured. See attached image. I do not want to replace all the links in the course (there are many) with hotspots, but I certainly can't publish it like this so I guess that's my only option. Would love a better solution for this...

Sara Davies

I discovered the solution for the solid opaque hover box: the link needs to be (almost) the only thing in the text box. When there are several sentences/paragraphs, particularly before the link, then the hover appears opaque. If the link is by itself in its own text box, it's fine. Also seems to be fine if it's just a couple of words on the same line before the link, e.g. For more info: [link]. 

Weird! 

Alyssa Gomez

Hi Sara,

Thanks so much for sharing your findings! I created a sample file in Storyline 360 to try and recreate the issue, but I'm not seeing it on my end. I'd be interested in finding out the color you used for hyperlinks. To find out, click the Design tab >> Colors >> Create New Theme Colors >> Hyperlink color dropdown >> More colors

Here's the color I used in my file: #0000FF

Edward Nothnagle

I'm having a similar problem -- what's weird is that I have a slide with six links and the top 2 text hyperlinks highlight properly, but with the other 4 on the slide when you cursor over the text changes to the same color as the highlight so you can't read it.  I've attached the file (the links are on the 2 slide). Can anyone advise on how to fix?  Thanks! -Ed

Ashley Terwilliger

Hi Edward,

I'm seeing the same thing when testing your project file and trying to recreate those hyperlinks. Could you have copied the text in from somewhere else that has formatting already associated with it? Typically copying the text into a tool such as notepad will help strip out the extra formatting before inserting into Storyline. Also, I'd look at following the guidelines here to help prevent odd behavior in your files. 

Edward Nothnagle

Great thanks. The content was converted from PPT, so repasting it as text worked.

-Ed

------------------------------------
Edward Nothnagle Director
Teacher Support Strategy
Advanced Placement and Instruction

The College Board
250 Vesey Street, New York, NY 10281
T 212.373.8768 | M 917.318.5798
enothnagle@collegeboard.org

Challenging all students to own their future

Sarah Berry

I'm having a problem because there are two primary background colors for my text boxes - dark blue and white. I need hyperlinks that contrast - white on blue, etc.  I can go in and change them individually but it doesn't affect the highlight color.

Is there any way to have more than one highlight color?

Also, why does the highlight have line breaks? This is really confusing because it looks like there are two links instead of one. This is coming up in numerous places for me when the link text is long.