How to install and setup Django Jet theme?

How to install and setup Django Jet theme?

Customize the Django Admin With a Modern Theme

Play this article

Django JET is a great library to modernize your classic Django admin panel into something modern, styling and customizable admin panel.

For comparison, here is how the classic Django admin panel looks like:

django-admin-models-added.png

After customization, it will look something like this:

0_gNs7RMXMQlB96OXb.png

Looks cool, huh? Let's customize the admin panel and make it look cool.

Installation:

First install the Django Jet Reboot package in your Django project.

pip install django-jet-reboot

Setup:

  • Add jet package at the top of your INSTALLED_APPS list in the Django settings.py file, it is important to note that the jet package should be added at the top of the INSTALLED_APPS list so that all the admin templates can be overridden.

    INSTALLED_APPS = [
        'jet',
        ...
    ]
    
  • Now you have to open our root urls.py file and add this url path at the top of the urlpatterns list.

    ...
    
    urlpatterns = [
        path('jet/', include('jet.urls', 'jet')),
        path('admin/', include(admin.site.urls)),
        ...
    )
    
    ...
    
  • You are all setup, just run the migrate command and your new admin theme has been installed.

    python manage.py migrate jet
    
  • Let’s do one last thing, which is to change the color of our new theme. (This is optional, you can skip to the next step). Just open the settings.py file, and add this code at the end to change the color of new Django admin theme.

    JET_DEFAULT_THEME = 'light-violet'
    

    You have other color options such as:

    1. default

    2. green

    3. light-violet

    4. light-green

    5. light-blue

    6. light-gray

Now your admin will look something like this:

Any doubts? Write it down in the comments.

For more such crispy blogs daily, follow Dev.Junction, subscribe to our newsletter and get notified.

Did you find this article valuable?

Support Dev.Junction by becoming a sponsor. Any amount is appreciated!