How to Integrate AdminLTE 3 in Laravel 11?

By Hardik Savani September 11, 2024 Category : Laravel

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.

Output:

I hope it can help you...

Shares