New in v6: How to change themes in Backpack v6

Hey there! In Backpack v6, we introduced themes so that you can add a bit of personality to your admin panels! Changing themes is a bre...

Hey there! In Backpack v6, we introduced themes so that you can add a bit of personality to your admin panels! Changing themes is a breeze – you can do it within a couple of minutes, and we've got three fantastic new themes to choose from.

How to use themes:

Each theme is a separate Composer package containing blade files that Backpack uses to display the interface to its admins. At this moment, we have three ready-to-use themes for you to pick from:

• Tabler - based on Boostrap v5 and has dark mode support
• CoreUIv4 - also based on Bootstrap v5 & CoreUIv4
• CoreUIv2 - the legacy one based on Bootrap v4 (still has IE support)

Install & use

To switch to a different theme, first you'll need to install it like below:

composer require backpack/theme-tabler

Then you'll need to tell Backpack to use the new theme. Backpack checks the configuration in config/backpack/ui.php. In this file, get to the section with view_namespace and make sure you override it with this:

    'view_namespace'          => 'backpack.theme-tabler::',
    'view_namespace_fallback' => 'backpack.theme-tabler::',

Here's the deal:

• To specify a new theme, change the view_namespace setting. You can even point to a local view directory if you wish.
• The view_namespace_fallback setting serves as a fallback mechanism. If a view isn't found in the first namespace, Backpack looks in this fallback namespace.

That's it! Reload your browser and you should have the new theme working.

Theme Configs:

Each theme can also provide its own config file, so you may:

• publish theme config php artisan vendor:publish --tag="theme-tabler-config"
• modify config/backpack/{theme-config}.php to set layouts, classes, etc

Through its own config files, themes allow you to make it the best fit for your project.

Creating a New Theme:

Creating a new theme for your Backpack project is much easier. Follow this link for details: https://backpackforlaravel.com/docs/6.x/add-ons-tutorial-how-to-create-a-theme.

That's it for themes in Backpack v6! Choose the one that suits your project's needs, and enjoy the flexibility and power of the new theming system.

Happy theming! 🎨