Free Django Admin Template - Volt Design

Open-source Django Admin Template for styling the default Admin Section. The product can be downloaded and used as a package via PyPi.

Django Admin Template - Volt Bootstrap 5.
Django Admin Template - Volt Bootstrap 5.

This article presents an open-source Django Admin Template that covers the frontend pages like Dashboard, Login, Register but also the admin section using the same UI/UX design: Django Admin Volt. This aspect might be important for end-products where the client has access to the administration section and might request a unified design across all sections of the project.  For newcomers, Django is a leading web framework crafted by experienced developers using a batteries-included concept. Thanks for reading!

Django Admin Template Volt - Users Page styled with Volt Bootstrap 5 design.
Django Admin Template Volt - Users Page

Design Presentation

Volt Bootstrap 5 is provided by Themesberg a quality-oriented company that actively supported this design in two flavors: premium and open-source (the version used by the template).  Volt is a free and open-source Bootstrap 5 Admin Dashboard featuring over 100 components, 11 example pages, and 3 plugins with Vanilla JS.

100+ Components - There is more than 100 free Bootstrap 5 components included some of them being buttons, alerts, modals, date pickers.

11 Example Pages - Volt brings 11 example pages including an overview, sign in, sign up, transactions page, and many more. There are 3 lightweight and Vanilla JS plugins that come with Volt, namely a date picker, notification and charts library.

Django Admin Template Volt - Login Page.
Django Admin Template Volt - Login Page
Django Admin Template - Dashboard Page
Django Admin Template Volt - Dashboard Page.
Django Admin Template Volt - Dashboard Page
Django Admin Template - Profile Page
Django Admin Template Volt - Widgets Page.
Django Admin Template Volt - Widgets Page

Build the Product

Django Admin Template Volt can be used with a few commands typed in the terminal window by following the information provided in the official docs. Before trying a build, please make sure your workstation has a minimal programming kit already installed and accessible in the terminal: Python3, GIT, and a modern code editor like Atom or VsCode.

👉 Step 1 - Clone the sources from the public repository

$ git clone https://github.com/app-generator/django-dashboard-volt.git
$ cd django-dashboard-volt
Django Admin Template Volt - Clone Sources

👉 Step 2 - Install modules using a virtual environment

$ virtualenv env
$ source env/bin/activate
$
$ pip3 install -r requirements.txt
Django Admin Template Volt - Install Modules

👉 Step 3 - Install the Volt Admin Template (separate package)

$ pip install django-admin-volt
Django Admin Template Volt - Install Admin Theme

👉 Step 4 - Update Django Settings to include the theme

    INSTALLED_APPS = (
        ...
        'admin_volt.apps.AdminVoltConfig',
        'django.contrib.admin',
    )
Django Admin Template Volt - Update Settings

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',
                    ...
                ],
            },
        },
    ]
Django Admin Template Volt - Check Configuration

👉 Step 5 - Migrate the database (aka create tables)

$ python manage.py makemigrations
$ python manage.py migrate 
Django Admin Template Volt - Migrate Database

👉 Step 6 - Create a superuser to access the admin section

$ python manage.py createsuperuser
Django Admin Template Volt - Create Superuser

👉 Step 7 - Start the app and access the admin section

$ # Start the application (development mode)
$ python manage.py runserver # default port 8000
Django Admin Template Volt - Start App

Once the app is started, we should see a link on the presentation page to the admin section.

Django Admin Template Volt - Index Page.
Django Admin Template - Users page
Django Admin Template Volt - Users page.
Django Admin Template Volt - Users page

Thanks for reading! For more resources, please access: