HTML Structure
HTML Folder Structure
- src
-
partials
- customizer.html / Contain the right sidebar theme customization HTML code.
- footer.html
- head-css.html / added common css files link in this file.
- main.html / html tag with attributes is stored in this common file.
- menu.html
- page-title.html / Breadcrumb is defined in this file.
- sidebar.html / Sidebar menu-related code is in this file.
- title-meta.html / Page title and meta tags are defined in this file.
- topbar.html / Topbar-related code is in this file.
- vendor-scripts.html / Common js files are linked in this file.
Layout setup
You can set the default layout in the src/partials/main.html file in the html tag.
<html data-topbar="light" data-layout-width="fluid" data-card-layout="borderless">
| data-layout-width="fluid" | To set fluid layout width. |
|---|---|
| data-layout-width="boxed" | To set boxed layout width. |
| data-card-layout="borderless" | To set borderless card layouts. |
| data-card-layout="border" | To set border card layouts. |
| data-layout-mode="light" | To set Light layout mode. |
| data-layout-mode="dark" | To set Dark layout mode. |
| data-layout-mode="brand" | To set Brand layout mode. |
| data-layout-position="fixed" | To set layout position Fixed. |
| data-layout-position="scrollable" | To set layout position Scrollable. |
| data-topbar="light" | To set the Light color of Topbar. |
| data-topbar="dark" | To set the dark color of Topbar. |
| data-topbar="brand" | To set the brand color of Topbar. |
| data-topbar-image="pattern-1" | To set the pattern One of Topbar. |
| data-topbar-image="pattern-2" | To set the pattern Two of Topbar. |
| data-topbar-image="pattern-3" | To set the pattern Three of Topbar. |
| data-preloader="enable" | To enable the preloader on the Page. |
| data-preloader="disable" | To disable the preloader on the Page. |