In this tutorial, Today I will explain about how to add custom tab in customer account dashboard in Magento 2. When you are logged in successfully after that, you will redirect to customer account dashboard page. On customer account dashboard page, there are many tabs available like My Account, My order, Stored Payment Methods, Address book etc.
However, when you want to add your custom tab after default custom tab and call your custom template file then, how to do that?
Let’s follow the below steps to add custom tab in customer account dashboard in Magento 2.
You may also like this :
- How to Add WYSIWYG Editor in Magento 2 Store Configuration
- How to Reset Admin Password in Magento 2
- Magento 2 : Add Custom Product Video in Fotorama Gallery
1) First of all, Create customer_account.xml file in your module at app/code/RH/Helloworld/view/frontend/layout/ and paste the below code :
<?xml version="1.0" encoding="UTF-8"?>
<!--
/**
* Created By : Rohan Hapani
*/
-->
<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-mycustomtab">
<arguments>
<argument name="path" xsi:type="string">helloword/index/index</argument>
<argument name="label" xsi:type="string">My Custom Tab</argument>
</arguments>
</block>
</referenceBlock>
</body>
</page>
Using this above code, you can set label and URL for your custom tab. You need to set your controller path in path argument.
2) Then, Create helloworld_index_index.xml file to add template file in your controller layout at app/code/RH/Helloworld/view/frontend/layout/ and paste the below code :
<?xml version="1.0" encoding="UTF-8"?>
<!--
/**
* Created By : Rohan Hapani
*/
-->
<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 Page</argument>
</action>
</referenceBlock>
<referenceContainer name="content">
<block class="Magento\Framework\View\Element\Template" name="my_custom_page" template="RH_Helloworld::customfile.phtml" />
</referenceContainer>
</body>
</page>
3) Create Index.php action file to render your custom layout in your custom tab at app/code/RH/Helloworld/Controller/Index/ and paste the below code :
<?php
/**
* Created By : Rohan Hapani
*/
namespace RH\Helloworld\Controller\Index;
class Index extends \Magento\Framework\App\Action\Action
{
public function execute()
{
$this->_view->loadLayout();
$this->_view->renderLayout();
}
}
?>
4) In Last, Create customfile.phtml template file to display template file in your custom tab at app/code/RH/Helloworld/view/frontend/templates/ file path and paste the below code:
<?php // Add your code to display in your custom tab. ?>
That’s it !!!
Finally, you just need to clean cache using below command :
php bin/magento c:c
I hope this blog is easy to understand about how to add custom tab in customer account dashboard in Magento 2. In case, I missed anything or need to add some information, always feel free to leave a comment in this blog, I’ll get back with proper solution.
Keep liking and sharing 🙂