[Resolved] menu doesn’t work with custom links removing #

[Yohann]

Hello,
I use custom links to create title in my menu and I remove the #
in off Canva menu, when you click on the title , it immediately close the off Canva menu.
Would you know how we could fix it ?
Thank you very much.

[David]

Hi there,

can i see the site with the issue ?

[Yohann]

This is the link https://yderhy-dev-dr-yohann-derhy.pf26.wpserveur.net/

[David]

Is this for the Menu Items with the Icon that have no link?

If yes, then for each of those menu items, give them a CSS class of no-pointers
This doc show how to add the CSS Class:

https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#custom-classes

Then add this CSS to your site:

.no-pointers {
    pointer-events: none;
}

That will make those items “unclickable” so the script wont fire if you do click them.

For the menu items with sub menus those need to have the # URL.

[Yohann]

Thank you for your answer. but I want to reduce the links on my page for SEO, and when I use # I automatically create links. Is there a way to change the script like this it won’t fire anymore and I won’t have # in links ?
if I use other themes it works well(for example twenty-one).
So it comes from generatepress. I have a child theme.

Thank you for your help.

[David]

Remove the URLs, and try adding this CSS:

.menu-item-has-children a:not([href]) {
    pointer-events: none;
    position: relative;
}
.menu-item-has-children a:not([href]) .dropdown-menu-toggle {
    pointer-events: auto;
    cursor: pointer;
    position: absolute;
    left: 0;
    right:0;
    text-align: right;
}

[Yohann]

Excellent ! this is perfect
Thank you so much

[David]

Glad to be of help

[Yohann]

I am sorry to come back but there is a trouble with your solution.
I have obfusq the link in the menu, and with your solution they don’t work…
So I ask you again my first question…
Thank you for your help.

[Fernando]

Hi Yohann,

For clarity, can you rephrase “I have obfusq the link in the menu”?

If you’re referring to “VOS BESOINS” for instance, can you try David’s suggestion here: https://generatepress.com/forums/topic/menu-doesnt-work-with-custom-links-removing/#post-2425219

[Yohann]

I mean I have use obfuscation to hide links …
But when I use the last solution, the obfuscated links doesn’t work

And when I use the first solution, I have too much links /#

If I use the theme twenty one for example, you can easily remove /# and the menu doesn’t close when I click on custom links without #

How can we fix it please ?
Thank you

[David]

How are you obfuscating the links ?

[Yohann]

I use a plug-in obf-link
It works well with other themes

[David]

I am not sure there is an easy fix for that, as GP filters in the Sub Menu using the same filters that plugin will. So it will break the sub menu.

Do you need to obfuscate the links with the option i provided here:

https://generatepress.com/forums/topic/menu-doesnt-work-with-custom-links-removing/#post-2430689

[Yohann]

With this piece of CSS, all the links are obfuscated but we cannot open them…
I need to obfuscate most of those links but not all… With the plugin it is very easy to manage. But maybe we could had a class or something to select the one who will be obfuscated.

[Author]

Posts