DEV Community

Cover image for Django Admin Template - Volt Bootstrap 5
Sm0ke
Sm0ke

Posted on • Edited on • Originally published at blog.appseed.us

Django Admin Template - Volt Bootstrap 5

Hello Coders!

This article presents an open-source Django Admin Template that after the installation overwrites the default admin interface (all widgets). This Django Template is crafted on top of Bootstrap 5 using the latest version without a jQuery dependency by Themesberg.

For newcomers, Django is a leading web framework coded and actively supported by experienced developers that provides a default admin interface. Django Template Volt aims to enhance the admin section with a responsive layout and more appealing components and widgets.

Links


Django Admin Template Volt - Edit Users Page


The product can be downloaded and used via PyPi (as a Python package) using PIP:



$ pip install django-admin-volt
// OR
$ pip install git+https://github.com/app-generator/django-admin-volt.git


Enter fullscreen mode Exit fullscreen mode

Once the installation is complete, the next step is to update the Django configuration with a few things to activate the template:


👉 Step #1 - Add admin_volt to INSTALLED_APPS node in project settings:



  INSTALLED_APPS = (
        ...
        'admin_volt.apps.AdminVoltConfig',
        'django.contrib.admin',
    )


Enter fullscreen mode Exit fullscreen mode

👉 Step #2 - Check django.template.context_processors.request is enabled



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


Enter fullscreen mode Exit fullscreen mode

As specified by the product documentation, for legacy apps built with Django 1.8 (of bellow) the context processors should be specified using a different syntax:



    from django.conf import global_settings

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


Enter fullscreen mode Exit fullscreen mode

👉 Step #3 - Create the superuser and access the admin section



$ # Create Admin User
$ python manage.py createsuperuser
$ 
$ # Start the application (development mode)
$ python manage.py runserver # default port 8000


Enter fullscreen mode Exit fullscreen mode

Access the admin section in the browser: http://127.0.0.1:8000/admin/


✨ Django Dashboard Volt

This is an open-source Django Seed project that used the same UI as the admin template. The product can be downloaded and used directly from Github, without a registration lock. For more information about this Django dashboard, feel free to access the product page hosted by AppSeed:

Django Dashboard Volt open-source seed project - Product Features:

  • Up-to-date dependencies: Django 3.2.6 LTS
  • SCSS compilation via Gulp
  • SQLite Database, Django Native ORM
  • Modular design, clean code-base
  • Session-Based Authentication, Forms validation
  • Deployment scripts: Docker, Gunicorn / Nginx

Django Admin Template Volt - Open-source seed project crafted by AppSeed.


Thanks for Reading! For more resources, please access:

Top comments (8)

Collapse
 
creativetim_official profile image
Creative Tim

Good work there! 🔥

Collapse
 
sm0ke profile image
Sm0ke

🚀🚀

Collapse
 
uithemes profile image
ui-themes

Really nice ui ...

Collapse
 
sm0ke profile image
Sm0ke

🚀🚀

Collapse
 
zoltanszogyenyi profile image
Zoltán Szőgyényi

Thanks for sharing!

Collapse
 
sm0ke profile image
Sm0ke

🚀🚀

Collapse
 
crearesite profile image
WebsiteMarket

Thanks for writing!
Indeed, Django default admin UI needs sometimes enhancements

Collapse
 
sm0ke profile image
Sm0ke

🚀🚀