0

enter image description here

i have added sidebar navigation to my custom page. but the navigation bar in showing end of the page. how can i move it to page left side. following is the layout file i created.

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

2 Answers 2

0

In your layout file, you have set the page layout as "2columns-left" which means that the main content container is set to take up 2 columns with the left sidebar container taking up 1 column. However, you have only added your content inside the "content" container and have not specified anything for the left sidebar container.

To move the sidebar to the left side of the page, you can add your content inside a new container and specify the "sidebar.additional" container as the sibling container to it. This can be done as follows:

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="2columns-left" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <update handle="customer_account"/>
    <body>
        <referenceContainer name="content">
            <container name="my-custom-container" label="My Custom Container" htmlTag="div" htmlClass="my-custom-class">
                <-- content -->
            </container>
        </referenceContainer>
        <referenceContainer name="sidebar.additional">
            <-- add your sidebar content here -->
        </referenceContainer>
    </body>
</page>

In the above example, we have created a new container with the name "my-custom-container" and added our content inside it. We have also specified the "sidebar.additional" container as the sibling container to it, which will move the left sidebar to the left side of the page.

0

The line that you have added in your layout .xml file <update handle="customer_account"/> is fine, this line is only responsible to fetch left column of my account pages.

However the left panel that you are seeing below the content could be the reason of broken HTML inside your content.

In order to debug, you can remove all the HTML inside your main content's .phtml file and just use simple text like "Hello World", if layout fits after this, then clearly the HTML is broken

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.