How to show accordion menu on Desktop view?

Currently the mobile(hamburger) menu is displayed for devices which have screen width < 768 px.

There steps to show accordion menu on Desktop view as bellow:

Demo accordion Desktop Menu: https://builder.landofcoder.com/demo-accordion-menu

Step 1: Create Accordion Menu profile

Add new megamenu profile as this:

Add new accordion menu profile

Choose Desktop Template = Accordion Menu

Step 2: Add custom css code

Please add custom css code bellow on custom css file of current theme or you can add on admin > Stores > Configuration > Venustheme.com > Custom CSS on Frontend as screenshot:

Open megamenu settings

// Custom css code
.ves-megamenu.ves-daccordion .navigation .nav-item a {
    display: block;
}
.ves-megamenu.ves-daccordion >.navigation .level0 {
    float: left!important;
    border-top: 1px solid #d1d1d1;
    border-top-color: rgba(0,0,0,.08);
}
.ves-megamenu.ves-daccordion>.navigation {
    border: 1px solid rgba(0,0,0,.15);
    float: left;
    background: #f8f8f8;
}
.ves-megamenu.ves-daccordion .navigation .opener {
    display: inline-block!important;
}
.ves-megamenu.ves-daccordion .opener:before {
    content: "\e61c";
}
.ves-megamenu.ves-daccordion .opener.item-active:before {
    content: "\e60f";
}
.ves-megamenu.ves-daccordion .navigation .opener {
    position: absolute!important;
    right: 0!important;
}

Step 3: Add megamenu block on frontend layout or Widget Instance

To show custom accordion menu on frontend, we can use layout xml to load the menu block as this:

<referenceContainer name="content">
    <block class="Ves\Megamenu\Block\Menu" name="catalog.accordionnav" ifconfig="vesmegamenu/general_settings/enabled" template="Ves_Megamenu::topmenu.phtml">
        <arguments>
            <argument name="alias" xsi:type="string">accordion-menu-profile</argument>
        </arguments>
    </block>
</referenceContainer>

Or use widget Instance

Go to admin > Content > Element > Widgets > Add new Widget as screenshots:

Choose type ves megamenu: menu and design theme

Choose layout updates

Choose menu profile

Step 4: Flush cache of the site