Setting Template Bootstrap
Uploaded by
SoniaSetting Template Bootstrap
Uploaded by
Sonia3.
Setting Template Bootstrap
Sebelum setting template bootstrap pastikan anda telah menginstal laravelnya.
Ini adalah folder laravel yang telah di install
3.1 copy atau pindahkan folder bootsrap
Langkah pertama yang kita lakukan adalah copy atau pindahkan folder bootsrap, css, js,
plugins, scss template ample admin lite master ke dalam folder public sbb :
3.2 Membuat File
Setelah itu Buat sebuah file di folder layouts yang ada didalam folder views dan beri
nama app2.blade.php file ini berfungsi sebagai layouts dari templates yang akan kita gunakan.
Lalu anda copykan seluruh isi dari file dashboard.html yang dapat anda temukan di
template ample admin lite master ke app2.blade.php.
<!DOCTYPE html>
<html dir="ltr" lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Tell the browser to be responsive to screen width -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="keywords"
content="wrappixel, admin dashboard, html css dashboard, web dashboard, bootstrap 5 admin, bootst
rap 5, css3 dashboard, bootstrap 5 dashboard, Ample lite admin bootstrap 5 dashboard, frontend, responsiv
e bootstrap 5 admin template, Ample admin lite dashboard bootstrap 5 dashboard template">
<meta name="description"
content="Ample Admin Lite is powerful and clean admin dashboard template, inpired from Bootstrap
Framework">
<meta name="robots" content="noindex,nofollow">
<title>Ample Admin Lite Template by WrapPixel</title>
<link rel="canonical" href="https://www.wrappixel.com/templates/ample-admin-lite/" />
<!-- Favicon icon -->
<link rel="icon" type="image/png" sizes="16x16" href="plugins/images/favicon.png">
<!-- Custom CSS -->
<link href="plugins/bower_components/chartist/dist/chartist.min.css" rel="stylesheet">
<link rel="stylesheet" href="plugins/bower_components/chartist-plugin-tooltips/dist/chartist-plugin-
tooltip.css">
<!-- Custom CSS -->
<link href="css/style.min.css" rel="stylesheet">
</head>
<body>
<!-- ============================================================== -->
<!-- Preloader - style you can find in spinners.css -->
<!-- ============================================================== -->
<div class="preloader">
<div class="lds-ripple">
<div class="lds-pos"></div>
<div class="lds-pos"></div>
</div>
</div>
<!-- ============================================================== -->
<!-- Main wrapper - style you can find in pages.scss -->
<!-- ============================================================== -->
<div id="main-wrapper" data-layout="vertical" data-navbarbg="skin5" data-sidebartype="full"
data-sidebar-position="absolute" data-header-position="absolute" data-boxed-layout="full">
<!-- ============================================================== -->
<!-- Topbar header - style you can find in pages.scss -->
<!-- ============================================================== -->
<header class="topbar" data-navbarbg="skin5">
<nav class="navbar top-navbar navbar-expand-md navbar-dark">
<div class="navbar-header" data-logobg="skin6">
<!-- ============================================================== --
>
<!-- Logo -->
<!-- ============================================================== --
>
<a class="navbar-brand" href="dashboard.html">
<!-- Logo icon -->
<b class="logo-icon">
<!-- Dark Logo icon -->
<img src="plugins/images/logo-icon.png" alt="homepage" />
</b>
<!--End Logo icon -->
<!-- Logo text -->
<span class="logo-text">
<!-- dark Logo text -->
<img src="plugins/images/logo-text.png" alt="homepage" />
</span>
</a>
<!-- ============================================================== --
>
<!-- End Logo -->
<!-- ============================================================== --
>
<!-- ============================================================== --
>
<!-- toggle and nav items -->
<!-- ============================================================== --
>
<a class="nav-toggler waves-effect waves-light text-dark d-block d-md-none"
href="javascript:void(0)"><i class="ti-menu ti-close"></i></a>
</div>
<!-- ============================================================== -->
<!-- End Logo -->
<!-- ============================================================== -->
<div class="navbar-collapse collapse" id="navbarSupportedContent" data-navbarbg="skin5">
<!-- ============================================================== --
>
<!-- Right side toggle and nav items -->
<!-- ============================================================== --
>
<ul class="navbar-nav ms-auto d-flex align-items-center">
<!-- ==============================================================
-->
<!-- Search -->
<!-- ==============================================================
-->
<li class=" in">
<form role="search" class="app-search d-none d-md-block me-3">
<input type="text" placeholder="Search..." class="form-control mt-0">
<a href="" class="active">
<i class="fa fa-search"></i>
</a>
</form>
</li>
<!-- ==============================================================
-->
<!-- User profile and search -->
<!-- ==============================================================
-->
<li>
<a class="profile-pic" href="#">
<img src="plugins/images/users/varun.jpg" alt="user-img" width="36"
class="img-circle"><span class="text-white font-medium">Steave</span></a>
</li>
<!-- ==============================================================
-->
<!-- User profile and search -->
<!-- ==============================================================
-->
</ul>
</div>
</nav>
</header>
<!-- ============================================================== -->
<!-- End Topbar header -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- Left Sidebar - style you can find in sidebar.scss -->
<!-- ============================================================== -->
<aside class="left-sidebar" data-sidebarbg="skin6">
<!-- Sidebar scroll-->
<div class="scroll-sidebar">
<!-- Sidebar navigation-->
<nav class="sidebar-nav">
<ul id="sidebarnav">
<!-- User Profile-->
<li class="sidebar-item pt-2">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="dashboard.html"
aria-expanded="false">
<i class="far fa-clock" aria-hidden="true"></i>
<span class="hide-menu">Dashboard</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="profile.html"
aria-expanded="false">
<i class="fa fa-user" aria-hidden="true"></i>
<span class="hide-menu">Profile</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="basic-table.html"
aria-expanded="false">
<i class="fa fa-table" aria-hidden="true"></i>
<span class="hide-menu">Basic Table</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="fontawesome.html"
aria-expanded="false">
<i class="fa fa-font" aria-hidden="true"></i>
<span class="hide-menu">Icon</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="map-google.html"
aria-expanded="false">
<i class="fa fa-globe" aria-hidden="true"></i>
<span class="hide-menu">Google Map</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="blank.html"
aria-expanded="false">
<i class="fa fa-columns" aria-hidden="true"></i>
<span class="hide-menu">Blank Page</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="404.html"
aria-expanded="false">
<i class="fa fa-info-circle" aria-hidden="true"></i>
<span class="hide-menu">Error 404</span>
</a>
</li>
<li class="text-center p-20 upgrade-btn">
<a href="https://www.wrappixel.com/templates/ampleadmin/"
class="btn d-grid btn-danger text-white" target="_blank">
Upgrade to Pro</a>
</li>
</ul>
</nav>
<!-- End Sidebar navigation -->
</div>
<!-- End Sidebar scroll-->
</aside>
<!-- ============================================================== -->
<!-- End Left Sidebar - style you can find in sidebar.scss -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- Page wrapper -->
<!-- ============================================================== -->
<div class="page-wrapper">
<!-- ============================================================== -->
<!-- Bread crumb and right sidebar toggle -->
<!-- ============================================================== -->
<div class="page-breadcrumb bg-white">
<div class="row align-items-center">
<div class="col-lg-3 col-md-4 col-sm-4 col-xs-12">
<h4 class="page-title">Dashboard</h4>
</div>
<div class="col-lg-9 col-sm-8 col-md-8 col-xs-12">
<div class="d-md-flex">
<ol class="breadcrumb ms-auto">
<li><a href="#" class="fw-normal">Dashboard</a></li>
</ol>
<a href="https://www.wrappixel.com/templates/ampleadmin/" target="_blank"
class="btn btn-danger d-none d-md-block pull-right ms-3 hidden-xs hidden-sm waves
-effect waves-light text-white">Upgrade
to Pro</a>
</div>
</div>
</div>
<!-- /.col-lg-12 -->
</div>
<!-- ============================================================== -->
<!-- End Bread crumb and right sidebar toggle -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- Container fluid -->
<!-- ============================================================== -->
<div class="container-fluid">
<!-- ============================================================== -->
<!-- Three charts -->
<!-- ============================================================== -->
<div class="row justify-content-center">
<div class="col-lg-4 col-md-12">
<div class="white-box analytics-info">
<h3 class="box-title">Total Visit</h3>
<ul class="list-inline two-part d-flex align-items-center mb-0">
<li>
<div id="sparklinedash"><canvas width="67" height="30"
style="display: inline-block; width: 67px; height: 30px; vertical-align: top;
"></canvas>
</div>
</li>
<li class="ms-auto"><span class="counter text-success">659</span></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-12">
<div class="white-box analytics-info">
<h3 class="box-title">Total Page Views</h3>
<ul class="list-inline two-part d-flex align-items-center mb-0">
<li>
<div id="sparklinedash2"><canvas width="67" height="30"
style="display: inline-block; width: 67px; height: 30px; vertical-align: top;
"></canvas>
</div>
</li>
<li class="ms-auto"><span class="counter text-purple">869</span></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-12">
<div class="white-box analytics-info">
<h3 class="box-title">Unique Visitor</h3>
<ul class="list-inline two-part d-flex align-items-center mb-0">
<li>
<div id="sparklinedash3"><canvas width="67" height="30"
style="display: inline-block; width: 67px; height: 30px; vertical-align: top;
"></canvas>
</div>
</li>
<li class="ms-auto"><span class="counter text-info">911</span>
</li>
</ul>
</div>
</div>
</div>
============================================================== -->
<!-- footer -->
<!-- ============================================================== -->
<footer class="footer text-center"> 2021 © Ample Admin brought to you by <a
href="https://www.wrappixel.com/">wrappixel.com</a>
</footer>
<!-- ============================================================== -->
<!-- End footer -->
<!-- ============================================================== -->
</div>
<!-- ============================================================== -->
<!-- End Page wrapper -->
<!-- ============================================================== -->
</div>
<!-- ============================================================== -->
<!-- End Wrapper -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- All Jquery -->
<!-- ============================================================== -->
<script src="plugins/bower_components/jquery/dist/jquery.min.js"></script>
<!-- Bootstrap tether Core JavaScript -->
<script src="bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="js/app-style-switcher.js"></script>
<script src="plugins/bower_components/jquery-sparkline/jquery.sparkline.min.js"></script>
<!--Wave Effects -->
<script src="js/waves.js"></script>
<!--Menu sidebar -->
<script src="js/sidebarmenu.js"></script>
<!--Custom JavaScript -->
<script src="js/custom.js"></script>
<!--This page JavaScript -->
<!--chartis chart-->
<script src="plugins/bower_components/chartist/dist/chartist.min.js"></script>
<script src="plugins/bower_components/chartist-plugin-tooltips/dist/chartist-plugin-
tooltip.min.js"></script>
<script src="js/pages/dashboards/dashboard1.js"></script>
</body>
</html>
3.3 Include File
Dari file yang telah anda copykan ada beberapa file yang akan kita include, maka kita
harus siapakan file – file yang di include antaralain sbb:
- header.blade.php
- sidebar.blade.php
- mainmenu.blade.php
- footer.blade.php
dan simpan semua file tersebut kedalam folder layouts
3.4 Cut File Tag Head
Pertama kita akan cut file mulai dari tag head sampai dengan penutup header kedalam
folder header.blade.php yang sudah dibuat tadi.
Header.blade.php berfungsi untuk menampung section head.
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Tell the browser to be responsive to screen width -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="keywords"
content="wrappixel, admin dashboard, html css dashboard, web dashboard, bootstrap 5 admin, bootst
rap 5, css3 dashboard, bootstrap 5 dashboard, Ample lite admin bootstrap 5 dashboard, frontend, responsiv
e bootstrap 5 admin template, Ample admin lite dashboard bootstrap 5 dashboard template">
<meta name="description"
content="Ample Admin Lite is powerful and clean admin dashboard template, inpired from Bootstrap
Framework">
<meta name="robots" content="noindex,nofollow">
<title>Ample Admin Lite Template by WrapPixel</title>
<link rel="canonical" href="https://www.wrappixel.com/templates/ample-admin-lite/" />
<!-- Favicon icon -->
<link rel="icon" type="image/png" sizes="16x16" href="plugins/images/favicon.png">
<!-- Custom CSS -->
<link href="plugins/bower_components/chartist/dist/chartist.min.css" rel="stylesheet">
<link rel="stylesheet" href="plugins/bower_components/chartist-plugin-tooltips/dist/chartist-plugin-
tooltip.css">
<!-- Custom CSS -->
<link href="css/style.min.css" rel="stylesheet">
</head>
<body>
<!-- ============================================================== -->
<!-- Preloader - style you can find in spinners.css -->
<!-- ============================================================== -->
<div class="preloader">
<div class="lds-ripple">
<div class="lds-pos"></div>
<div class="lds-pos"></div>
</div>
</div>
<!-- ============================================================== -->
<!-- Main wrapper - style you can find in pages.scss -->
<!-- ============================================================== -->
<div id="main-wrapper" data-layout="vertical" data-navbarbg="skin5" data-sidebartype="full"
data-sidebar-position="absolute" data-header-position="absolute" data-boxed-layout="full">
<!-- ============================================================== -->
<!-- Topbar header - style you can find in pages.scss -->
<!-- ============================================================== -->
<header class="topbar" data-navbarbg="skin5">
<nav class="navbar top-navbar navbar-expand-md navbar-dark">
<div class="navbar-header" data-logobg="skin6">
<!-- ============================================================== --
>
<!-- Logo -->
<!-- ============================================================== --
>
<a class="navbar-brand" href="dashboard.html">
<!-- Logo icon -->
<b class="logo-icon">
<!-- Dark Logo icon -->
<img src="plugins/images/logo-icon.png" alt="homepage" />
</b>
<!--End Logo icon -->
<!-- Logo text -->
<span class="logo-text">
<!-- dark Logo text -->
<img src="plugins/images/logo-text.png" alt="homepage" />
</span>
</a>
<!-- ============================================================== --
>
<!-- End Logo -->
<!-- ============================================================== --
>
<!-- ============================================================== --
>
<!-- toggle and nav items -->
<!-- ============================================================== --
>
<a class="nav-toggler waves-effect waves-light text-dark d-block d-md-none"
href="javascript:void(0)"><i class="ti-menu ti-close"></i></a>
</div>
<!-- ============================================================== -->
<!-- End Logo -->
<!-- ============================================================== -->
<div class="navbar-collapse collapse" id="navbarSupportedContent" data-navbarbg="skin5">
<!-- ============================================================== --
>
<!-- Right side toggle and nav items -->
<!-- ============================================================== --
>
<ul class="navbar-nav ms-auto d-flex align-items-center">
<!-- ==============================================================
-->
<!-- Search -->
<!-- ==============================================================
-->
<li class=" in">
<form role="search" class="app-search d-none d-md-block me-3">
<input type="text" placeholder="Search..." class="form-control mt-0">
<a href="" class="active">
<i class="fa fa-search"></i>
</a>
</form>
</li>
<!-- ==============================================================
-->
<!-- User profile and search -->
<!-- ==============================================================
-->
<li>
<a class="profile-pic" href="#">
<img src="plugins/images/users/varun.jpg" alt="user-img" width="36"
class="img-circle"><span class="text-white font-medium">Steave</span></a>
</li>
<!-- ==============================================================
-->
<!-- User profile and search -->
<!-- ==============================================================
-->
</ul>
</div>
</nav>
</header>
<!-- ============================================================== -->
<!-- End Topbar header -->
3.3 Cut File Tag Aside
Kemudian cut file mulai dari tag aside sampai dengan penutupnya kedalam folder
sidebar.blade.php.
Sidebar.blade.php ini berfungsi untuk menampung sidebar
<aside class="left-sidebar" data-sidebarbg="skin6">
<!-- Sidebar scroll-->
<div class="scroll-sidebar">
<!-- Sidebar navigation-->
<nav class="sidebar-nav">
<ul id="sidebarnav">
<!-- User Profile-->
<li class="sidebar-item pt-2">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="dashboard.html"
aria-expanded="false">
<i class="far fa-clock" aria-hidden="true"></i>
<span class="hide-menu">Dashboard</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="profile.html"
aria-expanded="false">
<i class="fa fa-user" aria-hidden="true"></i>
<span class="hide-menu">Profile</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="basic-table.html"
aria-expanded="false">
<i class="fa fa-table" aria-hidden="true"></i>
<span class="hide-menu">Basic Table</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="fontawesome.html"
aria-expanded="false">
<i class="fa fa-font" aria-hidden="true"></i>
<span class="hide-menu">Icon</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="map-google.html"
aria-expanded="false">
<i class="fa fa-globe" aria-hidden="true"></i>
<span class="hide-menu">Google Map</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="blank.html"
aria-expanded="false">
<i class="fa fa-columns" aria-hidden="true"></i>
<span class="hide-menu">Blank Page</span>
</a>
</li>
<li class="sidebar-item">
<a class="sidebar-link waves-effect waves-dark sidebar-link" href="404.html"
aria-expanded="false">
<i class="fa fa-info-circle" aria-hidden="true"></i>
<span class="hide-menu">Error 404</span>
</a>
</li>
<li class="text-center p-20 upgrade-btn">
<a href="https://www.wrappixel.com/templates/ampleadmin/"
class="btn d-grid btn-danger text-white" target="_blank">
Upgrade to Pro</a>
</li>
</ul>
</nav>
<!-- End Sidebar navigation -->
</div>
<!-- End Sidebar scroll-->
</aside>
1. Kemudian cut file mulai dari tag footer sampai dengan penutupnya kedalam folder
footer.blade.php.
footer.blade.php ini berfungsi untuk menampung footer
<footer class="footer text-center"> 2021 © Ample Admin brought to you by <a
href="https://www.wrappixel.com/">wrappixel.com</a>
</footer>
<footer class="footer text-center"> 2021 © Ample Admin brought to you by <a
href="https://www.wrappixel.com/">wrappixel.com</a>
</footer>
2. Selanjutnya setelah file – file tadi sudah dipisahkan maka akan menjadi sbb :
Untuk memanggil file yang sudah kita pisahkan tadi maka kita gunakan @include
- @include(views.header) berfungsi untuk memanggil header
- @include(views.sidebar) berfungsi untuk memanggil sidebar
- @include(views.footer) berfungsi untuk memanggil footer
<!DOCTYPE html>
<html dir="ltr" lang="en">
@include('layouts.header')
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- Left Sidebar - style you can find in sidebar.scss -->
<!-- ============================================================== -->
@include('layouts.sidebar')
<!-- ============================================================== -->
<!-- End Left Sidebar - style you can find in sidebar.scss -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- Page wrapper -->
<!-- ============================================================== -->
<div class="page-wrapper">
<!-- ============================================================== -->
<!-- Bread crumb and right sidebar toggle -->
<!-- ============================================================== -->
<div class="page-breadcrumb bg-white">
<div class="row align-items-center">
<div class="col-lg-3 col-md-4 col-sm-4 col-xs-12">
<h4 class="page-title">Dashboard</h4>
</div>
<div class="col-lg-9 col-sm-8 col-md-8 col-xs-12">
<div class="d-md-flex">
<ol class="breadcrumb ms-auto">
<li><a href="#" class="fw-normal">Dashboard</a></li>
</ol>
<a href="https://www.wrappixel.com/templates/ampleadmin/" target="_blank"
class="btn btn-danger d-none d-md-block pull-right ms-3 hidden-xs hidden-sm waves
-effect waves-light text-white">Upgrade
to Pro</a>
</div>
</div>
</div>
<!-- /.col-lg-12 -->
</div>
<!-- ============================================================== -->
<!-- End Bread crumb and right sidebar toggle -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- Container fluid -->
<!-- ============================================================== -->
<div class="container-fluid">
<!-- ============================================================== -->
<!-- Three charts -->
<!-- ============================================================== -->
<div class="row justify-content-center">
<div class="col-lg-4 col-md-12">
<div class="white-box analytics-info">
<h3 class="box-title">Total Visit</h3>
<ul class="list-inline two-part d-flex align-items-center mb-0">
<li>
<div id="sparklinedash"><canvas width="67" height="30"
style="display: inline-block; width: 67px; height: 30px; vertical-align: top;
"></canvas>
</div>
</li>
<li class="ms-auto"><span class="counter text-success">659</span></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-12">
<div class="white-box analytics-info">
<h3 class="box-title">Total Page Views</h3>
<ul class="list-inline two-part d-flex align-items-center mb-0">
<li>
<div id="sparklinedash2"><canvas width="67" height="30"
style="display: inline-block; width: 67px; height: 30px; vertical-align: top;
"></canvas>
</div>
</li>
<li class="ms-auto"><span class="counter text-purple">869</span></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-12">
<div class="white-box analytics-info">
<h3 class="box-title">Unique Visitor</h3>
<ul class="list-inline two-part d-flex align-items-center mb-0">
<li>
<div id="sparklinedash3"><canvas width="67" height="30"
style="display: inline-block; width: 67px; height: 30px; vertical-align: top;
"></canvas>
</div>
</li>
<li class="ms-auto"><span class="counter text-info">911</span>
</li>
</ul>
</div>
</div>
</div>
<!-- ============================================================== -->
<!-- PRODUCTS YEARLY SALES -->
<!-- ============================================================== -->
<div class="row">
<div class="col-md-12 col-lg-12 col-sm-12 col-xs-12">
<div class="white-box">
<h3 class="box-title">Products Yearly Sales</h3>
<div class="d-md-flex">
<ul class="list-inline d-flex ms-auto">
<li class="ps-3">
<h5><i class="fa fa-circle me-1 text-info"></i>Mac</h5>
</li>
<li class="ps-3">
<h5><i class="fa fa-circle me-1 text-inverse"></i>Windows</h5>
</li>
</ul>
</div>
<div id="ct-visits" style="height: 405px;">
<div class="chartist-tooltip" style="top: -17px; left: -12px;"><span
class="chartist-tooltip-value">6</span>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- ============================================================== -->
<!-- End Container fluid -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- footer -->
<!-- ============================================================== -->
@include('layouts.footer')
<!-- ============================================================== -->
<!-- End footer -->
<!-- ============================================================== -->
</div>
<!-- ============================================================== -->
<!-- End Page wrapper -->
<!-- ============================================================== -->
</div>
<!-- ============================================================== -->
<!-- End Wrapper -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- All Jquery -->
<!-- ============================================================== -->
<script src="plugins/bower_components/jquery/dist/jquery.min.js"></script>
<!-- Bootstrap tether Core JavaScript -->
<script src="bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="js/app-style-switcher.js"></script>
<script src="plugins/bower_components/jquery-sparkline/jquery.sparkline.min.js"></script>
<!--Wave Effects -->
<script src="js/waves.js"></script>
<!--Menu sidebar -->
<script src="js/sidebarmenu.js"></script>
<!--Custom JavaScript -->
<script src="js/custom.js"></script>
<!--This page JavaScript -->
<!--chartis chart-->
<script src="plugins/bower_components/chartist/dist/chartist.min.js"></script>
<script src="plugins/bower_components/chartist-plugin-tooltips/dist/chartist-plugin-
tooltip.min.js"></script>
<script src="js/pages/dashboards/dashboard1.js"></script>
</body>
</html>
3. Agar dapat kita coba di browser jangan lupa tambahkan routes nya di file web.php sbb :
Route::get('/', function () {
return view('layouts/app2');
});
4. Dan Setting Template Bootstrap telah berhasil dilakukan
You might also like
- How To Create A Blog in PHP and MySQL Database100% (1)How To Create A Blog in PHP and MySQL Database85 pages
- Week 13.. - Laudon-Traver - Ec15 - PPT - ch12 - PPTNo ratings yetWeek 13.. - Laudon-Traver - Ec15 - PPT - ch12 - PPT58 pages
- Spring Boot Thymeleaf CRUD Database Real-Time ProjectNo ratings yetSpring Boot Thymeleaf CRUD Database Real-Time Project58 pages
- Exercise: Getting Started With Bootstrap: Index - HTMLNo ratings yetExercise: Getting Started With Bootstrap: Index - HTML3 pages
- TI33031 Pemrograman Web I: M Rizki Fadhilah S.T., M.Eng. Prodi Teknik Informatika Fakultas Teknik Universitas Islam RiauNo ratings yetTI33031 Pemrograman Web I: M Rizki Fadhilah S.T., M.Eng. Prodi Teknik Informatika Fakultas Teknik Universitas Islam Riau63 pages
- Application Development. It Has Rich and Reusable Libraries and Class For Your Website's FoundationNo ratings yetApplication Development. It Has Rich and Reusable Libraries and Class For Your Website's Foundation9 pages
- Tutorial:Creating A Basic Joomla! TemplateNo ratings yetTutorial:Creating A Basic Joomla! Template6 pages
- Laravel API Tutorial - Building & Testing A RESTful API - ToptalNo ratings yetLaravel API Tutorial - Building & Testing A RESTful API - Toptal28 pages
- CSCE 120: Learning To Code: Hacktivity 1.1: Getting StartedNo ratings yetCSCE 120: Learning To Code: Hacktivity 1.1: Getting Started5 pages
- Building Your First Laravel ApplicationNo ratings yetBuilding Your First Laravel Application38 pages
- Imaging Protocol Loading Guidance - SM - DOC2113485 - 1No ratings yetImaging Protocol Loading Guidance - SM - DOC2113485 - 119 pages
- The AI Opportunity in Sourcing and ProcurementNo ratings yetThe AI Opportunity in Sourcing and Procurement12 pages
- [FREE PDF sample] Networks and Communications NetCom2013 Proceedings of the Fifth International Conference on Networks Communications 1st Edition Natarajan Meghanathan ebooks100% (17)[FREE PDF sample] Networks and Communications NetCom2013 Proceedings of the Fifth International Conference on Networks Communications 1st Edition Natarajan Meghanathan ebooks37 pages
- Understanding The WordPress Template HierarchyNo ratings yetUnderstanding The WordPress Template Hierarchy7 pages
- The OpenAltaRica Platform - Getting StartedNo ratings yetThe OpenAltaRica Platform - Getting Started32 pages
- Katalog REOVIB Schwingfoerdertechnik en 2No ratings yetKatalog REOVIB Schwingfoerdertechnik en 252 pages
- Datasheet of DS-2DT6425X-AELY (T5) - 20220125No ratings yetDatasheet of DS-2DT6425X-AELY (T5) - 202201257 pages
- Chapter 4: Jacobians, Velocity, and Static Force: RoboticsNo ratings yetChapter 4: Jacobians, Velocity, and Static Force: Robotics23 pages
- Trump v. Benson Complaint Exhibit 1 (Affidavits)No ratings yetTrump v. Benson Complaint Exhibit 1 (Affidavits)234 pages
- RTL838x_RTL833x_Developer_Guide_V1.3_npNo ratings yetRTL838x_RTL833x_Developer_Guide_V1.3_np169 pages
- EE147-Answers-2218.docx EE147-Answers-2218.docx EE147-Answers-2218No ratings yetEE147-Answers-2218.docx EE147-Answers-2218.docx EE147-Answers-221816 pages
- Humboldt Triaxial Equipment Guide-LR0417No ratings yetHumboldt Triaxial Equipment Guide-LR041721 pages
