HTML Structure

Here is the general HTML structure of the template:

<!doctype html> 
  <html lang="en" dir="ltr" data-bs-theme="<!-- dark or light mode compare -->"> 
    <head> [Page meta, page css, page js files, page title etc...] </head> 
    <body>
      <!-- light mode compare --> 
        <!-- loader Start --> 
          <div id="loading"> [LOADER CONTENT] </div>
        <!-- loader END --> 
        <!-- Sidebar Start -->
          [SIDEBAR CONTENT] 
        <!-- Sidebar END --> 
      <main class="main-content"> 
        <div class="position-relative iq-banner"> 
          <!--Nav Start--> 
            [HEADER CONTENT] [SUB-HEADER CONTENT] 
          <!--Nav End--> 
        </div> 
        <div class="content-inner container-fluid pb-0" id="page_layout"> 
          [MAIN CONTENT] 
        </div> 
        <!-- Footer Start --> 
          [FOOTER CONTENT] 
        <!-- Footer END --> 
      </main> 
      [SETTING PANEL] 
    <!-- Wrapper End--> 
    <!-- offcanvas start--> 
      [offcanvas / popup CONTENT] 
    <!-- offcanvas END --> 
    <!-- Script Start --> 
      [SCRIPT CONTENT]
    <!-- Script END --> 
  </body> 
</html>