How to Add a Custom Link to 'My Account' Menu in Magento 2?

Today, we’re going to teach you guys how to add a custom link to ‘My Account’ in your Magento 2 store.

‘My Account’ is a customer account navigation menu that helps customers easily manage their personal information such as orders, wish lists, stored payment methods, downloadable products, and so on.

And in Magento 2, you can use the default ‘My Account’ customer navigation menu as it is, or you can customize it the way you want by adding custom links and enhance the user experience for your customers.

In this post, we will show you exactly how to add a custom link to ‘My Account’ Menu in your Magento 2 store.

Steps to Add a Custom Link to ‘My Account’ Menu in Magento 2

Please follow the below steps to learn how to add a custom link to ‘My Account’ menu in your Magento 2 store.

Step 1.

First of all, we need to modify the customer_account.xml layout file.

So, access the customer_account.xml layout file from the MageDelight/Tutorial/view/frontend/layout/ folder and paste the following code:

<?xml version="1.0"?>

<!--

/**

 * Copyright © Magento, Inc. All rights reserved.

 * See COPYING.txt for license details.

 */

-->

<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="MageDelight_tutorial_custom_my_account">

                <arguments>

                    <argument name="path" xsi:type="string">tutorial/account/custom</argument>

                    <argument name="label" xsi:type="string">My custom</argument>

                    <argument name="sortOrder" xsi:type="number">150</argument>

                    <argument name="navigation" xsi:type="boolean">true</argument>

                </arguments>

            </block>

        </referenceBlock>

    </body>

</page>

Step 2.

After that, you need to create a controller Custom.php file in the MageDelight/Tutorial/Controller/Account folder and paste the following code:

<?php

namespace MageDelight\Tutorial\Controller\Account;

use Magento\Framework\View\Result\PageFactory;

use Magento\Framework\App\Action\Context;

class Custom extends \Magento\Customer\Controller\AbstractAccount

{

    /**

     * @var PageFactory

     */

    protected $resultPageFactory;

    /**

     * @param Context                                             $context

     * @param PageFactory                                         $resultPageFactory

     * @param \Magento\Framework\Controller\Result\ForwardFactory $resultForwardFactory

     * @param \MageDelight\CustomerAttachments\Helper\Data            $dataHelper

     */

    public function __construct(

        Context $context,

        PageFactory $resultPageFactory

    ) {

        $this->resultPageFactory    = $resultPageFactory;

        parent::__construct($context);

    }

    /**

     * @return \Magento\Framework\View\Result\Page

     */

    public function execute()

    {

        /** @var \Magento\Framework\View\Result\Page $resultPage */

        $resultPage = $this->resultPageFactory->create();

        $resultPage->getConfig()->getTitle()->set(__('My Custom'));

        return $resultPage;

    }

}

Step 3.

Next, you need to create a tutorial_account_custom.xml file in the MageDelight/Tutorial/view/frontend/layout/ folder and paste the following code:

<?xml version="1.0"?>

<!--

/**

 * Copyright © Magento, Inc. All rights reserved.

 * See COPYING.txt for license details.

 */

-->

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">

    <update handle="customer_account"/>

    <body>

        <referenceContainer name="content">

            <block class="Magento\Framework\View\Element\Template" name="MageDelight_tutorial_custom_my_account_content" template="MageDelight_Tutorial::newtemplate.phtml"/>

        </referenceContainer>

    </body>

</page>

Step 4.

Now, you need to create a newtemplate.phtml file in the MageDelight/Tutorial/view/frontend/templates folder and paste the following code:

<div>

    <h2>Hello World</h2>

</div>

Step 5.

Finally, delete the cache and refresh the page.

Also read: How to Add Custom Tab to a “My Account” Page in Magento 2?

Summary

And that’s it!

This is how easy it is to add a custom link to ‘My Account’ customer navigation menu in your Magento 2 store.

And if you need our professional assistance, feel free to contact us anytime.