[Support request] Links are not crawlable

[eran]

Hi,
When I run the lighthouse test, it shows “Links are not crawlable”.
It shows it’s from my “More Reviews” li in the menu with no link.
How can I make a li in the menu without a link so it won’t show that error?

https://imghostr.com/e843bb_5dh

[David]

Hi there,

try adding a # to the menu items URL.

[eran]

But then it will hurt my SEO.
It will be duplicate content, right?

[David]

I don’t think so.
The issue is the HTML contains <a> anchor element that has no href. By adding the # you give it a href.
The alternative is to ignore that diagnostic, its not going to affect how users navigate your site

[eran]

I did it with CSS I used this line:
#primary-menu ul .menu-item-1176>a {
pointer-events: none;
}

But the problem now is that the review changes the color for the hover color.
How can I fix that?

[David]

Include the color your want it to be in your CSS eg.

#primary-menu ul .menu-item-1176>a {
    pointer-events: none;
    color: var(--3);
}

[eran]

Hi David.
It didn’t fix my problem because the hover color does not change to the menu hover color when I’m hover the “review” or in the submenu pages.

[Ying]

I don’t see color: var(--3); has been added to the CSS, I only see the pointer-events: none;.

Can you make sure the cache is cleared after you modified the CSS?

Let me know 🙂

[eran]

It’s because I delete it.
Now I add it back.

[Fernando]

Try this CSS:

.main-navigation .main-nav ul li.menu-item-1176 {
    pointer-events: none;
}

.main-navigation .main-nav ul li.menu-item-1176:hover > a {
    color: var(--7);
}

.main-navigation .main-nav ul li.menu-item-1176 > a {
    color: var(--3);
}

[eran]

Didn’t work

[Ying]

I checked your other links, it seems if you don’t add any color CSS to the menu item 1176, it behaves the same as other menu items.

Can you specify what color you want it to be when hovered and when as the current menu item?

[eran]

I want the “Review” to be the same hover color as the other menu pages.
Plus, when I’m on the “Best Audio Mixer For Twitch Streaming” page under “review” I want the “review” to have a hover color.
I want it to behave like a regular menu item.

[Ying]

Try remove other CSS, then add this CSS only:

#primary-menu ul li[class*="current-menu-"].menu-item-1176>a {
    color: var(--7);
}
.main-navigation .main-nav ul li.menu-item-1176>a {
    pointer-events: none;
}

.main-navigation .main-nav ul li.menu-item-1176:hover > a {
    color: var(--7);
}

.main-navigation .main-nav ul li.menu-item-1176 > a {
    color: var(--3);
}

[eran]

It doesn’t work.
When I’m hovering it, the color doesn’t change, and when I’m not hovering it, the color has the hover color.

[Author]

Posts