Basic template Structure
The template has a responsive layout and is based on the Bootstrap 4 Framework. Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile-first projects on the web. Click Here to know more about Bootstrap.
HTML Structure
Here is the general HTML structure of the template:
<!DOCTYPE html> <html lang="en"> <head> [Page meta, page css, page title etc...] </head> <body> <!--header --> <header class="header header-transparent"> <nav class="navbar navbar-static-top navbar-expand-lg"> [MENU CONTENT] </nav> </header> <!--header --> <!-- Banner --> <section class="banner bg-holder bg-overlay-black-30 text-white" style="background-image: url(images/banner-01.jpg);"> [BANNER CONTENT] </section> <!-- Banner --> <!--Category-style --> <section class="space-ptb"> [SECTION 1 CONTENT] </section> <!--Category-style --> <!--Divider --> <div class="container"> <div class="row"> <div class="col-12"> <hr class="mb-0"> </div> </div> </div> <!--Divider --> <!--Jobs-listing --> <section class="space-ptb"> [SECTION 2 CONTENT] </section> <!--Jobs-listing --> <!--footer --> <footer class="footer mt-0"> [FOOTER_CONTENT] </footer> <!--footer --> <!--Signin Modal Popup --><div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-hidden="true"> [Modal CONTENT] </div> <!--Signin Modal Popup --> <!--Javascript --> [PAGE JAVASCRIPTS HERE] </body> </html>
CSS Structure
Here is the general CSS structure of the template:
<!-- CSS Global Compulsory (Do not remove)--> <link rel="stylesheet" href="css/font-awesome/all.min.css" /> <link rel="stylesheet" href="css/flaticon/flaticon.css" /> <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" /> <!-- Page CSS Implementing Plugins (Remove the plugin CSS here if site does not use that feature)--> <link rel="stylesheet" href="css/owl-carousel/owl.carousel.min.css" /> <link rel="stylesheet" href="css/magnific-popup/magnific-popup.css" /> <!-- Template Style --> <link rel="stylesheet" href="css/style.css" />
- all.min.css: This is a Font-awesome CSS.
- flaticon.css: This is a Flaticon font icon CSS.
- bootstrap.min.css: This is a Bootstrap 4 CSS file. You must need this file. Do not remove this.
- owl.carousel.min.css: This is an owl carousel plugins CSS.
- magnific-popup.css: This is a magnific popup plugins CSS.
- style.css: This is a main stylesheet of the template, This file contains the styling for the actual Template.
Javascript Structure
Here is the general Javascript structure of the template:
<!-- JS Global Compulsory (Do not remove)--> <script src="js/jquery-3.4.1.min.js"></script> <script src="js/popper/popper.min.js"></script> <script src="js/bootstrap/bootstrap.min.js"></script> <!-- Page JS Implementing Plugins (Remove the plugin script here if site does not use that feature)--> <script src="js/jquery.appear.js"></script> <script src="js/counter/jquery.countTo.js"></script> <script src="js/owl-carousel/owl-carousel.min.js"></script> <script src="js/magnific-popup/jquery.magnific-popup.min.js"></script> <!-- Template Scripts (Do not remove)--> <script src="js/custom.js"></script>
- jquery.js: This is a JavaScript library file. You must need this file to run any javascript. Do not change or edit this file.
- popper.min.js: This is popper plugins file. Use to Tooltip. Do not change or edit this file.
- bootstrap.min.js: This is a bootstrap plugins file. Use to Bootstrap Library JavaScript. Do not change or edit this file.
- jquery.appear.js: This is appear plugins file. Do not change or edit this file.
- jquery.countTo.js: This is the countTo plugins file. Use to Count Number Do not change or edit this file.
- owl-carousel.min.js: This is owl-carousel plugins file. Use to Banner slider. Do not change or edit this file.
- jquery.magnific-popup.min.js: This is a magnific-popup plugins file. Use to images popup and popup slider. Do not change or edit this file.
- custom.js: This File includes all small scripts from the template. All script has commented code so you can easily remove unnecessary code from this file. Make sure you remove/add proper files before you remove or add anything in this file.