[Resolved] Header > mouseover hover link color > disappeares

[Christian]

Dear Support Team,

using GeneratePress 1.3.46 as a child theme as provided by you (https://generatepress.com/forums/topic/child-theme-download/)
I have the following problem:

Mouseover (hover) link colors are working on normal links.
I want the same hover link color to show on the header’s typography.

I am performing the normal actions to customize the colors (I took a screen-video (1 min 20 sec) I might provide if necessary or helpful).

On having set the desired color, it shows properly in the header and all other links even on saving and publishing, however, on leaving the customizer and viewing the website, the hover color disappears. The published website only showing the website’s default typography color – although the other links remain to show the custom hover color.

What am I missing?

I am very grateful you heading me in the right direction,

Best, Chris

[Leo]

Hi Chris,

Any chance you can provide a link to your site? Thanks!

[Callista]

I’m having the same issue. http://consulting.callistarakhmatov.com/about/ – if you look at the inspector, the color of the hover for the link is there but it’s been crossed out. I am not sure what is crossing it out. I’m using Elementor on the front page – I’m not sure if that’s affecting the site title links on the rest of the site. As with the OP, if I change the link color in the Colors (GP Premium) section of the Customizer, it changes just fine and looks like it’s working after saving. I go to the live site and no mouseover/hover effect.
Thanks!
Callista

[Leo]

Hi there,

Sorry just to be clear.

Currently you have a color set in Customizer > Colors > Primary Navigation > Background Hover.

You see it working in customizer preview but not in live site?

If so any caching plugins?

[Callista]

Thanks, Leo. I have Customizer > Colors > Header > Link Hover color set to #999999. Text color is #ffffff. It works as expected in Customizer preview. When I go to the live site, when I hover over the title, nothing happens, and in the inspector (if you right click and choose “inspect element” and look at “.site-header a:hover”), you can see that the hover color is there but it’s crossed out.

I only have Elementor, Generate Press Premium, and WPForms Lite plugins installed. Disabling WPLite Forms didn’t solve the issue. I can check if Elementor is the problem.

I noticed when I look at the CSS, “.main-title a:hover” seems to be overriding the “.site-header a:hover”. Both are listed as “inline style sheet #7”, both on line 5.

This isn’t a huge deal, but thought you should be aware of it. Again, I’ll check if Elementor is the problem and report back. Thanks!

[Callista]

Hi Leo, disabling Elementor didn’t affect the behavior either. So it must be something in GP/GP Premium since that’s all I had activated. Hope this helps! As I said, not a huge deal.

[Leo]

Ah ok I see what you are saying. The option for Colors > Header > Link Hover is actually meant for general links.

If you want to change the title hover color then we need to use some CSS as it’s more specific:

.main-title a:hover {
    color: #999999;
}

[Callista]

Ah, I see! I thought that option was for the Header title link. That makes sense now. The description isn’t very specific, so I thought it applied to ALL links in the header, including the title. You may want to include a bit of explanation to that effect in future releases. I’ll go ahead and add the CSS. Thanks very much!

[Leo]

No problem!

We will definitely look into this 🙂

[Author]

Posts