Adding Additional Menu Tabs to My Account Page

If you’ve implemented the My Account page on your WordPress site and want to add additional menu tabs to display extra content or link to another page or resource, this article is for you.

Adding Menu Tabs that Link to a URL

See the code snippet below to add a menu tab that links to a URL.

add_filter('ppress_myaccount_tabs', function ($tabs) {
    
    $tabs['custom_tab_id'] = [
        'title'    => esc_html__('Custom Tab Title', 'wp-user-avatar'),
        'priority' => 20,
        'icon'     => 'settings',
        'url'      => 'https://yourwebsite.com/custom-tab-url'
    ];

    return $tabs;
});

 

Replace the settings in the “icon” array element is the icon to display on the menu tab. To change the icon, replace it with another Material Icons name.

Use the priority array element determines how far above or below the menu should be displayed. A lesser number would cause the menu tab to be displayed closer to the top. Conversely, a higher number would cause it to show at the bottom.

Adding Menu Tabs that Displays Custom Content

If you want to add a menu tab to the My Account page, which, when clicked, displays custom content, see the code snippet below.

add_filter('ppress_myaccount_tabs', function ($tabs) {
    $tabs['custom_tab_id'] = [
        'title'    => esc_html__('Custom Tab Title', 'wp-user-avatar'),
        'endpoint' => 'custom_tab_id',
        'priority' => 20,
        'icon'     => 'settings',
        'callback' => function () {
            echo 'Add your custom content in this callback function';
        }
    ];

    return $tabs;
});

How to Implement the Above Code Snippets

If you are new to PHP or WordPress development, we recommend adding these code snippets using the Code Snippets plugin. This allows you to add the code directly within your WordPress dashboard.

Alternatively, you could add the snippets directly to your theme or child theme’s functions.php file.

Please Note: Whenever you add a new custom tab, you need to navigate to Dashboard >> General >> Permalinks and simply click the Save Changes button. This will update your permalink structure and prevent any 404 errors you might have.