Adding customer account layout to custom page

magento.stackexchange https://magento.stackexchange.com/questions/208472

Question

I add new link to customer account sidebar like in the image below.

Customer account sidebar :

sidebar

And i create new page for Reset Employee Password link, and it's done like in the image below.

Custom page : Custom page

Then, my question is, how can i made my custom page like in the customer account page? (There's sidebar, and other things). Or for example, like in image below.

Example : Example

Was it helpful?

Solution

I found the answer myself, if maybe someone want to do the same with me, just set the layout at your xml file to layout="2columns-left" and you'll get the customer account page sidebar like in the image below.

Done

Code :

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

OTHER TIPS

It might not be the complete answer but I think you can generate the further idea looking at this. You can edit your layout reset_emppass_index.xml as:

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

        <attribute name="class" value="account"/>
        <referenceContainer name="sidebar.main">
            <block class="Magento\Framework\View\Element\Html\Links" name="customer_account_navigation" before="-" template="Magento_Customer::account/navigation.phtml">
                <block class="Magento\Framework\View\Element\Html\Link\Current" name="customer-account-navigation-account-link">
                    <arguments>
                        <argument name="label" xsi:type="string" translate="true">Account Dashboard</argument>
                        <argument name="path" xsi:type="string">customer/account</argument>
                    </arguments>
                </block>
                <block class="Magento\Framework\View\Element\Html\Link\Current" name="customer-account-navigation-account-edit-link">
                    <arguments>
                        <argument name="label" xsi:type="string" translate="true">Account Information</argument>
                        <argument name="path" xsi:type="string">customer/account/edit</argument>
                    </arguments>
                </block>
                <block class="Magento\Framework\View\Element\Html\Link\Current" name="customer-account-navigation-address-link">
                    <arguments>
                        <argument name="label" xsi:type="string" translate="true">Address Book</argument>
                        <argument name="path" xsi:type="string">customer/address</argument>
                    </arguments>
                </block>
            </block>
        </referenceContainer>
        <referenceContainer name="content">
                 <container name="categories1"  htmlTag="div" htmlClass="categories">
                    <block class="Vendor\Module\Block\Emppass" name="myblock" template="Vendor_Module::index.phtml"/>
                </container>
        </referenceContainer>
    </body>
</page>

The output is: enter image description here

Other links are coming from various different module you have to figure them out and add those block as arranged above.

Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
scroll top