Vertical Layouts | Vuesy - Admin & Dashboard Template

Vertical menu configuration

You can change or customize the left side navigation very easily.

How to add new menu items/change menu items?

NodeJs: In order to add, change or remove menu items from the left side navigation, simply edit in file views/partials/sidebar.ejs. The change would reflect in the all pages automatically.

How to change width?

Node js: In order to change the width of left side navigation bar, open a file src/assets/scss/_variables.scss and change the value of variable $sidebar-width. The default value is set to 250px.

How to use pre-built layouts?

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

Light Sidebar

Remove data attribute data-sidebar="light" body element to have light sidebar.

Compact Sidebar

Keep your body element with data attribute data-sidebar-size="md" E.g. <body data-sidebar-size="md"> to have small sidebar.

Icon Sidebar

Keep your body element with data-sidebar-size="sm" E.g. <body data-sidebar-size="sm"> to have icon sidebar.

Boxed Layout

Keep your body element with data attribute data-sidebar-size="lg" data-layout-size="boxed"and class="right-bar-enabled", and views/layout/layout.ejs remove <%- include ('../partials/menu') %> or add <%- include ('../partials/topbar') %><%- include ('../partials/sidebar') %> to have boxed layout with icon view sidebar.