Link color issue on home page

[COK]

I have set my nav links to be white w/ red hover, and it works for all pages except my home page… where most of them are red w/ red hover.

Home page with link color issue

Another page where the link colors work as expected

[paul.r]

Hi,

Try to activate onepage nav in your homepage.

Hope that helps

[COK]

Issue still remains after doing this:

[mldarshana]

Hi There,

Can you try removing your custom CSS added to your page, theme options and purge your server cache if you’re using a caching plugin. I see the following CSS rule which changed your link colors.

.x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav > .current-menu-item > a, .x-navbar .desktop .sub-menu li > a:hover, .x-navbar .desktop .sub-menu li.x-active > a, .x-navbar .desktop .sub-menu li.current-menu-item > a, .x-navbar .desktop .x-nav .x-megamenu > .sub-menu > li > a, .x-navbar .mobile .x-nav li > a:hover, .x-navbar .mobile .x-nav li.x-active > a, .x-navbar .mobile .x-nav li.current-menu-item > a {
    color: hsl(0,78%,50%);
}

In the meantime, I also see that you’re not fully updated. You can check our change log here to see more information about our recent update release and I suggest to update your staging site first. If you don’t have a staging environment for testing, you can create one by following this guide.

Thanks!

[COK]

After removing ALL of my custom css (and purging cache) the issue persists.

I’ve also updated my theme and cornerstone.

Update #1: I’ve also tried temporarily deactivating all plugins, issue persists.

Update #2: I think this has something to do with one-page navigation. For example, if you go to one of my anchors on the home page such as this one (#tourdates) the navmenu link styling looks as it’s supposed to (usually only after you refresh the page though).

Will add a login as a secure note in case it helps.

[COK]

Oddly, just noticed that with one-page menu active on my home page, the navmenu bar stays fixed even though my header settings are set to static:

[rad]

Hi @COK,

Yes, one-page navigation will override it since it’s mean to follow as you scroll (fixed).

The reason the active statuses aren’t working is that of relative and absolute URL. If the menu is linking on same page, the URL should be #about, and if it’s linking to the external page, then it should be /#about. Please change your menu URL and remove / from your URLs. And make your home link to #top. If you’re going to link your other pages back to home page, then create a new menu with /#about format, then assign it as primary menu.

You set your one page menu manually to the home page so it’s okay to assign another menu as primary.

Thanks!

[COK]

Setting my primary menu URLs with forward slashes (i.e. #/about) and a separate menu without forward slashes (i.e. #about) set to the home-page-only-menu via the one-page menu option on my home page settings here:

…has solved the original issue!

The only thing remaining is how to make the menu static and not fixed. What can be done to accomplish this?

[friech]

Hi There,

Please add this to Theme Options > CSS

@media (min-width: 980px) {
	.home .x-navbar.x-navbar-fixed-top {
	position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
}

Hope it helps,
Cheers!

[COK]

@friech

@media (min-width: 980px) {
.home .x-navbar.x-navbar-fixed-top {
position: absolute;
top: 0;
left: 0;
right: 0;
}
}

Thanks, this works.

One issue I caught (stemming from the one-page-menu in the previous posts) is that my mobile-navigation shows all but the “donate” link as active. Note the red background for these links on my mobile nav:

How can I change this so my mobile navigation links are not all active on the home page?

[nico]

Hi @COK,

We would like to help you regarding this customization however you are using a 3rd party plugin which we don’t support. Regretfully, we cannot provide support for third party plugins or scripts as our support policy in the sidebar states due to the fact that there is simply no way to account for all of the potential variables at play when using another developer’s plugin or script. Because of this, any questions you have regarding setup, integration, or troubleshooting any piece of functionality that is not native to X will need to be directed to the original developer.

Thank you for your understanding.