Vertical menu configuration

How to use pre-built layouts?

Each of the layout options is provided below with steps you would need to perform in:

image
Light Sidebar
Remove data attribute data-sidebar="light" and Add data attribute data-topbar="dark" E.g. <body data-topbar="dark"> body element to have light sidebar.
image
Compact Sidebar
Keep your body element with data attribute data-sidebar-size="small" E.g. <body data-sidebar-size="small"> to have small sidebar.
image
Icon Sidebar
Keep your body element with class vertical-collpsed" E.g. <body class="vertical-collpsed"> to have icon sidebar.
image
Boxed Layout
Keep your body element with class vertical-collpsed and data attribute data-layout-size="boxed" data-keep-enlarged="true" E.g. <body class="vertical-collpsed" data-layout-size="boxed" data-keep-enlarged="true"> to have boxed layout with icon view sidebar.
image
Colored Sidebar
Keep your body element with data attribute data-sidebar="colored" E.g. <body data-sidebar="colored"> to have colored sidebar.
© Themesbrand.
Crafted with by Themesbrand