Laravel 5.7 Bootstrap Admin Panel Templates Integrate

Technology, Laravel, php, Programming Leave a comment

Today, We want to share with you Laravel 5.7 Bootstrap Admin Panel Templates Integrate.In this post we will show you Integrate admin template in Laravel 5.7, hear for Laravel Admin Packages to Use for Backend step by step we will give you demo and example for implement.In this post, we will learn about PHP Laravel 5.7 – Bootstrap Admin Theme Integration example from scratch with an example.

Laravel 5.7 Bootstrap Admin Panel Templates Integrate

There are the Following The simple About Laravel 5.7 Bootstrap Admin Panel Templates Integrate Full Information With Example and source code.

As I will cover this Post with live Working example to develop Laravel 5.7 Admin Panel Generators, so the Laravel 5.7 Admin Panel Generators for this example is following below.

Laravel Application Directory Structure

There are the following the list of the Simple Application Structure of Laravel 5.7 Framework

Laravel’s App Directory

  • Console
  • Exceptions
  • Http
  • –>Controllers
  • –>Middleware
  • Providers

Laravel’s Bootstrap Directory

  • bootstrap
  • –>cache

Laravel’s Config Directory

  • app.php
  • auth.php
  • broadcasting.php
  • cache.php
  • database.php
  • filesystems.php
  • mail.php
  • queue.php
  • services.php
  • session.php
  • view.php

Database Directory

  • database migrations
  • database seeds

Public Directory

  • images
  • js
  • css

Routes Directory

  • web.php
  • api.php
  • console.php

Storage Directory

Path : storage/app/public

Step 1: Install the Laravel 5.7

composer create-project laravel/laravel adminlaravel_template --prefer-dist

Laravel Define Route

Laravel define the route for the admin template.

Route::get('/', function () {
    return view('welcome');
});

Auth::routes();

Route::get('/home', '[email protected]')->name('home');

Step 2: Create a layout file called default.blade.php

default.blade.php
resources/views/layouts/default.blade.php

<!DOCTYPE html>
<html lang="en">
<head>
@include('includes.head')
</head>
<body>
    <div class="wrapper">
        @include('includes.header')
        @include('includes.sidebar')
        <!-- Contant -->
        <div class="content-wrapper">           
            @yield('content')
        </div>
        <!-- End Content -->
        @include('includes.footer')
    </div>
<!-- Script -->
<script src="{{ URL::asset('js/jquery-1.12.4.min.js') }}" type="text/javascript"></script> <!-- jquery min js -->
<script src="{{ URL::asset('js/bootstrap.min.js') }}" type="text/javascript"></script> <!-- bootstrap js -->
<script src="{{ URL::asset('js/jquery.dataTables.min.js') }}" type="text/javascript"></script> <!-- dataTables js -->
<script src="{{ URL::asset('js/dataTables.responsive.min.js') }}" type="text/javascript"></script> <!-- DataTables Responsive js -->    
<script src="{{ URL::asset('js/responsive.bootstrap4.min.js') }}" type="text/javascript"></script> <!-- Responsive Bootstrap4 js -->
<script src="{{ URL::asset('js/default.js') }}" type="text/javascript"></script> <!-- custom js -->
<script src="{{ URL::asset('js/sidebarmenu.js') }}" type="text/javascript"></script> <!-- custom js -->
<!-- End Script -->
<script>

</script>
@yield ('scripts')    
</body>
</html>

resources/views/includes/head.blade.php

<meta charset="UTF-8">
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<title>Your_Project_name InfoMedia</title>
<link rel="icon" href="{{ URL::asset('images/favicon.png') }}" type="image/x-icon" /> <!-- Favicon Icon -->

<link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700" rel="stylesheet"> <!-- Google Font -->

<link href="{{ URL::asset('css/bootstrap.css') }}" rel="stylesheet" type="text/css"/> <!-- Bootstrap -->
<link href="{{ URL::asset('css/responsive.bootstrap.min.css') }}" rel="stylesheet" type="text/css"/> <!-- Responsive Bootstrap  -->
<link href="{{ URL::asset('css/font-awesome.css') }}" rel="stylesheet" type="text/css"/> <!-- Font Awesome -->
<link href="{{ URL::asset('css/style.css') }}" rel="stylesheet" type="text/css"/> <!-- Custom css -->
<link href="{{ URL::asset('css/custom.css') }}" rel="stylesheet" type="text/css"/> <!-- Custom css -->
<link href="{{ URL::asset('css/responsive.css') }}" rel="stylesheet" type="text/css"/> <!-- Custom css -->

resources/views/includes/header.blade.php

<meta charset="UTF-8">
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<title>Your_Project_name InfoMedia</title>
<link rel="icon" href="{{ URL::asset('images/favicon.png') }}" type="image/x-icon" /> <!-- Favicon Icon -->

<link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700" rel="stylesheet"> <!-- Google Font -->

<link href="{{ URL::asset('css/bootstrap.css') }}" rel="stylesheet" type="text/css"/> <!-- Bootstrap -->
<link href="{{ URL::asset('css/responsive.bootstrap.min.css') }}" rel="stylesheet" type="text/css"/> <!-- Responsive Bootstrap  -->
<link href="{{ URL::asset('css/font-awesome.css') }}" rel="stylesheet" type="text/css"/> <!-- Font Awesome -->
<link href="{{ URL::asset('css/style.css') }}" rel="stylesheet" type="text/css"/> <!-- Custom css -->
<link href="{{ URL::asset('css/custom.css') }}" rel="stylesheet" type="text/css"/> <!-- Custom css -->
<link href="{{ URL::asset('css/responsive.css') }}" rel="stylesheet" type="text/css"/> <!-- Custom css -->

resources/views/includes/footer.blade.php

<!-- Footer -->
<!--<footer class="footer">
    <h3>Get in Touch with us:</h3>
    <p>For any Suggestion or any types of the help write us to <a href="mailto:[email protected]_Project_name.com"><i class="fa fa-envelope"></i> [email protected]_Project_name.com</a> or Skype : <a href="skype:john.sharma"><i class="fa fa-skype"></i> john.sharma</a></p>
    <p>If you have not gets any message or email from us after purchased this Product, please write us on <a href="mailto:[email protected]_Project_name.com"><i class="fa fa-envelope"></i> [email protected]_Project_name.com</a></p>          
</footer>-->
<!-- End Footer -->

resources/views/includes/sidebar.blade.php

<!-- Sidebar Menu -->
<aside class="main-sidebar">
    <section class="sidebar">
        <ul id="sidebarnav">
                <li {!! currentActivePath('home') !!}><a href="{{ url('home') }}" {!! selectedPath('home') !!}><i class="fa fa-tachometer"></i><span>Dashboard</span></a></li>
                <li {!! currentActivePath('products') !!}><a href="{{ url('products/active') }}" {!! selectedPath('products') !!}><i class="fa fa-ticket"></i><span>Active products</span> <span class="badge badge-pill badge-warning
">1</span></a> </li>
                <li {!! currentActivePath('complete') !!}><a href="{{ url('products/completed') }}" {!! selectedPath('complete') !!}><i class="fa fa-folder"></i><span>Completed products</span> <span class="badge badge-pill badge-warning
">1</span></a> </li>
                    <li {!! currentActivePath('cats') !!}><a href="{{ url('cats') }}" {!! selectedPath('cats') !!}><i class="fa fa-shopping-bag"></i><span>App's</span></a></li>
                    <li {!! currentActivePath('categories') !!}><a href="{{ url('categories') }}" {!! selectedPath('categories') !!}><i class="fa fa-sitemap"></i><span>Categories</span></a></li>
                    <li {!! currentActivePath('usertypes') !!}><a href="{{ url('usertypes') }}" {!! selectedPath('usertypes') !!}><i class="fa fa-sliders"></i><span>usertypes</span></a></li>
                    <li {!! currentActivePath('status') !!}><a href="{{ url('status') }}" {!! selectedPath('status') !!}><i class="fa fa-tasks"></i><span>Status</span></a></li>
                    <li {!! currentActivePath('auto-response') !!}><a href="{{ url('auto-response') }}" {!! selectedPath('auto-response') !!}><i class="fa fa-reply-all"></i><span>Canned response</span></a></li>
                    <li {!! currentActivePath('catinfos') !!}><a href="{{ url('catinfos') }}" {!! selectedPath('catinfos') !!}><i class="fa fa-list-ol"></i><span>cat's info</span></a></li>
                    <li {!! currentActivePath('spam-emails') !!}><a href="{{ url('spam-emails') }}" {!! selectedPath('spam-emails') !!}><i class="fa fa-envelope-open"></i><span>Spam Email's</span></a></li>
        </ul>
    </section>
    <!--<div class="user-icon">
        <a href="user.html" class="user-btn">
            <img src="images/user.svg" alt="">
        </a>
    </div>-->
</aside>
<!-- End Sidebar Menu -->

http/Controllers/HomeController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class HomeController extends Controller
{
    /**
     * Create a new controller instance.
     *
     * @return void
     */
    public function __construct()
    {
        $this->middleware('auth');
    }

    /**
     * Show the application dashboard.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        return view('home');
    }
}

Angular 6 CRUD Operations Application Tutorials

Read :

Also Read This 👉   How to write PHP code inside of Laravel Blade template?

Summary

You can also read about AngularJS, ASP.NET, VueJs, PHP.

I hope you get an idea about Laravel 5.7 Bootstrap Admin Panel Templates Integrate.
I would like to have feedback on my Pakainfo.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

Related posts:

  1. Bootstrap Daterangepicker Example
  2. Bootstrap datepicker disable past dates Example
  3. Laravel Ajax Bootstrap Toggle switch Update MySQL
  4. bootstrap jumbotron examples
  5. Bootstrap Datetimepicker Disable Dates Dynamically