How Do I Edit the My Account Side Navigation in Magento 2?

Customizing the user experience is a cornerstone of successful e-commerce, and Magento 2 offers a robust platform to tailor every aspect of your online store. One key area that directly impacts customer interaction is the “My Account” section, particularly the side navigation menu. This menu serves as a gateway for shoppers to access their orders, account information, and other personalized features, making it essential to align it with your brand’s unique style and functionality.

Editing the My Account side navigation in Magento 2 allows store owners and developers to enhance usability, streamline navigation, and introduce new links or remove unnecessary ones based on their business needs. Whether you want to simplify the user journey or add custom links that reflect your store’s offerings, understanding how to modify this menu is crucial. This process involves working with Magento’s layout XML files, templates, and sometimes custom modules, all designed to ensure your customers enjoy a seamless and intuitive account management experience.

Before diving into the specifics, it’s important to grasp the foundational structure of Magento 2’s account navigation and how it integrates with the broader customer account system. This overview will prepare you to make informed changes that not only improve aesthetics but also enhance functionality, ultimately driving better engagement and customer satisfaction. In the sections ahead, we’ll explore the essential methods and

Modifying the Layout XML to Customize My Account Navigation

To customize the My Account side navigation in Magento 2, you need to work with layout XML files. These files control the structure and content of the pages, including the account navigation block.

Magento 2 defines the My Account navigation through the `customer_account.xml` layout file located in the `Magento_Customer` module. To modify or add links, you should create a custom module or use your theme’s layout override.

Key steps to modify the navigation include:

Locate or create the `customer_account.xml` file inside your module or theme at:

`app/code/YourVendor/YourModule/view/frontend/layout/customer_account.xml`
or
`app/design/frontend/YourVendor/yourtheme/Magento_Customer/layout/customer_account.xml`

Use the `` directive to add, remove, or reorder navigation links.

Each navigation item is a block of type `Magento\Framework\View\Element\Html\Link\Current`.

Example of adding a custom navigation link:

“`xml

Custom Link
customroute/controller/action

“`

This code adds a new link labeled “Custom Link” pointing to the `customroute/controller/action` route.

Removing or Disabling Existing Navigation Items

To remove or disable default links such as “My Orders” or “Account Information,” you can use the `remove` or `unsetChild` directives in your layout XML.

For example, to remove the “My Orders” link:

“`xml

orders

“`

Alternatively, you can remove a block entirely:

“`xml

“`

It’s important to know the exact block names for these links. Common block names for default links include:

Link Label	Block Name	Route Path
Account Dashboard	customer_account_navigation_dashboard	customer/account/
Account Information	customer_account_navigation_account_edit	customer/account/edit/
Address Book	customer_account_navigation_address	customer/address/
My Orders	customer_account_navigation_orders	sales/order/history/
Billing Agreements	customer_account_navigation_billing_agreements	billing_agreement/
Recurring Profiles	customer_account_navigation_recurring_profiles	sales/recurring_profile/
My s	customer_account_navigation_product_reviews	review/customer/

Reordering Navigation Items

Magento 2 uses the `sortOrder` attribute to determine the display order of navigation items. You can specify the `sortOrder` argument in your XML to reposition links.

For example, to set the “My Orders” link to appear first:

“`xml

10

“`

Lower numbers display first, while higher numbers display later. Use consistent increments (e.g., 10, 20, 30) to allow easy insertion of new items between existing ones.

Adding Custom Links with URL or CMS Pages

Besides routing to controller actions, you can also link to CMS pages or external URLs in the My Account navigation. This requires creating a custom block and setting the correct URL.

To add a CMS page link:

“`xml

Custom CMS Page
cms/page/view/page_id/5

“`

For an external URL, you will need a custom block class to handle full URLs, as the default `path` argument assumes internal routing.

Alternatively, programmatically adding links in a custom module’s `layout` or `plugin` is possible for more complex scenarios.

Using Plugins and Observers for Dynamic Navigation Changes

If you require more dynamic control over the My Account navigation, such as showing or hiding links based on customer groups or custom conditions, use Magento’s plugins or observers.

Create a plugin for the `Magento\Customer\Block\Account\Navigation` class, intercepting methods like `getLinks()` or `addLink()` to modify the navigation array.

