1. OVERVIEW

Dleohr Bootstrap 4 Hr Admin Template Dleohr is the responsive dashboard template along with Calendar. It has many functionalities in which enhance the small business to use it .

The advantage of using this template is the ability to customize according your to suit your needs. Elite Design Adopt for Hr Management.

1. 1. Features

Creative Design: The Dleohr is a simple, intelligent and user-friendly solution that offers many kinds of technology modules to help in your requirements.
Fully Responsive: The theme passed Mobile-Friendly Test – by Google. We also tested carefully the theme on almost devices: laptop, tablet, and phone. All elements are 100% responsive and ready for all devices.
Pixel Perfect Design
Product Carousel: Option to showcase products as carousel.
Color & Fonts is easily changed
Customer Reviews, Customer accounts, Compare Products, Grid & List layout, product fillter
Newsletter, Social Sharing
W3C Validated Code
Bootstrap 5.x used
Compatible Browsers: IE8+, Firefox, Safari, Opera, Chrome

1. 2. Installation Guide

After unzipping Template Files, you will find our product Dleohr->HTML(Source code), Documentation, and License in the following Main Files folder.
Open HTML folder, copy all files and paste in your localhost or server root folder. Now you can run this Template in any web browser from your PC or Laptop.

For example:

localhost/dleohr/index.html or www.example.com/index.html

1. 3. Requirements

Working with our Dleohr product, before going to edit all the HTML, CSS and JS files you will need a text editor.

In this case, we recommended the Sublime Text 3 editor or Notepad++as it allows you to edit the files efficiently and all the editable files are located in "dleo->HTML" folder.

2. STRUCTURE

2. 1. File Structure

Extract the zip file you received after purchase and you would find the exact below files and folders:

dleohr/ 
│
└──  html/
	│
	└── assets/           
		│
		└── css/           
			│
			└── fonts/               
			│
			└── img/        
			│
			└── js/                 
			│
			└── plugins/                
			│
			└── index.html     

			 rest of the html pages  

			 dark/  
	│
	└──rest of the themes/       
	│
	└──documentation/

2. 2. HTML Structure

<!DOCTYPE html>
								<html lang="en">
								<head>
								  <meta charset="utf-8">
								  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
								  <title>Dleohr - Bootstrap 4 Admin Dashboard Template </title>
								  <link rel="shortcut icon" type="image/x-icon" href="images/favicon.png">
								  <link href="https://fonts.googleapis.com/css?family=Muli:300,400,600,700,800,900&display=swap" rel="stylesheet">
								  <link rel="stylesheet" href="css/bootstrap.min.css">
								  <link rel="stylesheet" href="css/font-awesome.min.css">
								  <link rel="stylesheet" href="assets/plugins/morris/morris.css">
								  <link rel="stylesheet" href="css/style.css">
								</head>
								  <body>
									<div class="inner-wrapper">
									   <div class="header">
									   </div>
									   <div class="page-wrapper"> 
									   <div class="container-fluid">
									   </div>
									   </div>
									</div>
									<script src="assets/js/jquery-3.2.1.min.js"></script>
									<script src="assets/js/popper.min.js"></script>
									<script src="assets/js/bootstrap.min.js"></script>
									<script src="assets/js/Chart.min.js"></script>
									<script src="assets/js/chart.js"></script>
									<script src="assets/js/script.js"></script>
								  </body>
								</html>

2. 3. CSS Structure

Our external styles files are seperated on css and plugins folders on the assets. Below the example css plugin lists

<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/plugins/fontawesome/css/fontawesome.min.css">
<link rel="stylesheet" href="assets/plugins/fontawesome/css/all.min.css">  
<link rel="stylesheet" href="assets/css/bootstrap-datetimepicker.min.css">  
<link rel="stylesheet" href="assets/plugins/datatables/datatables.min.css">  
<link rel="stylesheet" href="assets/css/fullcalendar.min.css"> 
<link rel="stylesheet" href="assets/plugins/select2/css/select2.min.css"> 
<link rel="stylesheet" href="assets/css/style.css">

How to change Header background color ?

You can change the logo or replace it from img folder or you can edit it from HTML file.

How to change Google Font ?

Go to index.html and line number 11. Here we have the default font family Poppins

<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,500;0,600;0,700;1,400&display=swap" rel="stylesheet">

2. 4. Javascripts

We have used this javascript for this template. You can customize the scripts.js

<script src="assets/js/jquery-3.6.0.min.js"></script>
<script src="assets/js/popper.min.js"></script>
<script src="assets/plugins/bootstrap/js/bootstrap.min.js"></script>  
<script src="assets/plugins/select2/js/select2.min.js"></script>  
<script src="assets/plugins/owlcarousel/owl.carousel.min.js"></script>  
<script src="assets/js/script.js"></script>

3. CREDITS

We've used the following resources as listed. These are some awesome creation and we are thankful to the community.

4. SUPPORT

You get full life-time support with this item. If you need some help or found a bug or issue with the template, You can always contact us at here via email and we will respond to you within 1 day.

5. THANK YOU

Thank you so much for using this template

Dreamguy's Technologies Pvt Ltd,

Table Of Content

Documentation