Skip to content

Basic Configuration

Diego Smania edited this page Aug 4, 2022 · 11 revisions

In order to change the package configuration, the configuration file should be published. So if you don't see the adminlte.php file inside the config folder, then publish the configuration file with the next command:

php artisan adminlte:install --only=config

Now, you are able to edit the config/adminlte.php file to configure the title, layout, menu, URLs etc. On the next sections, we going to review all the available configuration options. Let starts with the most basic ones.

Title

This is the default title for your admin panel, this goes into the title tag of your page. However, you can override it per page with the available title section. Optionally, you can also specify a title prefix and/or postfix.

The following config options are available:

  • title: The default title.
  • title_prefix: The title prefix.
  • title_postfix: The title postfix.

Favicon

Favicons could be used easily. There are two different ways to do this. Take in mind that all the favicons should be placed in the public/favicons/ folder. The next two combinations determines how the favicons will be used:

  • ['use_ico_only' => true, 'use_full_favicon' => false]

    Whit the previous configuration, the file public/favicons/favicon.ico will be used.

  • ['use_ico_only' => false, 'use_full_favicon' => true]

    Whit the previous configuration, multiple favicon files located on the public/favicons/ folder will be used. The current code to use multiple favicons is the next one:

    <link rel="shortcut icon" href="{{ asset('favicons/favicon.ico') }}"/>
    <link rel="apple-touch-icon" sizes="57x57" href="{{ asset('favicons/apple-icon-57x57.png') }}">
    <link rel="apple-touch-icon" sizes="60x60" href="{{ asset('favicons/apple-icon-60x60.png') }}">
    <link rel="apple-touch-icon" sizes="72x72" href="{{ asset('favicons/apple-icon-72x72.png') }}">
    <link rel="apple-touch-icon" sizes="76x76" href="{{ asset('favicons/apple-icon-76x76.png') }}">
    <link rel="apple-touch-icon" sizes="114x114" href="{{ asset('favicons/apple-icon-114x114.png') }}">
    <link rel="apple-touch-icon" sizes="120x120" href="{{ asset('favicons/apple-icon-120x120.png') }}">
    <link rel="apple-touch-icon" sizes="144x144" href="{{ asset('favicons/apple-icon-144x144.png') }}">
    <link rel="apple-touch-icon" sizes="152x152" href="{{ asset('favicons/apple-icon-152x152.png') }}">
    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('favicons/apple-icon-180x180.png') }}">
    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('favicons/favicon-16x16.png') }}">
    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicons/favicon-32x32.png') }}">
    <link rel="icon" type="image/png" sizes="96x96" href="{{ asset('favicons/favicon-96x96.png') }}">
    <link rel="icon" type="image/png" sizes="192x192"  href="{{ asset('favicons/android-icon-192x192.png') }}">
    <link rel="manifest" href="{{ asset('favicons/manifest.json') }}">
    <meta name="msapplication-TileColor" content="#ffffff">
    <meta name="msapplication-TileImage" content="{{ asset('favicons/ms-icon-144x144.png') }}">

Google Fonts

Important: The next configuration is only available for package versions greater than v3.8.2

By default, the provided admin panel layout includes some google fonts, and you should note they are an external resource. However, this may introduce performance issues in environments where the internet access is restricted somehow. For those scenarios, you may use the next option to disable the usage of external google fonts.

  • google_fonts.allowed: Whether to allow the inclusion of external google fonts.

Logo

The logo is displayed at the upper left corner of your admin panel. You can use basic HTML code here if you want a simple text logo with a small image logo (e.g. 50 x 50 pixels), or you can use two images: one big (e.g. 210 x 33 pixels) and one small (e.g. 50 x 50 pixels). You can also change the sizes of the images and the alternate text for both logos. The available option are:

  • logo: The text logo content, can use HTML code.
  • logo_img: The path to the small logo image. The recommend size is: 50x50px
  • logo_img_class: Extra classes for the small logo image.
  • logo_img_xl: The path to the large logo image, if you set a img url here, then it will replace the text & small logo with one big logo. When the sidebar is collapsed it will displays only the small logo. The recommend size is: 210x33px
  • logo_img_xl_class: Extra classes for the large logo image.
  • logo_img_alt: The alternate text for the logo images.

Preloader Animation

Important: The next configuration is only available for package versions greater than v3.8.2

The next options lets you enable, disable and configure the preloader animation. The preloader animation, when enabled, will be shown while a page is loading, and then will be hidden automatically.

  • preloader.enabled: Whether to enable or disable the preloader animation.
  • preloader.img.path: The path to the logo image that will be used on the preloader animation. This image should be available somewhere inside the public folder of your Laravel project (if you did not change the asset_url config).
  • preloader.img.alt: The alternative text to use when the image can't be found or isn't available.
  • preloader.img.effect: The animation effect to use on the image, the available values are: animation__shake or animation_wobble.
  • preloader.img.width: The width (on pixels) to use for the image.
  • preloader.img.height: The height (on pixels) to use for the image.

User Menu

The user menu is displayed at the upper right corner of your admin panel. The available options for the user menu are:

  • usermenu_enabled

    Whether to enable the user menu instead of the default logout button.

  • usermenu_header

    Whether to enable the header section inside the user menu.

  • usermenu_header_class

    Extra classes for the header section inside the user menu.

  • usermenu_image

    Whether to enable the user image for the usermenu & lockscreen.

    Important: for this feature, you will need to add an extra function named adminlte_image() inside the User model, usually located on the app/User.php file. The recommend image size is: 160x160px.

  • usermenu_desc

    Whether to enable the user description for the usermenu.

    Important: for this feature, you will need to add an extra function named adminlte_desc() inside the User model, usually located on the app/User.php file.

  • usermenu_profile_url

    Whether to enable if the user profile url can be set dynamically for the user instead of using the config option profile_url.

    Important: for this feature, you need to add an extra function named adminlte_profile_url() inside the User model. The return value should be a string, not a route or url.

Example Code of User Image and Description

Here you have an example code for the User model with the custom image, description and profile url functions.

class User extends Authenticatable
{
    …

    public function adminlte_image()
    {
        return 'https://picsum.photos/300/300';
    }

    public function adminlte_desc()
    {
        return 'That\'s a nice guy';
    }

    public function adminlte_profile_url()
    {
        return 'profile/username';
    }
}

URLs

The next configuration options provides a way to setup the urls for the login, register and other links of the admin panel. You can change your dashboard, logout, login and register URLs.

  • use_route_url

    Whether to use route() instead of the url() Laravel method to generate the urls.

  • dashboard_url

    Changes the dashboard/logo URL. This URL will be used, for example, when you click on the upper left logo.

  • logout_url

    Changes the logout button URL. This URL will be used when you click on the logout button.

  • logout_method

    Changes the logout send method, the available options are: GET, POST & null (Laravel default).

    Note: the logout URL automatically sends a POST request in Laravel 5.3 or higher.

  • login_url

    Changes the login URL. This URL will be used when you click on the login button.

  • register_url

    Changes the register URL. Set this option to false to hide the register link shown on the login view.

  • password_reset_url

    Changes the password reset URL. This url should point to the view that displays the password reset form. Set this option to false to hide the password reset link shown on the login view.

  • password_email_url

    Changes the password email URL. This url should point to the view that displays the send reset link form.

  • profile_url

    Changes the user profile URL. When not false, it will displays a button in the user menu.