It's based on css/javascript so it needs to be in your public_html folder.
I made a "vendor" folder that includes:
adminlte (this is the dist folder if you download the .zip file)
bootstrap
ckeditor
font-awesome
jquery
jquery-slimscroll
After that you can use it in your application/views template files. I have an header (that includes menu and sidebar code) and a footer for alla JavaScript.
PHP Code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title><?php echo lang('program_name'); ?> | <?php echo lang('program_desc'); ?></title>
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<link rel="stylesheet" href="/vendor/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="/vendor/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="/vendor/adminlte/css/AdminLTE.min.css">
<link rel="stylesheet" href="/vendor/adminlte/css/skins/_all-skins.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">
</head>
<body class="<?php echo $body_class; ?>">
<div class="wrapper">
<?php $this->load->view('template/menu'); ?>
<?php $this->load->view('template/sidebar'); ?>
PHP Code:
<footer class="main-footer">
<div class="pull-right hidden-xs">
<b>Version</b> 2.4.0
</div>
<strong>Copyright © 2014-2016 <a href="https://adminlte.io">Almsaeed Studio</a>.</strong> All rights
reserved.
</footer>
</div>
<!-- ./wrapper -->
<script src="/vendor/jquery/jquery.min.js"></script>
<script src="/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="/vendor/jquery-slimscroll/jquery.slimscroll.min.js"></script>
<script src="/vendor/adminlte/js/adminlte.min.js"></script>
</body>
</html>
And I tell Codeigniter to load a master that, that includes the header and footer.
PHP Code:
<?php $this->load->view('template/header'); ?>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
Fixed Layout
<small>Blank example to the fixed layout</small>
</h1>
<ol class="breadcrumb">
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
<li><a href="#">Layout</a></li>
<li class="active">Fixed</li>
</ol>
</section>
<!-- Main content -->
<section class="content">
<div class="callout callout-info">
<h4>Tip!</h4>
<p>Add the fixed class to the body tag to get this layout. The fixed layout is your best option if your sidebar
is bigger than your content because it prevents extra unwanted scrolling.</p>
</div>
<!-- Default box -->
<div class="box">
<div class="box-header with-border">
<h3 class="box-title">Title</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
<i class="fa fa-minus"></i></button>
<button type="button" class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
<i class="fa fa-times"></i></button>
</div>
</div>
<div class="box-body">
Start creating your amazing application!
</div>
<!-- /.box-body -->
<div class="box-footer">
Footer
</div>
<!-- /.box-footer-->
</div>
<!-- /.box -->
</section>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->
<?php $this->load->view('template/footer'); ?>
