WooCommerce – Dashboard menu active class missing

Resolved

(@frogerme)

On the Dashboard page (/my-account by default), Falang is preventing from setting the is-active class on the menu item:

With Falang activated, wp->query_vars is:

Array
(
	[falang_page] => my-account
	[pagename] => my-account
)

Without Falang, wp->query_vars is:

Array
(
	[page] =>
	[pagename] => my-account
)

Setting the current flag on the Dashboard page expects wp->query_vars to be empty or to contain a page key.
The page key is NOT present when Falang is activated.

See below WooCommerce core function for reference:

function wc_is_current_account_menu_item( $endpoint ) {
	global $wp;

	$current = isset( $wp->query_vars[ $endpoint ] );
	if ( 'dashboard' === $endpoint && ( isset( $wp->query_vars['page'] ) || empty( $wp->query_vars ) ) ) {
		$current = true; // Dashboard is not an endpoint, so needs a custom check.
	} elseif ( 'orders' === $endpoint && isset( $wp->query_vars['view-order'] ) ) {
		$current = true; // When looking at individual order, highlight Orders list item (to signify where in the menu the user currently is).
	} elseif ( 'payment-methods' === $endpoint && isset( $wp->query_vars['add-payment-method'] ) ) {
		$current = true;
	}

	return $current;
}

This topic was modified 3 months, 1 week ago by Alexandre Froger.

Viewing 4 replies - 1 through 4 (of 4 total)

Thread Starter

Alexandre Froger

(@frogerme)

3 months, 1 week ago

And here is how to fix it in Falang (relevant extracts for falang/src/Falang/Filter/Site/WooCommerce.php):

<?php

namespace Falang\Filter\Site;


use Automattic\WooCommerce\Internal\Utilities\HtmlSanitizer;

class WooCommerce {

	/**
	 * Constructor
	 *
	 * @from 1.3.1
     * @update 1.3.28 add woocommerce_product_title filter
     * @update 1.3.44 add filter for widget product list name/title translation
     * @update 1.3.54 add filter for lost password submit redirection woocommerce_get_endpoint_url
     * @update 1.3.62 fix term&condition translation (in the checkout page)
	 *
	 */
	public function __construct( ) {
        // ...

        // Fix the dashboard "My Account" active class:
        add_filter('woocommerce_account_menu_item_classes', array($this,'translate_woocommerce_account_menu_item_classes'),10,2);
    }

    public function translate_woocommerce_account_menu_item_classes($classes, $endpoint){

        if ( 'dashboard' === $endpoint && ( isset( $wp->query_vars['falang_page'] ) || empty( $wp->query_vars ) ) ) {
            $classes[] = 'is-active';
        }

        return $classes;
    }
    // ...
}

Plugin Author

sbouey

(@sbouey)

3 months, 1 week ago

Thanks a lot , it’s added in the next version

Thread Starter

Alexandre Froger

(@frogerme)

3 months, 1 week ago

The condition in the code I previously posted is wrong: it would also apply to sub-pages of my-account, which is undesirable.

Below is my revisted code – there may be better ways to achieve this: relying on the number of query vars seems to be a weak solution.

    public function translate_woocommerce_account_menu_item_classes($classes, $endpoint){
        global $post, $wp;

        if (
            'dashboard' === $endpoint &&
            ( isset( $post ) && wc_get_page_id( 'myaccount' ) === (int) $post->ID ) &&
            ( isset( $wp->query_vars['pagename'] ) && $post->post_name === $wp->query_vars['pagename'] ) &&
            2 === count( $wp->query_vars )
        ) {
            $classes[] = 'is-active';
        }

        return $classes;
    }

Plugin Author

sbouey

(@sbouey)

3 months, 1 week ago

Ok, i have updated the code.

Viewing 4 replies - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.