I need to change the My Account section side tabs layout (Vertical to Horizontal) and wanted to add on top before the My Videos Lab.
Please help me to resolve it.
You need change in 2 files for the result
1. chage the position on sidebar before the main column in layout configuration file
app/design/frontend/Ricky/Themefront/Magento_Customer/layout/customer_account_index.xml
<?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" layout="2columns-left" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<update handle="customer_account"/>
<body>
<move element="div.sidebar.main" destination="columns" before="-" />
</body>
</page>2. LESS will do the rest, create _extend.less file to add the CSS for the horizontal nav in large screens( screens > 768 px)
app/design/frontend/Ricky/Themefront/Magento_Customer/web/css/source/_extend.less
//
// Desktop
// _____________________________________________
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
// My account
.account.page-layout-2columns-left {
.sidebar-main,
.sidebar-additional {
width: 100%;
}
.column.main {
width: 100%;
}
.block-collapsible-nav{
.item{
display: inline-block;
}
}
}
}
Find helpful? Consider Giving Kudos to this post.
Problem solved? Click Accept as Solution!