Theme Adminlte Laravel Package

Getting Started

Minimal Setup

1. Installation Add the package via Composer in your Laravel project:

   composer require cvepdb-cms/theme-adminlte
   

   Publish the package assets (AdminLTE theme) and configuration:

   php artisan vendor:publish --provider="Cvepdb\AdminLte\AdminLteServiceProvider" --tag="adminlte-assets"
   php artisan vendor:publish --provider="Cvepdb\AdminLte\AdminLteServiceProvider" --tag="adminlte-config"
   

2. Basic Integration

   • Include the AdminLTE CSS/JS in your resources/views/layouts/app.blade.php:

     @include('adminlte::partials.head')
     @include('adminlte::partials.scripts')
     

   • Extend the default layout (optional):

     @extends('adminlte::page')
     

3. First Use Case Create a simple admin dashboard view (resources/views/dashboard.blade.php):

   @extends('adminlte::page')
   @section('title', 'Dashboard')
   @section('content_header')
       <h1>Dashboard</h1>
   @stop
   @section('content')
       <p>Welcome to your AdminLTE dashboard!</p>
   @stop
   

   Link it in your routes/web.php:

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

Implementation Patterns

Layout and Structure

• Modular Sections Use AdminLTE’s built-in sections for consistency:

  @section('content_header')  <!-- Page header -->
  @section('content')         <!-- Main content -->
  @section('sidebar')         <!-- Sidebar content -->
  @section('css')             <!-- Custom CSS -->
  @section('js')              <!-- Custom JS -->
  

• Sidebar Integration Dynamically generate the sidebar menu using Laravel’s Blade:

  @section('sidebar')
      <ul class="sidebar-menu">
          @foreach(config('adminlte.menu') as $menu)
              <li class="treeview">
                  <a href="{{ route($menu['route']) }}">
                      <i class="fa {{ $menu['icon'] }}"></i>
                      <span>{{ $menu['label'] }}</span>
                  </a>
              </li>
          @endforeach
      </ul>
  @stop
  

Dynamic Configuration

• Theme Customization Override default AdminLTE settings in config/adminlte.php:

  'skin' => 'blue', // Change theme color
  'logo' => asset('images/logo.png'),
  'menu' => [
      ['label' => 'Dashboard', 'icon' => 'dashboard', 'route' => 'dashboard'],
  ],
  

• Conditional UI Use Blade directives to toggle UI elements:

  @if(auth()->user()->is_admin)
      @section('sidebar')
          <li><a href="{{ route('users.index') }}"><i class="fa fa-users"></i> <span>Users</span></a></li>
      @endif
  

Workflows

• Authentication Integration Combine with Laravel’s built-in auth:

  Route::middleware(['auth'])->group(function () {
      Route::get('/dashboard', 'DashboardController@index');
  });
  

  Extend the default login view (resources/views/auth/login.blade.php) to use AdminLTE’s login template:

  @extends('adminlte::auth.login')
  

• Form Handling Use AdminLTE’s form components (e.g., adminlte::form.input):

  @include('adminlte::form.input', [
      'type' => 'text',
      'name' => 'username',
      'label' => 'Username',
      'value' => old('username'),
  ])
  

Gotchas and Tips

Pitfalls

• Asset Paths Ensure public_path() or asset() is used for static files (e.g., logo, favicon) to avoid 404s. Example:

  'logo' => asset('images/logo.png'),
  

• Blade Cache Clear Blade cache after publishing assets:

  php artisan view:clear
  

• JQuery Conflicts AdminLTE relies on jQuery. If using Laravel Mix/Webpack, ensure jQuery is loaded before AdminLTE’s JS:

  <script src="{{ asset('js/jquery.min.js') }}"></script>
  @include('adminlte::partials.scripts')
  

Debugging

• Console Errors Check for missing files or routes by inspecting browser console (e.g., Uncaught ReferenceError: $ is not defined → jQuery not loaded).

• Route Debugging Use php artisan route:list to verify admin routes (e.g., dashboard).

Extension Points

• Custom Templates Override AdminLTE’s views in resources/views/vendor/adminlte/. Example:

  cp -r vendor/cvepdb-cms/theme-adminlte/resources/views/adminlte resources/views/vendor/adminlte
  

• Dynamic Menus Fetch menu items from the database:

  // In a controller
  $menu = Menu::where('user_id', auth()->id())->get();
  return view('dashboard', compact('menu'));
  

  <!-- In Blade -->
  @foreach($menu as $item)
      <li><a href="{{ $item->path }}">{{ $item->label }}</a></li>
  @endforeach
  

• Laravel Mix Integration Compile AdminLTE’s SASS/JS with Laravel Mix:

  // webpack.mix.js
  mix.sass('resources/sass/adminlte.scss', 'public/css');