CoderFunda
  • Home
  • About us
    • Contact Us
    • Disclaimer
    • Privacy Policy
    • About us
  • Home
  • Php
  • HTML
  • CSS
  • JavaScript
    • JavaScript
    • Jquery
    • JqueryUI
    • Stock
  • SQL
  • Vue.Js
  • Python
  • Wordpress
  • C++
    • C++
    • C
  • Laravel
    • Laravel
      • Overview
      • Namespaces
      • Middleware
      • Routing
      • Configuration
      • Application Structure
      • Installation
    • Overview
  • DBMS
    • DBMS
      • PL/SQL
      • SQLite
      • MongoDB
      • Cassandra
      • MySQL
      • Oracle
      • CouchDB
      • Neo4j
      • DB2
      • Quiz
    • Overview
  • Entertainment
    • TV Series Update
    • Movie Review
    • Movie Review
  • More
    • Vue. Js
    • Php Question
    • Php Interview Question
    • Laravel Interview Question
    • SQL Interview Question
    • IAS Interview Question
    • PCS Interview Question
    • Technology
    • Other

03 May, 2022

Laravel Themer package: add multi-theme support for Laravel application

 Programing Coderfunda     May 03, 2022     Laravel, Packages     No comments   

 This Laravel Themer package adds multi-theme support to your Laravel application. It also provides a simple authentication scaffolding and presets for Bootstrap, Tailwind, Vue, and React as a starting point for building a Laravel application.

In my opinion, this Laravel Themer package is a better alternative to the official laravel/ui & laravel/breeze packages because of the following features:

  • Any number of themes
  • Fallback theme support (WordPress style); It allows creating a child theme to extend any theme
  • Provides authentication scaffolding similar to laravel/ui & laravel/breeze
  • Exports all auth controllers, tests, and other files similar to laravel/breeze
  • Provides frontend presets for Bootstrap, Tailwind, Vue 2, Vue 3, and React

If you don't want to use this package's auth scaffolding, instead, you want to use Laravel Fortify, no problem with that. You can use Laravel Themer with Fortify as well. Laravel Fortify is a frontend agnostic authentication backend for Laravel, and it does not provide views or frontend presets. So, use Fortify for backend authentication and Laravel Themer for your views, presets, and for multi-theme support.

Video Tutorial

Installation

Install via composer

1composer require qirolab/laravel-themer

Publish a configuration file:

1php artisan vendor:publish --provider="Qirolab\Theme\ThemeServiceProvider" --tag="config"

Creating a theme

Use the following command to create a theme:

1php artisan make:theme

Create theme

Middleware to set a theme

Register ThemeMiddleware in app\Http\Kernel.php:

1protected $routeMiddleware = [
2 // ...
3 'theme' => \Qirolab\Theme\Middleware\ThemeMiddleware::class,
4];

Examples for middleware usage:

1Route::get('/dashboard', 'DashboardController@index')
2 ->middleware('theme:dashboard-theme');

Theme methods:

1// Set active theme
2Theme::set('theme-name');
3 
4// Get current active theme
5Theme::active();
6 
7// Get current parent theme
8Theme::parent();
9 
10// Clear theme. So, no theme will be active
11Theme::clear();
12 
13// Get theme path
14Theme::path($path = 'views');
15// output:
16// /app-root-path/themes/active-theme/views
17 
18Theme::path($path = 'views', $themeName = 'admin');
19// output:
20// /app-root-path/themes/admin/views
21 
22Theme::getViewPaths();
23// Output:
24// [
25// '/app-root-path/themes/admin/views',
26// '/app-root-path/resources/views'
27// ]

webpack.mix.js Configuration

After creating a new theme, it creates a separate webpack.mix.js file for that theme. So, to compile the theme's webpack.mix.js file it should be included in the app's webpack.mix.js that is located in the root path.

1// add this in the root `webpack.mix.js`
2require(`${__dirname}/themes/theme-name/webpack.mix.js`);

In the case of multiple themes, If you add multiple webpack.mix.js of different themes. Then webpack may not compile these correctly. So, you should modify the root webpack.mix.js with the following code:

1let theme = process.env.npm_config_theme;
2 
3if(theme) {
4 require(`${__dirname}/themes/${theme}/webpack.mix.js`);
5} else {
6 // default theme to compile if theme is not specified
7 require(`${__dirname}/themes/theme-name/webpack.mix.js`);
8}

Now, you can use the following command to compile assets for a particular theme:

1npm run dev --theme=theme-name
  • Share This:  
  •  Facebook
  •  Twitter
  •  Google+
  •  Stumble
  •  Digg
Email ThisBlogThis!Share to XShare to Facebook

