General HTML structure is the same throughout the template. Here is the Folder structure.
HTML Folder structure for Frest assets.
frest-clean-bootstrap-admin-dashboard-template/
├── html/
| ├── ltr/
| | ├── vertical-menu-template/
| | ├── vertical-menu-template-dark/
| | ├── vertical-menu-template-semi-dark/
| | ├── vertical-menu-boxicons-template/
| | ├── horizontal-menu-template/
| | └── horizontal-menu-template-dark/
| └── rtl/
Following is the details of all html folders.
| Folder/Files | Details |
|---|---|
| vertical-menu-template |
vertical-menu-template/ folder contains
classic layout for Frest admin.
|
| vertical-menu-template-dark |
vertical-menu-template-dark/ folder
contains dark layout for Frest admin.
|
| vertical-menu-template-semi-dark |
vertical-menu-template-semi-dark/
folder contains semi dark layout for Frest admin.
|
| vertical-menu-boxicons-template |
vertical-menu-boxicons-template/ folder
contains main-menu-sidebar layout with Boxicons for
Frest admin.
|
| horizontal-menu-template |
horizontal-menu-template/ folder
contains horizontal layout for Frest admin.
|
| horizontal-menu-template-dark |
horizontal-menu-template-dark/ folder
contains horizontal dark layout for Frest admin.
|
| rtl |
rtl/ folder contains same template
folders (as ltr folder) for Frest admin.
|
General HTML structure is the same throughout the template. Here is the navbar structure.
<nav class="header-navbar main-header-navbar navbar-expand-lg navbar navbar-with-menu fixed-top">
<div class="navbar-wrapper">
<div class="navbar-container content">
<div id="navbar-mobile" class="navbar-collapse">
...
</div>
</div>
</div>
</nav>
Generate Frest menu using below menu structure.
<div class="main-menu menu-fixed menu-light menu-accordion menu-shadow" data-scroll-to-active="true">
<!-- main menu header -->
<div class="navbar-header">
...
</div>
<!--/ main menu header -->
<!-- shadow below menu header -->
<div class="shadow-bottom"></div>
<!--/ shadow below menu header -->
<!-- main menu content -->
<div class="main-menu-content">
<ul class="navigation navigation-main" id="main-menu-navigation" data-menu="menu-navigation" data-icon-style="lines">
...
</ul>
</div>
<!--/ main menu content -->
</div>
Generate Frest content area using following structure.
<div class="app-content content">
<!-- create overlay over content area -->
<div class="content-overlay"><div>
<!--/ create overlay over content area -->
<!-- content area -->
<div class="content-wrapper">
<div class="content-header row">
...
</div>
<div class="content-body">
...
</div>
</div>
<!--/ content area -->
</div>