woocommerce: customize WC-menu-item cart template

[Inga]

Hi there,

I’m now searching for hours but I can’t find any template with the HTML of the WC-menu-item. I would like to add a custom hook right after the opening wc-menu-item-tag before the anchor-tag in my child theme.
There is no woocommerce-template either… What am I missing?

[Tom]

Hi there,

That element is filtered into the menu items.

Where exactly are you wanting to hook into? After the menu item, or inside of it?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Inga]

Hi Tom,
thanks for your fast reply, I would like to hook inside the menu-item, right after the opening li-tag.

[Tom]

Unfortunately there is no hook in that location at the moment. I’ve added a note to look at adding one in GPP 1.9.

What are you trying to add there?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Inga]

I created a small conditional logged-in-menu with php (Hi [name], my account, logout) and I want it to be displayed left from the cart. No I inserted it with the inside-navigation hook, but I had to place it with css per “absolute”, so when the cart changes his width there is too much space.
No sure if there is a better solution…

[Tom]

Ah, well we filter the wc menu item into the menu, so you can use the same method:

add_filter( 'wp_nav_menu_items', function( $nav, $args ) {
    if ( 'primary' === $args->theme_location ) {
        return sprintf(
            '%1$s
            <li class="your-menu-item-class">
                Your menu item code in here
            </li>',
            $nav
        );
    }

    return $nav;
}, 5, 2 );

Let me know if you need more info 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Inga]

Thank you, I’m new to filters and programming in general, so as I inserted your code there was a new menu-point added but I don’t know how to move it inside an existing one (the woocommerce-menu-point) what I originally wanted to do. It has to be inside so that I can place it correctly.

But now I see that even this won’t help me because in the mobile-version the cart-icon is added in a different way and my code would disappear.

I will do it with the “inside-navigation”-hook and try to position it as precise as possible with CSS.

Thank you very much anyway!

[Tom]

I’ll see if I can add a filter in GPP 1.9 to make it easier to prepend/append items to the menu item 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts