How to Integrate AdminLTE 3 in Laravel 11?
In this article, we will see how to install & setup adminlte 3 with laravel 11. we will use jeroennoten/laravel-adminlte composer package to implement adminlte 3 admin template.
What is AdminLTE?
AdminLTE is a popular, open-source admin dashboard template built using HTML, CSS, and JavaScript. It provides ready-made UI components like tables, charts, and forms to help create admin panels or dashboards for web applications. It's responsive, customizable, and easy to integrate with frameworks like Laravel, making it a popular choice for backend interfaces.
Let's follow the simple steps to setup bootstrap 5 AdminLTE 3 admin theme with laravel application.
Step for Laravel 11 Integrate AdminLTE 3 Theme
- Step 1: Install Laravel 11
- Step 2: Install jeroennoten/laravel-adminlte
- Step 3: Install AdminLTE 3 Theme
- Step 4: Install Laravel UI for Auth Scaffolding
- Step 5: Use AdminLTE Sections
- Run Laravel App
Step 1: Install Laravel 11
This step is not required; however, if you have not created the Laravel app, then you may go ahead and execute the below command:
composer create-project laravel/laravel example-app
Step 2: Install jeroennoten/laravel-adminlte
Now we need to install jeroennoten/laravel-adminlte composer package to setup adminlte theme. so, let's run the following command:
composer require jeroennoten/laravel-adminlte
Step 3: Install AdminLTE 3 Theme
Now we need to use the following command to install adminlte theme. so, let's run the following command:
php artisan adminlte:install
This commands will create configuration files, publish js css files and publish blade files.
you will see the config/adminlte.php file.
Step 4: Install Laravel UI for Auth Scaffolding
run the following command to install laravel ui and bootstrap auth scaffolding.
composer require laravel/ui
php artisan ui bootstrap --auth
Then, you can make the view replacements by executing the next artisan command:
php artisan adminlte:install --only=auth_views
Step 5: Use AdminLTE Sections
now, you can use the following theme and sections:
resources/views/home.blade.php
@extends('adminlte::page')
@section('title', 'Dashboard')
@section('content_header')
<h1>Dashboard</h1>
@stop
@section('content')
<p>Welcome to this beautiful admin panel.</p>
@stop
@section('css')
{{-- Add here extra stylesheets --}}
{{-- <link rel="stylesheet" href="/css/admin_custom.css"> --}}
@stop
@section('js')
<script> console.log("Hi, I'm using the Laravel-AdminLTE package!"); </script>
@stop
You can use the adminlte theme now.
I hope it can help you...
Hardik Savani
I'm a full-stack developer, entrepreneur and owner of ItSolutionstuff.com. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Laravel, Angular, Vue, Node, Javascript, JQuery, Codeigniter and Bootstrap from the early stage. I believe in Hardworking and Consistency.
We are Recommending you
- Laravel 11 Confirm Box Before Delete Record from Database
- Laravel 11 Localization | Create Multi Language in Laravel 11
- Laravel 11 Client Side Form Validation using JQuery
- Laravel 11 Pagination Add Query String Example
- Laravel 11 Inertia Vue JS CRUD Example Tutorial
- Laravel 11 Real-Time Notifications using Echo Socket.IO and Redis
- How to Compress Image Size in Laravel 11?
- Laravel 11 Add Watermark on Image Tutorial
- Laravel 11 Product Add to Cart Functionality Example
- How to Integrate Admin Template in Laravel 11?
- Laravel 11 Socialite Login with Slack Account Example
- Laravel 11 PayPal Payment Gateway Integration Example
- Laravel 11 User Roles and Permissions Tutorial