Observers can listen to events such as `customer_login` or custom events to dynamically adjust available links.

This approach is more advanced but provides greater flexibility than layout XML modifications alone.

Summary of Common XML Elements for Navigation

Customizing the My Account Side Navigation in Magento 2

Magento 2’s My Account side navigation is a critical component for customer experience, allowing users to easily access different account-related pages. To customize or edit this navigation, developers typically work with layout XML files and UI components. Below is a detailed guide on how to modify the side nav links effectively.

Understanding the Default My Account Navigation Structure

The side navigation links in the customer account area are primarily defined by the customer_account_navigation block. This block is declared in the layout XML files and can be extended or overridden in your custom theme or module.

Location of default XML: vendor/magento/module-customer/view/frontend/layout/customer_account.xml
Navigation block: customer_account_navigation (type: Magento\Customer\Block\Account\Navigation)
Links are added via: addLink() method or through XML instructions

Editing the Side Navigation Links via Layout XML

To add, remove, or modify links, you need to create or edit a layout XML file in your custom module or theme. For example, to customize the navigation on the customer account pages, use the customer_account.xml file.

Action	Example XML Snippet	Description
Add a New Link	<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <body> <referenceBlock name="customer_account_navigation"> <block class="Magento\Framework\View\Element\Html\Link\Current" name="custom-link"> <arguments> <argument name="path" xsi:type="string">customroute/index</argument> <argument name="label" xsi:type="string">Custom Link</argument> </arguments> </block> </referenceBlock> </body> </page>	Adds a custom link labeled “Custom Link” pointing to a custom route.
Remove an Existing Link	<page ... > <body> <referenceBlock name="customer_account_navigation"> <action method="removeLink"> <argument name="name" xsi:type="string">newsletter</argument> </action> </referenceBlock> </body> </page>	Removes the link with the name “newsletter” from the navigation.
Modify Link Label	<page ... > <body> <referenceBlock name="customer_account_navigation"> <action method="setLinkLabel"> <argument name="name" xsi:type="string">account_edit</argument> <argument name="label" xsi:type="string">Update Profile</argument> </action> </referenceBlock> </body> </page>	Changes the label of the “account_edit” link to “Update Profile”.

Action

Example XML Snippet

Description

Add a New Link

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="customer_account_navigation">
            <block class="Magento\Framework\View\Element\Html\Link\Current" name="custom-link">
                <arguments>
                    <argument name="path" xsi:type="string">customroute/index</argument>
                    <argument name="label" xsi:type="string">Custom Link</argument>
                </arguments>
            </block>
        </referenceBlock>
    </body>
</page>

Adds a custom link labeled “Custom Link” pointing to a custom route.

Remove an Existing Link

<page ... >
    <body>
        <referenceBlock name="customer_account_navigation">
            <action method="removeLink">
                <argument name="name" xsi:type="string">newsletter</argument>
            </action>
        </referenceBlock>
    </body>
</page>

Removes the link with the name “newsletter” from the navigation.

Modify Link Label

<page ... >
    <body>
        <referenceBlock name="customer_account_navigation">
            <action method="setLinkLabel">
                <argument name="name" xsi:type="string">account_edit</argument>
                <argument name="label" xsi:type="string">Update Profile</argument>
            </action>
        </referenceBlock>
    </body>
</page>

Changes the label of the “account_edit” link to “Update Profile”.

Adding Links Programmatically via a Custom Module

Alternatively, you can add or modify navigation links programmatically within a custom module by observing the customer_account_navigation block in a plugin or observer.

Create a plugin for Magento\Customer\Block\Account\Navigation and use the addLink() method to add new links.
Example snippet within a plugin’s afterGetLinks() method:

public function afterGetLinks(\Magento\Customer\Block\Account\Navigation $subject, $result)
{
    $subject->addLink(
        'custom_link',
        'customroute/index',
        __('Custom Link')
    );
    return $result;
}

Overriding the Template for Custom Markup

If your customization requires changes to the HTML structure or styling of the side navigation, override the template file responsible for rendering it:

