[Support request] Custom Menu Markup, How?

[Angela]

Hello all,

I need to alter the stock generatepress menu code to something like this (so I can implement a new hover effect):

<li>
<a class="cube" href="#">
<span class="flip">
Anchor text
</span>
<span class="flop">
Anchor text
</span>
</a>
</li>

The issue is I can’t find where exactly the standard menu code is exactly within GP. I’m still semi-noobish at this theme and I have GP premium. Is there another option rather than editing child theme code?

All I need to do is output the anchor text in 2 separate spans and add some classes.

Thanks in advance!

[Leo]

Hi Angela,

Not quite sure what you are trying to do? Are you able to provide an example?

I assume this is something that cannot be done by targeting the specific menu item with CSS?

Let me know 🙂

[Angela]

Hey Leo,

Sure, here’s a codepen of the exact effect I’m looking for:
https://codepen.io/anon/pen/dWOBNG

I’m looking to add this effect to the existing menu of the website.

To make it work I need to add the span classes with anchor text as well as the custom classes.

Thanks!

[Tom]

You should actually just be able to add those two span elements into your Navigation Label in Appearance > Menus.

[Author]

Posts