Change Django Admin panel template using django-jet

Amit Hadole   11 June,2021  

/media/blog_pics/2021/06/11/djangoVSjet_cover.png

Table of Content

  1. Introduction

  2. Why Django JET?

  3. Step 1: Create Virtual Environment

  4. Step 2: Create Project

  5. Step 3: Create Application

  6. Step 4: Installation

  7. Step 5: Install Apps Settings

  8. Step 6: Add URL

  9. Step 7: Create Model

  10. Step 8: Add model to admin.py file

  11. Step 9: Create database tables

  12. Step 10: Create Superuser

  13. Step 11: Run server

 

Introduction

django-jet is the Modern template for Django admin interface with improved functionality

 

Why Django JET?

  • New fresh look

  • Responsive mobile interface

  • Useful admin home page

  • Minimal template overriding

  • Easy integration

  • Themes support

  • Autocompletion

  • Handy controls

 

Step 1: Create Virtual Environment

$ virtualenv ENV

activate environment using following command

$ source ENV/bin/activate

 

Step 2: Create Project

create project my_project using the following command and enter into that project.

$ django-admin startproject my_project

 

Step 3: Create Application

create app 'jet_app'

$ python manage.py startapp jet_app

 

Step 4: Installation

Install django

$ pip install django

 

 

Download and install the Django3 compatible version of Django JET:

$ pip install https://github.com/Barukimang/django-jet/archive/dev.zip
OR
$ easy_install https://github.com/Barukimang/django-jet/archive/dev.zip

 

 

Step 5: Install Apps Settings

Add ‘jet’ application to the INSTALLED_APPS setting of your Django project settings.py file.

INSTALLED_APPS = (
    ...
    'jet',
    'django.contrib.admin',
)

 

 



Note:  It should be before ‘django.contrib.admin’.

 

Make sure django.template.context_processors.request context processor is enabled in settings.py (Django 1.8+ way):

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                ...
                'django.template.context_processors.request',
                ...
            ],
        },
    },
]

 

 

 

Before Django 1.8 you should specify context processors different way. Also use

django.core.context_processors.request instead of django.template.context_processors.request.

from django.conf import global_settings

TEMPLATE_CONTEXT_PROCESSORS = global_settings.TEMPLATE_CONTEXT_PROCESSORS + (
    'django.core.context_processors.request',
)

 

Step 6: Add URL

Add URL-pattern to the urlpatterns of your Django project urls.py file (they are needed for related–lookups and autocompletes):

urlpatterns [
    '',
    path('jet/', include('jet.urls', 'jet')),  # Django JET URLS
    path('admin/', include(admin.site.urls)),
    ...
]

 

 

 

Step 7: Create Model

from django.db import models

# Create your models here.

class Post(models.Model):

        title = models.CharField(max_length=255)

        content = models.TextField()

        def __str__(self):

                return self.title

 

 

Step 8: Add model to admin.py file

from django.contrib import admin

from .models import *

 

# Register your models here.

admin.site.register(Post)

 

 

Step 9: Create database tables

$ python manage.py makemigrations



$ python manage.py migrate jet
OR 
$ python manage.py syncdb

 

Collect static if you are in the production environment:

$ python manage.py collectstatic

Clear your browser cache

 

Step 10: Create Superuser

$ python manage.py createsuperuser

 

Step 11: Run server

$ python manage.py runserver

open http://127.0.0.1:8000/admin URL in browser and login

You will see our admin panel look like this

 

0
Like