Default template path: vendor/magento/module-customer/view/frontend/templates/account/navigation.phtml
Copy this file into your theme at app/design/frontend/[Vendor]/[theme]/Magento_Customer/templates/account/navigation.phtml
Modify the markup or classes as needed for your design

Be sure to clear cache after changes to see updates:

php bin/magento cache:clean

Best Practices for Editing My Account Navigation

Expert Perspectives on Editing the My Account Side Navigation in Magento 2
Linda Chen (Senior Magento Developer, E-Commerce Solutions Inc.) emphasizes that customizing the My Account side navigation in Magento 2 requires a clear understanding of the layout XML files and the use of UI components. She notes, “To effectively edit the side nav, developers should override the `customer_account_navigation.xml` layout file within a custom module or theme. This approach ensures maintainability and compatibility with future Magento updates while allowing you to add, remove, or reorder navigation links seamlessly.”

Raj Patel (Magento Certified Frontend Developer, Digital Commerce Agency) advises, “When modifying the My Account side navigation, it’s crucial to leverage Magento’s built-in block and template system rather than hardcoding changes. By creating a custom module that extends the `Magento_Customer` module’s navigation block, you can inject new menu items or modify existing ones dynamically, ensuring that the user experience remains consistent and that customizations are upgrade-safe.”

Emily Foster (E-Commerce UX Strategist, NextGen Retail) highlights the importance of user experience in this customization. She states, “Editing the My Account side nav in Magento 2 isn’t just about technical changes—it’s about improving navigation clarity and accessibility. Experts should prioritize logical grouping of menu items and consider adding icons or tooltips to enhance usability. Testing changes across devices ensures that the side navigation remains intuitive and responsive for all customers.”

Frequently Asked Questions (FAQs)

How can I customize the My Account side navigation in Magento 2?
You can customize the My Account side navigation by modifying the `customer_account_navigation.xml` layout file or by creating a custom module to add, remove, or reorder links.

Where is the My Account side navigation layout file located in Magento 2?
The layout file is located at `vendor/magento/module-customer/view/frontend/layout/customer_account_navigation.xml`. It can be overridden in your theme or custom module.

Can I add new links to the My Account side navigation menu?
Yes, you can add new links by creating or extending the `customer_account_navigation.xml` file and defining new `` or `` elements with the appropriate route and label.

How do I remove default links from the My Account side navigation?
Remove default links by using the `remove` attribute or by unsetting the corresponding block in a custom layout XML file within your theme or module.

Is it possible to change the order of links in the My Account side navigation?
Yes, you can change the order by setting the `sortOrder` attribute for each navigation item in the layout XML file.

Do I need to clear cache after editing the My Account side navigation?
Always clear Magento cache after making changes to layout files to ensure your updates are reflected on the frontend. Use `bin/magento cache:clean` and `bin/magento cache:flush`.
Editing the My Account side navigation in Magento 2 involves customizing the layout and links that appear for customers within their account dashboard. This process typically requires modifying XML layout files, particularly the customer_account_navigation.xml, to add, remove, or reorder navigation items. Understanding the structure of Magento’s UI components and how they interact with the customer account area is essential for making effective and maintainable changes.

Additionally, leveraging Magento 2’s modular architecture allows developers to create custom modules or override existing ones to tailor the side navigation according to specific business requirements. It is important to follow best practices, such as using layout XML updates and avoiding direct core code modifications, to ensure compatibility with future Magento updates and to maintain a clean upgrade path.

Overall, mastering the customization of the My Account side nav enhances the user experience by providing customers with a streamlined and relevant navigation menu. This not only improves usability but can also support better customer engagement and retention. By carefully planning and implementing these edits, Magento 2 store owners can deliver a more personalized and efficient account management interface.
Author Profile

Barbara Hernandez
Barbara Hernandez is the brain behind A Girl Among Geeks a coding blog born from stubborn bugs, midnight learning, and a refusal to quit. With zero formal training and a browser full of error messages, she taught herself everything from loops to Linux. Her mission? Make tech less intimidating, one real answer at a time.

Barbara writes for the self-taught, the stuck, and the silently frustrated offering code clarity without the condescension. What started as her personal survival guide is now a go-to space for learners who just want to understand what the docs forgot to mention.
Latest entries