Laravel Gentelella Laravel Package

Getting Started

This is not a Composer library you require — it is a full Laravel 5.4 application skeleton with the Gentelella admin theme pre-wired. Treat it as a project template, not a dependency.

Bootstrap the project:

git clone https://github.com/florientr/laravel-gentelella my-app
cd my-app
composer install
cp .env.example .env
php artisan key:generate
# edit .env for DB credentials
php artisan migrate
npm install
npm run dev        # or: npm run watch
php artisan serve

Where to look first, in order:

1. routes/web.php — see the existing auth + dashboard + CRUD routes.
2. resources/views/layouts/ — the master Blade layout and its partials (sidebar, top nav, footer scripts). This is the heart of the theme integration.
3. resources/views/home.blade.php (or the dashboard view) — the reference page showing widgets, panels, charts, and tables.
4. resources/assets/js/ and resources/assets/sass/ — the Mix entry points that pull in Gentelella's CSS/JS.
5. app/Http/Controllers/ — the bundled example controller(s) showing the controller → view data flow.

First use case: log in, land on the dashboard, then clone the dashboard view into a new resources/views/admin/reports/index.blade.php that @extends('layouts.app') and render a paginated Eloquent query in the existing .x_panel / .table markup. That exercises routing, controller, layout inheritance, and the theme's table styling in one pass.

Implementation Patterns

Blade layout inheritance. Every admin page extends the master layout and fills named sections. Match the section names used by the bundled views exactly (@section('content'), @section('scripts'), etc.); adding your own section requires editing the layout partial.

@extends('layouts.app')
@section('content')
  <div class="x_panel">
    <div class="x_title"><h2>Orders</h2></div>
    <div class="x_content">
      <table id="orders" class="table table-striped">...</table>
    </div>
  </div>
@endsection
@section('scripts')
  <script>$('#orders').DataTable();</script>
@endsection

Sidebar and navigation. Menu items live in a Blade partial (typically layouts/partials/sidebar). Extend it by duplicating the <li> + <a href="{{ route(...) }}"> pattern, and set the active class with a Request::is(...) or route check so the highlight follows the current page.

Widgets and panels. Gentelella's UI is a fixed vocabulary of .x_panel, .x_title, .x_content, .dashboard_graph, .widget, and tile markup. The fastest reliable path is copy-paste from the bundled dashboard view rather than authoring new CSS — the theme's typography, spacing, and colors assume that structure.

Charts. Pass data from the controller as a plain array and hand it to JS with @json(...) in the scripts section, then initialize Chart.js/Morris in the same block. Keep the initialization in the page's @section('scripts') so it runs after the vendor bundle loaded in the layout footer.

DataTables. Give the table an id, then initialize in the scripts section. For anything beyond a few hundred rows, use server-side processing (ajax: pointing at a JSON route with ->paginate()-style limits); Gentelella's example tables are client-side.

CRUD scaffolding. Follow the bundled user-management example: resourceful route → controller with index/create/store/edit/update/destroy → Blade views reusing the theme's form fields (form-group, form-control) and $errors display. Bootstrap 3 form markup is what the theme expects.

Auth reuse. The repo ships Laravel's make:auth style controllers and views already styled. Extend the existing users table/routes for roles or profile pages rather than re-running make:auth, which would overwrite the themed views.

Asset pipeline. Add new CSS/JS by importing it in resources/assets/sass/app.scss or resources/assets/js/app.js and letting Mix compile. Avoid editing public/css / public/js directly — those are build outputs.

Gotchas and Tips

• Laravel 5.4 is end-of-life. PHP 7.0–7.2 era constraints; modern PHP 8+ and current Composer will likely fail on dependency resolution. Expect to either run it in an old container or budget time to upgrade Laravel and the theme.
• It is Bootstrap 3. Do not paste Bootstrap 4/5 or Tailwind snippets — grid classes, .panel/.card naming, and utility classes will silently misbehave.
• jQuery is a hard prerequisite. Gentelella's plugins (DataTables, Morris, datepicker, FullCalendar, bootstrap-daterangepicker) attach to window.jQuery. If you bundle jQuery with webpack or load it after plugins, widgets die with $ is not a function. Preserve the script order in the layout footer.
• Two asset locations exist. Some vendor assets may still be served from public/ while others are compiled by Mix. Before debugging a missing style, confirm which pipeline owns the file — running npm run dev will not pick up anything under public/.
• CSRF on AJAX. Ensure the layout exposes <meta name="csrf-token"> and that your DataTables/CRUD AJAX sends X-CSRF-TOKEN, or POSTs will 419.
• Sidebar active state needs manual wiring. The theme toggles visual state via classes only — nothing computes the current route for you.
• @json over string concatenation. For chart datasets, @json($data) from Blade avoids quote-escaping bugs and keeps you safe from XSS in labels.
• Cache-busting via Mix. Reference assets with {{ mix('js/app.js') }} (5.4 syntax) so deploys don't serve stale bundles; the theme's older elixir() calls need converting if you mix versions.
• Debugging blank widgets: open the browser console first — a single failing plugin (often FullCalendar locale or moment.js ordering) aborts the rest of the inline init scripts on the page.
• Upstream the theme, not the repo. Gentelella itself is maintained as puikinsh/gentelella; for template bugfixes, diff against upstream rather than waiting on this scaffold, which has no meaningful activity.
• Extension points: the cleanest customization seams are the sidebar/nav partials, the master layout's section names, and the Mix entry files. Forking the vendor CSS is a last resort — it makes future theme updates impossible.