General HTML structure is the same throughout the template. Here is the header structure.
<nav role="navigation" class="header-navbar navbar navbar-with-menu fixed-top navbar-semi-dark navbar-shadow">
<div class="navbar-wrapper">
<div class="navbar-header">
.....
</div>
<div class="navbar-container content container-fluid">
<div id="navbar-mobile" class="collapse navbar-expand-sm">
.....
</div>
</div>
</div>
</nav>
<div id="fullscreen-search" class="fullscreen-search">
.....
</div>
<div class="fullscreen-search-overlay"></div>
Generate modern menu using below menu structure.
<div id="main-menu" data-scroll-to-active="true" class="main-menu menu-dark menu-fixed menu-shadow menu-accordion">
<!-- main menu header-->
<div class="main-menu-header">
<input type="text" placeholder="Search" class="menu-search form-control round"/>
</div>
<!-- / main menu header-->
<!-- main menu content-->
<div class="main-menu-content">
<ul id="main-menu-navigation" data-menu="menu-navigation" class="navigation navigation-main">
.....
</ul>
</div>
<!-- /main menu content-->
<!-- main menu footer-->
<div class="main-menu-footer footer-close">
.....
</div>
<!-- main menu footer-->
</div>
Generate modern content area using following structure.
<div class="modern-content content container-fluid">
<div class="content-wrapper">
<div class="content-header row">
.....
</div>
<div class="content-body">
.....
</div>
</div>
</div>