Related Posts:

  • Laravel APP_ENV config <?phpLaravel APP_ENV configdd(env('APP_NAME'));if (\Illuminate\Support\Facades\App::environment('production')) {    // The environm… Read More
  • Laravel array search blade <?php“Laravel array search blade”{{in_array($node->id, $result["category"]) === true ? "selected" : ""}}… Read More
  • Laravel array cast <?php“Laravel array cast”use Illuminate\Database\Eloquent\Casts\AsCollection;/** * The attributes that should be cast. * * @va… Read More
  • Laravel append parameter to links “Laravel append parameter to links”$users->appends(request()->all())->links()… Read More
  • Laravel array in lang <?php“Laravel array in lang” You can get the entire array with Lang::get().$array = Lang::get('pagination'); // return entire array$text &nbs… Read More
Newer Post Older Post Home

0 comments:

Post a Comment

Thanks

Meta

Popular Posts

  • Vue3 :style backgroundImage not working with require
    I'm trying to migrate a Vue 2 project to Vue 3. In Vue 2 I used v-bind style as follow: In Vue 3 this doesn't work... I tried a...
  • SQL ORDER BY Keyword
      The SQL ORDER BY Keyword The ORDER BY keyword is used to sort the result-set in ascending or descending order. The ORDER BY keyword sorts ...
  • Enabling authentication in swagger
    I created a asp.net core empty project running on .net6. I am coming across an issue when I am trying to enable authentication in swagger. S...
  • failed to load storage framework cache laravel excel
       User the export file and controller function  ..         libxml_use_internal_errors ( true ); ..Good To Go   public function view () : ...
  • AdminJS not overriding default dashboard with custom React component
    So, I just started with adminjs and have been trying to override the default dashboard with my own custom component. I read the documentatio...

Categories

  • Ajax (26)
  • Bootstrap (30)
  • DBMS (42)
  • HTML (12)
  • HTML5 (45)
  • JavaScript (10)
  • Jquery (34)
  • Jquery UI (2)
  • JqueryUI (32)
  • Laravel (1017)
  • Laravel Tutorials (23)
  • Laravel-Question (6)
  • Magento (9)
  • Magento 2 (95)
  • MariaDB (1)
  • MySql Tutorial (2)
  • PHP-Interview-Questions (3)
  • Php Question (13)
  • Python (36)
  • RDBMS (13)
  • SQL Tutorial (79)
  • Vue.js Tutorial (68)
  • Wordpress (150)
  • Wordpress Theme (3)
  • codeigniter (108)
  • oops (4)
  • php (853)

Social Media Links

  • Follow on Twitter
  • Like on Facebook
  • Subscribe on Youtube
  • Follow on Instagram

Pages

  • Home
  • Contact Us
  • Privacy Policy
  • About us

Blog Archive

  • September (100)
  • August (50)
  • July (56)
  • June (46)
  • May (59)
  • April (50)
  • March (60)
  • February (42)
  • January (53)
  • December (58)
  • November (61)
  • October (39)
  • September (36)
  • August (36)
  • July (34)
  • June (34)
  • May (36)
  • April (29)
  • March (82)
  • February (1)
  • January (8)
  • December (14)
  • November (41)
  • October (13)
  • September (5)
  • August (48)
  • July (9)
  • June (6)
  • May (119)
  • April (259)
  • March (122)
  • February (368)
  • January (33)
  • October (2)
  • July (11)
  • June (29)
  • May (25)
  • April (168)
  • March (93)
  • February (60)
  • January (28)
  • December (195)
  • November (24)
  • October (40)
  • September (55)
  • August (6)
  • July (48)
  • May (2)
  • January (2)
  • July (6)
  • June (6)
  • February (17)
  • January (69)
  • December (122)
  • November (56)
  • October (92)
  • September (76)
  • August (6)

  • Failed to install 'cordova-plugin-firebase': CordovaError: Uh oh - 9/21/2024
  • pyspark XPath Query Returns Lists Omitting Missing Values Instead of Including None - 9/20/2024
  • SQL REPL from within Python/Sqlalchemy/Psychopg2 - 9/20/2024
  • MySql Explain with Tobias Petry - 9/20/2024
  • How to combine information from different devices into one common abstract virtual disk? [closed] - 9/20/2024

Laravel News

  • Efficiently remove expired cache data with Laravel Cache Evict - 6/3/2025
  • Test Job Failures Precisely with Laravel's assertFailedWith Method - 5/31/2025
  • Prism Relay - 6/2/2025
  • Enhance Collection Validation with containsOneItem() Closure Support - 5/31/2025
  • Filament Is Now Running Natively on Mobile - 5/31/2025

Copyright © 2025 CoderFunda | Powered by Blogger
Design by Coderfunda | Blogger Theme by Coderfunda | Distributed By Coderfunda