How to Add Custom Tab in Customer Account Dashboard in Magento 2
The default Magento 2 store redirects the user to “My Account” section after sign up or login. Here, you can find various default tabs like My Account, My Orders, My Wishlist, etc. Hence, at this point, the store owners may want to offer various features that help the visitors to go through their shopping easily. For example, the customers can request a refund of a product, check the demo product, take a look at the quote they requested and any other custom requirements!
Unfortunately, the default Magento 2 does not offer the luxury of such features. It’s the task of developers to add custom tab in customer account dashboard in Magento 2. Likewise you can also hide unnecessary tabs in product page in frontend. And for that you need to hide a empty custom tab in Magento 2 so that your customers don’t get distract from their main goal i.e., make purchase. Follow the below method to add a custom tab in customer “My Account” section in your Magento 2 store!
Steps to Add Custom Tab in Customer Account Dashboard in Magento 2:
- Create customer_account.xml in path Vendor/Module/view/frontend/layout
123456789101112<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="customer-account-navigation-custom"><arguments><argument name="path" xsi:type="string">routename/customer/index</argument><argument name="label" xsi:type="string">My Custom Tab</argument></arguments></block></referenceBlock></body></page> - Create routename_customer_index.xml in path Vendor/Module/view/frontend/layout
1234567891011121314<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../../../lib/internal/Magento/Framework/View/Layout/etc/page_configuration.xsd"><update handle="customer_account"/><body><referenceBlock name="page.main.title"><action method="setPageTitle"><argument translate="true" name="title" xsi:type="string">My Custom Tab</argument></action></referenceBlock><referenceContainer name="content"><block class="Magento\Framework\View\Element\Template" name="my_tab" template="Vendor_Module::mytab.phtml"></block></referenceContainer></body></page> - Create Index.php in path Vendor/Module/Controller/Customer
123456789101112<?phpnamespace Vendor/Module\Controller\Customer;class Index extends \Magento\Framework\App\Action\Action {public function execute() {$this->_view->loadLayout();$this->_view->renderLayout();}}?> - Create mytab.phtml in path Vendor/Module/view/frontend/templates
1234<?php// Add Some Code Here for design?><span> My Custom Tab.. </span>
Ain’t that easy?
Moreover, if you want to remove unnecessary customer account links in Magento 2, check the solution in our blog post.
Also, if you want to collect additional information from the customers, you can create a tab and load grid in Magento 2 customer admin edit page. Also you can add customer account navigation in Magento 2 dynamically it allows you to customize and enhance the customer’s account dashboard by adding custom links or sections based on specific business needs and requirements.
However, feel free to ask your doubts in the Comments section below and I’d be happy to help 🙂
Do not forget to appreciate the post with 5 stars if it helped you customize your Magento 2 store’s “My Account” dashboard for your valuable customers!
Thank you.
8 Comments
how to set the order of custom tab or how to set the custom tab as default tab. can you please help me?
Hello,
We’ll post the required soon.
Do subscribe to get the notification.
Thank You.
Hi ,
I need one help if I want to display this custom tab for only logged in customer and give a message to not logged in customer that “Login First” . How to do ?? Please help me ……………
Thanks in advance
Hello Varsha,
You need to develop custom code for your requirements.
Thanks.
mytab.phtm file not showing data
Hello Rajendra,
Please check that mytab.phtml is not called using Log.
And can you mention the phtml related error that you are facing?
Thank you.
Thanks a lot i helped me.
My pleasure 🙂